Design Exercise for an Apple Watch Swim App

 
Overview
If you have ever wanted to be a great swimmer, regardless of you just want burning calories, losing weight while in water or just improving your swimming skill, track your swim speed in real-time, you know it is frustrating to find a perfect watch app for you.
 
SwimPal will help you get to the path of improving your swimming skills one step at a time. It is a free app that will provide you with a progression based upon your set training plans.
 
Goal
This app will use Apple Watch fitness and health tracking capabilities in your phone to track your metabolic activity. Since the recent watch model can be a stand-alone device, you do not need to keep your iPhone with you at all times for it to work.
 

Design a wearable app for swimmers. It should be able to track exercise, provide reports, and give feedback about pace, heart rate, laps, duration, and calories burned during activity.

 
Research

I did some research on what kind of goal a swimmer would have, from a beginner swimmer to an advanced leveled swimmer. How would they want to progress? What kind of workout do they want to do from the training goal? I got to know, for each training session, the swimmer needs to break the session to warm up, then repeat each specific session depend on how intense the session is, then the last they will need some cool-down exercise. I know if I ever design this swim app for a client, the training goals would prob written out in place already, but it is still very interesting to see all the information I didn’t know before this project.

 
Challenge and Solution

I had issues with the wording. On Dashboard, I wanted to name the last button “previous swim workout”, apparently it is too long even for a phone app; so I decreased the verbiage to “the previous workout”. It looks ok on the wireframes. But when later on when I mockup the UI, the button name in capitalized words, I had to decrease the number of the letters again, from “the previous workout” to “history”. Because essentially, it is the history of previous swim sessions.

 
Target Users:

  • Who?: Swim enthusiastic, aged 18–70, who have an apple watch and have access to a pool but not finding a good way to track or improve swimming.
  • What?: This app will allow the users to achieve their goals, improve their swimming skills and get fitter without changing their swim training routine.
  • When?: Folks who want to sharpen swimming skills and maintain the usual swimming habits while using this app.
  • How?: Using the app on Apple Watch.

 
This app is largely targeted to the new generation of tech junkies who enjoys an athletic lifestyle. These people want to enjoy swimming as a fitness habit but need some motivation to hit the pool. Having this app on the watch will make the swimming experience a lot more fun. The app is also good for more advanced swimmers who focus more on training and hitting goals.
 
Mapping the basic flow of the watch app made me realize how a user would go through the app inside each flow. I treated this as a sitemap to finally start sketching all the key screens of the app.
 

 
 
Based on the user flow on top, I outlined the app and imagined it visually. The visual guide represented the skeletal framework of the app.
From the Dashboard, the app is basically broken down into four main parts,

     

  • Start Now — Track swimming in real-time; once the session starts, the watch automatically water lock the screen; the user can check the stats while swimming
  • Pool Size — Length of the swimming pool that the user usually swim in; it is easier to set up a training plan with a defined pool size. You can leave it blank if it is open water
  • My Training Plan — This shows the user’s personal training goal and target to reach. The user can change the plan anytime before it starts
  • History — This page behaves like a long list of previous swimming session stats. The user can share the stats to his/her contacts. The user would be giving the reward badges for motivation (didn’t wireframe out on those)

 

I laid out all the components in place on the wireframes (for example, how the buttons should show, where the clock should display on the watch screen), so I get the rough idea how the UI design can play out; how much info is glanceable without tapping.

 

 
 
The UI of this project uses a dark theme, with simplistic design and big text for data stats which is taking higher focus.
 
The use of a big button structure decreases the complexity and also enables the addition of new features easily into the product.