Joanne Cho

Coala

Helping coaches to save time

Overview

Spend more time helping students reach their full potential by focusing on providing quality coaching sessions with powerful and easy to use features!

Role

Product & Graphic Designer

Skills

UX Research, User Flow, Wireframes, Prototyping, Branding & Visual Design, Illustration, Editorial, Motion Graphic

Tools

Figma, Adobe Illustration, Photoshop, Indesign, After Effect, Premiere

Problem

Insufficient communication between coaches and parents

A hassle to remember skill exercises

Report card should be written manually

Main Features

Solutions

1. Smart Curriculums

A personalized solution tailored for every coach to easily access the details and sample videos about each skill exercise required on a program.

2. Attendance

Our streamlined solution not only simplifies the process but also keeps a record of each student’s attendance history over time, allowing you to easily monitor and analyze their progress.

3. Skill Evaluation

With a user-friendly interface and advanced tracking capabilities, you’ll be able to evaluate each student’s progress with ease, allowing you to provide a personalized experience that caters to their unique needs.

4. Automated Report

An automated report card system saves coaches time and effort by generating customized reports that reflect each student’s evaluation results, which can be exported as PDFs quickly and efficiently.

5. Students & Class Management

A powerful tool to assist coaches in delivering a more personalized experience to their students by providing access to student profiles, tracking skill progress, and identifying attendance patterns all in one place.

Persona

User Story

1. As a coach I would like to take attendance for each class so that I can know which students to evaluate that day.

2. As a coach I would like to evaluate my students based on their skill cards so that I can track their progress.

3. As a coach, I would like to send pdf copies of my student skill cards so that their parents can keep track of their progress.

4. As a coach I would like to generate appropriate skills for each student so that I can continue teaching them the right skills.

User Flow

UX Research

After developing initial user flow options and wireframes, we sought feedback from classmates and instructors to gauge the direction of our project. The opinions received were diverse, leading to some uncertainty. To make informed decisions, we decided to conduct A/B testing with two professional coaches from Jump Gymnastics, a renowned kids’ coaching institution based in Vancouver.

A/B Testing

Design A proposed a condensed user flow, incorporating ‘attendance’ and ‘evaluation’ tasks within the ‘home’ feature, while ‘curriculum’ and ‘students’ were integrated into the ‘class’ feature. This approach aimed to create a more dynamic app usage, enhancing the overall user experience.

On the other hand, Design B presented an autonomous flow for each task, guiding users to access a separate screen for each function. The intention behind this design was to streamline the user experience, particularly for new users, by reducing cognitive load and making interactions more straightforward.

Iterative Design

In the early stages of our design process, we implemented a vertical flow for evaluating skills and a student counter in the top-right corner. However, after conducting usability tests, we identified that the student counter was not prominent enough. As a result, we decided to simplify the flow by transitioning to a fully horizontal approach, allowing users to navigate skill by skill and student by student, leading to a significantly improved user experience.

In the final version, we retained the horizontal flow due to its positive impact on user interaction. Additionally, we incorporated enhanced visual elements, including additional colors and Coala illustrations, which effectively represent the skill status, providing users with a visually engaging and intuitive experience.

UI Overview

Branding

UI Kit

Wireframe

Attendance

Evaluation

Report

Curriculum

Account

My Class

Students List

Skill Evaluation

Evaluation Completion

Mockup

Attendance

Evaluation

Report

Curriculum

Account

My Class

Students List

Skill Evaluation

Evaluation Completion