App Design: IRONMAN App
App Design: IRONMAN App
Embedded Files
I redesigned the IRONMAN Tracker App, which provides information and race data for competitors and spectators of IRONMAN Triathlon events.
I redesigned the IRONMAN Tracker App, which provides information and race data for competitors and spectators of IRONMAN Triathlon events.
Date: Oct – Nov 2024 Setting: WV College class Role: Ideation, sketching, iteration & prototyping.
Overview
Improvements were focused on clear information hierarchy, especially reorganizing screens to make most-used information accessible. Care was also taken to create a clean, visually pleasing app.
The original design had a cluttered UI and complicated page structure. It contained helpful features and information, but finding them was a challenge.
All useful links are hidden below the fold
Filters are overlayed on the homepage
Results page does not highlight the total race finish time
Individual race detail information is confusing
Clean starting page highlighting most needed actions
List of results including finish time and segment times
Results filters are associated with the results page, not the home screen
Individual results page uses visuals to aid in comprehension
Sketches helped me understand how information could be prioritized
Using a screenshot of the existing app, I created a list of all the information that is included in the individual race detail page:
After making this list I realized that there was way too much data to fit into one screen. I decided that a detail page for each segment of race made sense.
After making this list I realized that there was way too much data to fit into one screen. I decided that a detail page for each segment of race made sense.
From this list, and based on my personal knowledge of relevant race statistics, I categorized the data types by priority level.
From this list, and based on my personal knowledge of relevant race statistics, I categorized the data types by priority level.
I made sketches for the detail pages, and transformed them into screen layouts in Figma. Then, I connected them into working prototypes.
Sketch of a simple data visualization plan
Final display avoids the standard list format
Each race segment has a detail page with data for time splits
This design process allowed me to create a working prototype of the improved app; which includes cleaner layouts, improved information hierarchy, and clear navigation. These improvements allow the user to intuitively use the IRONMAN app, and to enjoy their triathlon experience.
See the prototype in action:
See the prototype in action:
Prototype-IRONMAN-App.mov
Through this project, I learned about adding interest to an app by removing standard list formats, and displaying information in a new way. I also learned how information must be selected and prioritized, because crowded information is overwhelming and clutters screens. As I tackled the problem posed by the original app, I learned how important it is to see past the existing design and open yourself to new solutions which could exactly fit the needs of the app.
Page updated
Google Sites
Report abuse