About

YAP! is a web based intercative screen. It shows taekwondo poomsae movement to let users to learn it themselves and check video record to visualize how they did it, so that they can practice outside od the class easily.

Problem

I trained taekwondo since 2014. While learing it, I found ‘poomsae’ which is established pattern focused on kicking and punching skills trainee must know. from 2016 I had a chance to teach children whose age group is 5 to 7 year-old. A lot of children took a lot of time practising poomsae to get higher level, but because of limited class time it takes long time to get it. Most of their parents were asking me some reference for them, and even asked me on private lesson on poomsae. From that experience, when I developing my thesis I sarted with idea “How can I improve the learning experience of children’s basic taekwondo technics?”.

Goal / Solution

YAP! is a web based intercative screen. It shows taekwondo poomsae movement to let users to learn it themselves and check video record to visualize how they did it, so that they can practice outside of the class easily. It will be divided into movement by movement to follow each technic easily and let users compare their recorded movements with examples through the screen.

Target audience

Primary target
  • Children who are training WT (World Taekwondo) olympic style taekwondo
  • Gender not applicapable
  • 7 to 12-year-old
  • Expected to have belt that are lower rank than black belt.
Secondary target
  • People training Olympic style Taekwondo
  • Gender not applicapable
  • Teenagers to 20s
  • Expected to have belt that are lower rank than black belt.

Persona

Mary Costello
  • Age: 12
  • Occupation: Student
  • Family: Parents, younger brother
  • Location: San Francisco, CA
  • Lifestyle: Play time!
User story

Mary started taekwondo few weeks ago. She just learned first few movement of Poomsae. During the class, even though instructors correct her technics, she feels not enough due to number of classmates they have to pay attention to. She stand in front of YAP! screen and follow the movement step by step. She make sure that she does right chamber before actual technics. She also check out the background information of the poomsae she learned before test.

Lina Yoon
  • Age: 19
  • Occupation: College student
  • Family: Single
  • Location: Berkeley,CA
  • Lifestyle: Adventurer
User story

Lina is looking forward to get her promotion test. She practice not only in gym but also at home. Unlike the gym, she doesnot have large mirror or instructor who can check on her when she is not doing well. Also, she want to check if mistakes she did last time is fixed now. She turn on YAP! and check out video history of her practice through the webpage.

Storyboard

Mary is a student who just started training taekwondo. After her regular takwondo class, she wants to practice poomsae on her own, but it is a bit confusing to remember whole movement on her own. She tried to follow videos from webpages and mobile apps, but it is tricky since it was not waiting for her when she missed a movement.
She turns on Yap! at home and practice with a character she customized beside video recorded by her webcam.

Task Flow

Task 1 - Learning Poomsae

Open homepage
|
Select the level of poomsae
|
Approve camera access
|
Start form/video record
|
Done
|
Save/Do it again/Delete

Task 2 - Check video history

Open homepage
|
Select video history
|
watch the video
|
Archive/Delete

Visual Concept

Moodboard
progressive
Playful
Fierce
Educational
Ambitious
Color palette
Sapphire blue

#4980DF (70, 127, 221)
#3471DB (50, 112, 218)
#2565D0 (37, 100, 208)
#215ABA (32, 90, 186)
#1D4FA5 (26, 78, 164)

Jasmin Yellow

#FFF37D (255, 248, 125)
#FFEE87 (255, 238, 135)
#FEE47D (254, 228, 125)
#FFDD66 (255, 221, 102)
#FFD760 (255, 215, 96)

Sketch
Low fidelity wireframe
Medium fidelity wireframe
Final mock-up

Logo design

Sketch
Digital exploration
Final logo
Logo anatomy

Logo animation