1️⃣
The author has been creating this project for 4 months, redrawing and rethinking the design 4 times from scratch.
Following the news about Apple's sleep tracking app, I started to create my own concept that would reflect the vision of the app. While working on the design, I studied an abundance of scientific articles, given below. Information on the factors that affect sleep is provided from the sources: Sleep Research Society, Oxford Academic, SleepFoundation.org and others. I wrote scripts in Java Script to create realistic heart rate data and sleep stages. The "Sleep Tracking App" project is an indicator of the author's principles and approaches. Begin.
Main screen
🔎 Main screen anatomy
1st and 2nd elements
In the center of the main screen of the application is an alarm clock that displays the next time the user wakes up. Above it flaunts a "ruler" - a time scale on which the nearest minutes are marked concerning a user-defined smart alarm interval. The default interval is 30 minutes, i.e. the watch with the help of sensors will wake up a person at the optimal time for waking up with a margin of ± 15 minutes. For example, if the alarm is set at 12:30, it will ring at the optimal time from 12:15 to 12:45. To determine which mode is set, look at the roulette wheel. If one number is highlighted (for example, 30), then the "normal" alarm clock mode is set, if highlighted (for example, 15 and 45), and 30 remains in the shadow, the smart alarm clock mode is preparing to work wonders.
3rd element
The third interface element, "Smart Button" changes concerning factors: time, user preferences, schedule of the day, etc. The smart button learns as the user uses the Sleep app, interacts with the watch, and adds new accessories to the Home app. The button does not leave its place but changes the action recommended to the user, so it cannot be lost. Not only the smart button but also the entire application is all about convenience and maximum utility.
Force Touch menu on the main screen
Force Touch in watchOS 6* - not only provides the ability to toggle a setting or item styles but also is a way to navigate. The technology becomes familiar in everyday use of the watch, so "pressing hard" becomes an intuitive action. A strong press on the main screen of the "Sleep" application opens a menu of three items: "Set Wake Up Time", "Switch To Smart Mode" (if smart is set - "... To Normal Mode"), and "App settings".
* - for this version of the operating system, the design was worked out, because the work began even before the release of the 7th version
📅 Set Wake Up Schedule
When you tap on "Set Wake Up Time", a list of alarms opens. The user immediately sees the time and schedule according to which the alarm will ring. The instructions above show how easy it is to create a new alarm and select its schedule. I'll talk about the schedule of the alarm later, but it is important to remember that alarms could be set both for repetition and one actuation. The items "Tomorrow", "On weekends", "On weekdays", etc. will help you choose the desired schedule quickly and without stress. To eliminate confusion, alarms can't be created with the same schedules, but they can override each other. For example, a user sets an alarm "for 9:45 on weekends" and then sets an alarm for "next Saturday at 7:00". The alarm will ring at 9.45 the following Sunday, exactly like every subsequent weekend, but next Saturday at 7:00.
Select days in Wake Up Schedule
When setting the alarm schedule, the user has access to the "On selected days" item. It took more than one headache to create an understandable principle for setting alarms 🤯, this function is an example of correctly and progressively solved problems. Small circles represent each of the days of the week, when pressed, the circles turn on or off. Once the desired days are selected, just scroll down the Digital Crown or swipe your finger across the screen to tap "Save". Some users will go into a stupor after choosing days if you don't tell them where the button is. Part of the "Save" button sticks out from the bottom of the screen to hint not too intrusively: "it's not over."
Set Wake Up Time
Setting the alarm clock is no less intuitive. After tapping on an existing alarm clock or creating a new one with the "Add" button, you need to select the field with the clock. Apple designed the basic number entry element for the Apple Watch display with attention to detail. The Digital Crown is precise, so it is easy to set the desired hour or minute, the setting of which is switched by pressing the corresponding container.
Two modes
- "Switch To Smart Mode" (if smart is set - "... To Normal Mode").
The second item from the Force Touch menu on the main screen switches modes, and the smart ruler will remind you which mode is set.
App settings
You can go to the App settings through the Force Touch Menu by pressing firmly on the main screen. A neat list with colorful and visually recognizable icons helps you quickly select the option you want.
That's all for now 🎬
Author links:
© egsmrnv:
Others cannot use this work for any purpose without explicit permission.
