transitioning your app for ios7

27
TRANSITIONING YOUR APP TO iOS 7 by ANDREW RUDMANN @arudmann

Upload: aviary

Post on 10-May-2015

658 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Transitioning Your App for iOS7

TRANSITIONING YOURAPP TO iOS 7

by ANDREW RUDMANN@arudmann

Page 2: Transitioning Your App for iOS7

Easy to misinterpret iOS7 as flat design. It is most CERTAINLY not.

It is a shift in the way we think about UI and UX.

Rethink the philosophy of your app. Hyperfocus it on the task at hand. Drill into content.

Page 3: Transitioning Your App for iOS7

THIS IS NOT

FLAT DESIGN

Page 4: Transitioning Your App for iOS7

Flat styling is independent of interaction.

Page 5: Transitioning Your App for iOS7

Depth exists in the concepts of planes.

Page 6: Transitioning Your App for iOS7

UI exists on flat layers and the gaps between them are created by motion,

animation, and color.

Page 7: Transitioning Your App for iOS7

RETHINK THEPHILOSOPHY OF

YOUR APP

Page 8: Transitioning Your App for iOS7

Content used to be chunky, compartmentalized into pieces, and

unfocused

Page 9: Transitioning Your App for iOS7

Now it’s spread out and hyperfocused across “drilled in” screens.

Page 10: Transitioning Your App for iOS7

This occurs everywhere in iOS7.

Page 11: Transitioning Your App for iOS7

This occurs everywhere in iOS7.

Page 12: Transitioning Your App for iOS7

HOW WEINTERPRETED

iOS7

Page 13: Transitioning Your App for iOS7

DEFERENCECLARITYDEPTH

Page 14: Transitioning Your App for iOS7

DEFERENCEThe UI helps users understand and

interact with the content, but never competes with it.

Page 15: Transitioning Your App for iOS7

Our previous app made heavy use of chrome and forced a very specific style on the user.

Photo Editing occurred in this very defined space that was equal parts content and equal parts our app.

Our goal was to remove ourselves from the equation and make the experience be entirely about you and your photo.

Page 16: Transitioning Your App for iOS7

The difference is quite stark.

Page 17: Transitioning Your App for iOS7

The background and experience of the app adapts to your photo.

Page 18: Transitioning Your App for iOS7

The photo is ALWAYS in front of the user and is the focal point of the experience.

Page 19: Transitioning Your App for iOS7

CLARITYText is legible at every size, icons are

precise and lucid, adornments are subtle and appropriate, and a

sharpened focus on functionality motivates the design.

Page 20: Transitioning Your App for iOS7

In examining the clarity of our previous app we noticed a few spots of confusion that we were sure to tackle in the iOS7 refresh.

We updated the way our sharing works to remove any and all points of confusion for the user.

We continued our current practice of updating and unifying our iconography.

Page 21: Transitioning Your App for iOS7

Avoiding Confusion.

Page 22: Transitioning Your App for iOS7

Conveying abstract ideas with clarity.

Page 23: Transitioning Your App for iOS7

Simplify. Repeat.

Page 24: Transitioning Your App for iOS7

Always improve.

Page 25: Transitioning Your App for iOS7

DEPTHVisual layers and realistic motion

impart vitality and heighten users’ delight and understanding.

Page 26: Transitioning Your App for iOS7

To create depth we focused primarily on a foreground / background concept.

The photo exists in a space that is very sparse and undefined, allowing us to move very freely within it.

We use animation to show depth as well. As you advance through the app the tools move in and out in a way that simulates depth.

Page 27: Transitioning Your App for iOS7

QUESTIONS?