Image - Add Timer iOS concept
Play Video

iOS Concept

Adobe XD - logo Adobe After Effects - Logo

Used software

Made in 2019
Project type: experiment


Case

While using the timer app on iPhone, I noticed that it's only possible to set one timer at the same time. I was making diner for my family and realised I actually needed three timers at the same time. So I've decided to make a redesign by adding a small feature that would be very helpful.

I made this project for myself. The feature that is missing from current iOS (14.4) is something I'd love to see. It is very interesting to see which solutions work best for this.

Design in Adobe XD

Process

I've tried different designs where the timers are visible in different ways. I chose one of the designs that worked best for me and optimized it. For the animation I had to make several components seperate from the design so I could animate them.

I animated the components in Adobe After Effects after designing them in Adobe XD. In this Animation I used a few components and animated them to look as real as possible. It's very interesting to dive into the style of interaction that Apple manage. I added the hover circle to guide the viewer in the correct order.

Animated GIF

Result

Let's highlight the most important design changes. First of all the possibility to add an extra timer beside the existing one. The option will become visible when you turn on your first timer, because that's the only moment when you will need it.

The second thing that's new is the overview of the multiple timers you've set. Every timer shows the time that's left, the time that it will end, the title you gave the timer, a cancel and a pause option for you to adjust the timer afterwards.

Let's make something awesome!

Feel free to contact me to work on a project together and make something unique.