FrDancers

  1. 1. Empathy
    Arrow Right Line Arrow Right
  2. 2. Ideation
    Arrow Right Line Arrow Right
  3. 3. Prototyping and UI Design

Brief Description

FrDancers* is a dance video platform designed for primarily to target amateur dancers with less than a year of dancing experience. Based on user interviews and user journey mapping of ITE College dancers, my team and I have come up with a concept app to push potential dancers to pursue dance, improve their dance skills and finally, gain enough confidence to join a dance programme.

This project aimed to solve Scape's design challenge - "How might we redesign our programmes to ensure that they are relevant and effective for our youths?".


Prototyping

To understand the essential features of the Feedback Platform Application, we wrote down user stories, and categorised each of them into 3 main features:

  1. Discover Dance Videos
  2. Dance Communities
  3. Dance Challenges

For example, for discovering dance videos, the following are some user stories:

  • As a user, I can view videos according to the dance genre
  • As a user, I can mark comment, reply, or video as helpful (help a person to gain points)
  • As a user, I can see trending dance videos

With these requirements set, I was tasked to design the UI.

UI Design

To quickly get started, I used Sketch and the Apple Design UI Library. For every new UI design I do, I spend a good 4-6 hours trying to get the right colour scheme and also how each of the components will look like.

Discover dance videos (Home) Discover dance videos (Home)

My design was heavily inspired by YouTube, the master of user-uploaded video community platform. I used a dark theme to emphasise the videos, while focusing on the video thumbnails. I figured that stories would be a good way to easily (or lazily) discover dance videos by various video channels.

With this screen, our point was to get dancers to widen their horizon by discovering all sorts of dance genres, and also to provide them with a one-stop platform for all dance videos. They can learn and get motivated from other dancers by giving or receiving feedback via comments on the dance videos they upload.

Dance Communities Dance Communities

The main point of dance communities was to allow dancers to find other similar dancers, learn from them, or even practice dance together once they get to know them. Communities can either be private (for small teams) or public (for idol groups and fans). They can easily catch-up on their communities' updates, receive or give feedback and participate in dance challenges.

Dance Challenges Dance Challenges

To encourage and motivate dancers to challenge themselves, they can participate in challenges that interest them. For example, one of such programme would be to submit their dance cover via the app and the chosen few dancers will get the chance to meet and dance alongside their dance idols!

Introductory Video

Enjoy a video that summarises the features. This video was made in iMovie, using a series of animations by Rotato.xyz. At this point in time, I was still using the free version of Rotato but I have since bought it to support them!


Thank you for reading and I hope you have enjoyed this series!

design

Other posts

Figma Dev Mode First Impressions Hero Blog
 

Figma Dev Mode First Impressions • 2023

A product engineer’s first impression of Figma’s Dev Mode
RushTrail Hero Showcase
 

RushTrail • 2020

RushOwl is a startup that aims to bring the convenience of bus shuttle service to the masses.
sBox Hero Showcase
 

sBox • 2020

Secure File Manager UI Design
Sketch Prototyping with Fixed Elements Hero Blog
 

Sketch Prototyping with Fixed Elements • 2019

Creating vertical scrolling prototype in Sketch with fixed elements
SMUMods Hero Showcase
 

SMUMods • 2018

Personal group project for SMU students to review their Professors and modules

Contact