Team Viilee App

Background and Objectives

The goal of this project was to develop a functional prototype for managing a sports team in collaboration with the athletics coaching group Team Viilee. The project originated from discussions with the coach, highlighting that existing commercial solutions were often cluttered with unnecessary features that hindered efficiency. The primary focus was to create a streamlined tool for managing training programs and maintaining logs without consuming excessive time.

User-Centered Design (UX)

Focus on Simplicity: The core design principle was ease of use. The application was designed to ensure minimal time investment before or after training sessions.
Collaboration and Iteration: Regular reviews were conducted with the partner to validate requirements and ensure the interface met the specific needs of both coaches and athletes.
Visual Standards: The design followed Material Design guidelines to provide a familiar, consistent, and professional user experience.

Key Features

Role-Based Access: The system differentiates between athletes and coaches during login, directing users to their respective tailored views.
Athlete View: A minimalist interface focused on the training schedule, presented in an easy-to-read table format. Athletes can mark sessions as completed and add feedback for the coach.
Coach View: Equipped with tools to create or edit training programs dynamically for specific athletes using dropdown selections and interactive data entries.

Lessons Learned and Results

This project was a significant deep dive into UX design and advanced Figma prototyping. Utilizing Figma to solve real-world problems allowed me to explore new features and refine my design workflow. The partner was highly satisfied with the outcome, considering the project a success in addressing their specific pain points in sports management.

Images

The application login is an important feature in order to assign the user to the correct database and direct the user to either the athlete or coach view.

Athlete's view is very simple. From this view, users can change their password (gear icon in the top corner) and view their training program.

The coach's view is nearly identical to the athlete's, but with a few additional features. Coaches can create new training programs or edit existing ones.

The athlete's training program is displayed as a table, making it very clear and easy to read. The athlete can add a description for each day in the "Done" column, allowing both the coach and the athlete to easily track progress.

If the training description doesn’t fit entirely within the table view, the athlete can click on it to open a new window showing the full text. Similarly, the coach can open the athlete’s comments in a separate window.

The coach can create a new training program by first adding the dates; clicking on a specific date then allows the coach to add a training description to the table.

Adding a new workout.

The application user journey in Figma.