iOS 7

 

The motion design team at Apple played a big role in the iOS 7 redesign. With the simplification and flattening on the UI, we needed animation to step in and add a layer of polish that only Apple could produce.

 

Throughout the redesign, I personally contributed to the weather app, lock screen, parallax effect, slide to unlock, control center, notifications, and loading animations – along with various other UI elements. Marketing videos were also created for the WWDC Keynote, apple.com, and the launch video.

iOS 7

 

The motion design team at Apple played a big role in the iOS 7 redesign. With the simplification and flattening on the UI, we needed animation to step in and add a layer of polish that only Apple could produce.

 

Throughout the redesign, I personally contributed to the weather app, lock screen, parallax effect, slide to unlock, control center, notifications, and loading animations – along with various other UI elements. Marketing videos were also created for the WWDC Keynote, apple.com, and the launch video.

ios-mobile-design
ios7 locksceen redesign

Lockscreen

 

Many subtle animations were involved in bringing the Lockscreen to life. The power on fade and scale provides a sophisticated look to the UI. The parallax effect and slide to unlock animation brings depth to the UI and set the foundation for the rest of the interface.

Weather

 

We designed a brand new look for the weather app by creating a window to the outside world. Realistic animations provide instant recognition of the weather – while giving the app an open, spacious feel. Animations between the cities, along with the list view transitions, round out the new structure.

ios7 weather snow
ios7 weather storm animation
ios7 control center

Control Center

 

The movement and physics of Control Center, Notification Center, and notifications were carefully considered. Every element in the UI has to feel bound together by the same motion language.

twitter loading animation

Various other animations were competed for iOS 7 including icon notifications, audio playback, airdrop, and app downloading.

Launch Video

 

Marketing videos for the launch event and apple.com were also created after the UI was completed. High resolution animations of the UI were recreated for use in 3D models and live footage.