Jiu Jitsu Vocabulary

With the growing popularity and evolution of jiu-jitsu, understanding its terminology can be a hurdle for newcomers learning the sport.

  • Problem Statement

    People can learn jiu-jitsu well if they understand the vocabulary better.

  • My Role

    Using Marvel App, I created a low fidelity prototype of an app that helps practitioners learn jiu-jitsu vocabulary.

Competitor Analysis

Tiny Cards

  • Strengths

    • Tinycards gives the user options on how they want to learn, ie: with or without sound, type out the word or match.

    • The progress bar shows the user how much progress they made.

  • Weaknesses

    • Some headers are confusing and don’t describe the function of the page well.

    • Deck Collection could use further instructions. This feature could help prove useful for a jiu-jitsu vocabulary app.

Freerice

  • Stregnths

    • As the learner answers more correct questions, the rice bowl fills. This interaction is rewarding and engaging. The rice bowl indicates actual food that is donated to impoverished families by The United Nations World Food Programme.

    • The application also provides further engaging feedback to encourage the learners to keep playing.

  • Weaknesses

    • To sign up, the learner much go through the calendar UI and select their birthday. This can be tedious for older learners.

    • There isn’t a method to save flashcards for later.

User Research

  • Research Goal #1

    I am curious if jiu-jitsu practitioners think that they will learn better if they learn the terminology.

  • Research Goal #2

    I want to determine how jiu-jitsu practitioners feel when they talk about jiu-jitsu techniques.

  • Research Goal #3

    I want to understand how jiu-jitsu practitioners currently learn the jiu-jitsu terminology.

  • Judo icons created by Freepik

    Interviewee 1

    ● Age 24

    ●She/Her/Hers

    ● Denver

    ● Student

    ● Training 3 years

    ● Blue belt

    ● Prefers Windows

  • Fighter icons created by Freepik

    Interviewee 2

    ● Age 24

    ● He/Him/His

    ● Denver

    ● Gym Manager

    ● Training 4-5 years

    ● Blue belt

    ● Prefers Macs

  • Judo icons created by Freepik

    Interviewee 3

    ● Age 32

    ● He/Him/His

    ● Denver

    ● Police Officer

    ● Training 15 years

    ● Black belt

    ● Prefers iOS

  • Interviewee 4

    ● Age 41

    ● He/Him/His

    ● Denver

    ● Talent Acquisition Manager

    ● Training 13 years

    ● Purple belt

    ● Prefers iOS

  • Interviewee 5

    ● Age 34

    ● He/Him/His

    ● Denver

    ● Unemployed

    ● Training 1-2 years

    ● White belt

    ● Prefers Windows & Android

What I Learned

  • Gear icons created by Dave Gandy - Flaticon

    Doing

    ● Most Practitioners learn with kinetic and visual representations

    ● Most Practitioners learn words with repetition and context

    ● Some practitioners learn words quicker than others.

  • Think icons created by Freepik - Flaticon

    Thinking

    ● Interviewees find it’s important to use the correct word for techniques

    ● Practitioners think that learning in smaller junks is easier than learning in bigger junks

  • Feelings icons created by Freepik - Flaticon

    Feeling

    ● Practitioners feel that tying associations with the correct technical name and the techniques can be helpful.

    ● Practitioners that learned the terminology easily feel that they have learned jiu-jitsu quicker than other practitioners.

User Persona

  • Mary: “Empower more women to do jiu-jitsu!”

    ● 20 - 24

    ● A student

    ● Blue belt in jiu-jitsu

  • Behavior:

    ● Studies for 20 minute increments

    ● Asks a lot questions in class

    ● Uses hand gestures to explain a technique

    Needs:

    ● Visual and tactical cues for learning

    ● Learn the proper names for techniques

    ● Repetition for learning

    Goals:

    ● Continue BJJ and earn her black belt

    ● Encourage more women to train jiu-jitsu

    ● Communicate well with other teammates about techniques

User Flows

  • Onboarding

    ● Splash screen

    ● Onboarding pages

    ● Register for an account

    ● Continue searching for terms without being able to save them, or search for terms with an option to save terms to a deck

  • Search New Term & Add to Deck

    ● Open app

    ● Search a new term

    ● Add to a previously created or new deck

    ● Review term and continue search

Low Fidelity WireFrames

Onboarding

  • Search

    From my competitor research, I found that showing the user’s progress creates an easy and enjoyable experience for the user.

  • Review Card

    To keep the onboarding simple, I used 2-dimensional images to represent the function.

  • Add Card to Deck

    However, the images might look too similar, and this can be problematic.

  • Review an Old Deck

    I thought it could be helpful for users to save cards into a deck. They can create a deck for their game plan or by whom they learned the technique.

Searching a Term

  • Search a New Term

    The user can type in the technique within a search bar.

  • Reviewing Definitions

    For some terminology, the user may want to review further variations of the technique.

  • Technique Card

    Users can review the technique as a flash card.

  • Add Card to Deck

    Each technique card gives the user the option to add the card to a deck.

User Testing

  • Judo icons created by Freepik

    Participant 1

    ● Age 24

    ●She/Her/Hers

    ● Denver

    ● Student

    ● Training 3 years

    ● Blue belt

    ● Prefers Windows

  • Fighter icons created by Freepik

    Participant 2

    ● Age 24

    ● He/Him/His

    ● Denver

    ● Gym Manager

    ● Training 4-5 years

    ● Blue belt

    ● Prefers Macs

  • Judo icons created by Freepik

    Participant 3

    ● Age 20

    ● Sher/Her/Hers

    ● Denver

    ● Student

    ● Training 3 years

    ● White with 4 four stripes

    ● Prefers iOS

  • Scenario Tasks

    1. You are excited to learn jiu-jitsu, but find that the terminology can be difficult to keep up with. You discover an app to help you learn jiu-jitsu terminology and check it out.

    2. Today your professor taught you a new technique, “guard”. You’re keen to study on this technique on your own time, but you need a refresher on its details.

    3. We ran some errands, but now you have some time to review your new technique that you just learned.

    4. You think this technique is useful in the long run, so you want to organize this technique in a way that helps you review it later.

  • The 3 Participants Made Consistent Errors

    From my usability test, I found many level 3-4 errors. I rated an error a level 3 when I found that the user could complete the task, but made some indication of confusion during the tasks. I rated an error a level 4 when the user showed signs of frustration or was unable to complete the task in a timely fashion.

Quotes

“You got lazy here!”

“Are these music playlists?”

“There doesn’t seem to be any differentiation between the cards and can’t tell what they are. “

“Is this where I would find the terminology and its definition along with similar terms?”

Revisions

Onboarding

  • Search

    Understanding that the 2-dimensional drawings can be confusing, I added more details to the onboarding screens.

  • Add Term to New Deck

    I covered more details of the app’s functionality.

  • Review Your Term

    The progress bar remains as it seems to help understand that these are in sequential order.

  • Review an Old Deck

    Providing further directions on the onboarding screens may helps the users understand the app’s functionality.

Searching a New Term

  • Searching a New Term

    Adding the keyboard functionality to the prototype can help users understand the search screen’s functionality.

  • Reviewing Definitions

    Giving more context to the images and content can help the users understand the screen’s functionality.

  • Technique Card

    Adding instructions as the title can help the users understand the screen’s functionality.

  • Review an Old Deck

    Going forward, I can improve the app’s navigation by showing the users where they are in the app.

Final Thoughts

  • Next Steps

    1. Create a mid fidelity prototype with my revisions.

    2. Test my revised prototype with new participants.

    3. Create a high fidelity prototype with my new revisions.

    4. Test my high fidelity prototype.

    5. Revise as necessary.

  • Reflection

    Through my design process in creating my low fidelity prototype, I’ve learned a lot. Foremost, When in doubt, choose empathy. Whenever I got stuck in my design process, it helped to think about how my proto-persona would approach this problem. Furthermore, don’t be scared of negative feedback. All feedback helps us grow and improve our process.