UI/UX Designer & Full-Stack Web Developer
Running App@2x_iphonexspacegrey_portrait.png

Running App UI

 

Running App - iPhone X Mockup

RunTracker App

Mobile Application User Interface

Tools: Sketch


This mobile applications uses a modern flat design to display a user's running information including total distance, time elapsed, and also displays calorie and distance goals in the form of numeric and progress bars. The header of the application contains a map showing the route the runner has taken and a pause button for a quick stop to the tracker. The footer section contains a media controller that allows users to pause or change music tracks.

Critique:

There is only one button to navigate out of the run on this design (left arrow). The route does not differentiate between start and stop points. The pause button could be relocated to the bottom right section to make it easier to toggle during a run.