Quick sketches for the UI.
Initial wireframes for myself and other designers working on their own mockups.
Main screen, with a large content banner displaying new additions. A central “Warm Up” button allows the user to begin their workout instantly , and then choose their entertainment. Additional buttons are arrayed around the “Warm Up” button, displaying additional options for the user.
A screen displaying a music video. The workout data is always displayed in a top bar. The video and relevant information are displayed below, with options to navigate to the previous or next video. A bottom navigation menu is hidden at the start, the user can tap the “Change Media” to display it.
The bottom navigation displays additional media options, and can be minimized when unused.
Mockup of a POV running application.
I was asked to provide a quick mockup of the UI in a real-world machine to use to show the client. We did not have the time for 3D, so I created an illustration. The icons in the bottom area of the machine allow the client to view all mockup screens.