Egg Timer
2020,Mobile Lab Class Project
Inspiration
Assignment's requirement for this week:
-
Design and UI can NOT use any numbers or text
-
Review native iOS timer functionality
-
Must be able to set any interval up to 1 hour
-
Must have functionality for Start, Cancel and Pause
-
Design system must accurately communicate minutes and seconds
-
Must have visual and/or audio and/or haptic feedback when timer finishes
-
Consider Affordances, Signifiers, Mappings and Feedback in the app design
​After seeing the requirements of the design timer, I analyzed the basic functions of the APP to set the countdown time and can be modified (up to one hour). There are countdown start and pause, and there is a flow of time. Visually, I think that time will leave colorful memories at the same time, so I choose the method of gradually reducing the area of ​​white bars and gradually increasing the pink bars. At the same time, considering that time is dynamic, so I let the white bars decrease with time and let them jump up and down randomly.
​​process
Implement the main part:
1. Put the background image into the array, you can change the background every time you click restart
2. Write the structure of the bar chart, and write a function that maps its length and time
3. Implement the start, pause, and restart buttons
​​process2
The second most important part is to change the set time from a number to a graphic. Dial default time is 30 seconds. The main idea is to design a minute dial and a stopwatch dial in increments of ten seconds. When the second dial is greater than 60 seconds, jump to Minutes, when the time is less than 0 and when the time exceeds one hour, the state is terminated.

The Final Look






