Introduction to iOS7's design changes
Upcoming SlideShare
Loading in...5
×
 

Introduction to iOS7's design changes

on

  • 2,646 views

 

Statistics

Views

Total Views
2,646
Slideshare-icon Views on SlideShare
2,630
Embed Views
16

Actions

Likes
49
Downloads
45
Comments
1

3 Embeds 16

https://twitter.com 12
http://www.google.com 3
https://www.linkedin.com 1

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Introduction to iOS7's design changes Introduction to iOS7's design changes Presentation Transcript

    • Get iOS7 Ready What’s ahead Why are Apple changing everything? How are they doing it? - Principles and Features iOS7 Redesign Example Key iOS7 Considerations
    • Get iOS7 Ready iOS7: Why do you think Apple is changing everything? Get iOS7 Ready
    • Get iOS7 Ready iOS7: Why is Apple changing everything?
    • Get iOS7 Ready iOS7: Why is Apple changing everything? Cool? Get iOS7 Ready
    • Get iOS7 Ready iOS7: Why is Apple changing everything? Cool? Bored? Get iOS7 Ready
    • Get iOS7 Ready iOS7: Why is Apple changing everything? Cool? Bored? Get iOS7 Ready Playing catch up with competition now that Steve Jobs is gone?
    • Get iOS7 Ready iOS7: Why we think Apple is changing everything Responsive OS Design for a multi-device world Get iOS7 Ready
    • iOS7 Overview: Simplicity iOS 7 is visually simplified, allowing the content be prominent. Reduce complexity without diluting capability
    • iOS7 Overview: Focus Content is brought to the foreground. Maximize the user experience by applying iOS 7’s three core design principles
    • Get iOS7 Ready iOS7 Overview: New features Get iOS7 Ready Airdrop Flat design language 1500 New APIs Enhanced Multi-tasking Physics EngineiCloud Keychain iBeacons Automatic App Updates
    • Get iOS7 Ready iOS7 Principles: Deference Resource - http://www.aisleone.net/2009/design/8-ways-to-improve-your-typography/ Deference The UI helps users understand and interact with the content, but never competes with it.
    • Get iOS7 Ready iOS7 Principles: Clarity Resource - http://www.aisleone.net/2009/design/8-ways-to-improve-your-typography/ Clarity Text is legible at every size, icons are precise and lucid, adornments are subtle and appropriate. A sharpened focus on functionality motivates the design.
    • Get iOS7 Ready iOS7 Principles: Depth Depth Visual layers and realistic motion heighten users’ delight and understanding.
    • Get iOS7 Ready iOS7 Overview: The rise of flat design
    • Get iOS7 Ready iOS7: Not the first flat designed OS Metro is our design language. We call it Metro because it’s modern and clean. It’s fast and in motion. It’s about content and typography. And it’s entirely authentic. - Microsoft http://msdn.microsoft.com/en-us/library/windows/apps/hh781237.aspx
    • Get iOS7 Ready iOS7: Not the first flat designed OS Metro is our design language. We call it Metro because it’s modern and clean. It’s fast and in motion. It’s about content and typography. And it’s entirely authentic. - Microsoft http://msdn.microsoft.com/en-us/library/windows/apps/hh781237.aspx Reductive approach, geometric shapes, front facing icons, bright color palette, and straight hard shadows. - Google http://www.behance.net/gallery/Google-Visual-Assets-Guidelines-Part-1/9028077 http://www.behance.net/gallery/Google-Visual-Assets-Guidelines-Part-2/9084309
    • Get iOS7 Ready Redesign Example vs
    • Get iOS7 Ready iOS 7 Redesign: Will it break? Answer Not really. If using native UI elements combined with custom versions, inconsistent artifacts may show up. If using a fully custom iOS 6 UI, then Apple have intentionally designed iOS7 to support your app.
    • Get iOS7 Ready iOS 7 Redesign: What could Facebook look like?
    • Get iOS7 Ready iOS 7 Redesign: Flatten those colors Clarity Text is legible at every size, icons are precise and lucid, adornments are subtle and appropriate. In this example • No textured backgrounds or effects • No gradients, bezels or shadows
    • Get iOS7 Ready iOS 7 Redesign: Simplify iconography Clarity Text is legible at every size, icons are precise and lucid, adornments are subtle and appropriate. In this example • Icons use a single, consistent color • Icons are flat/outlined without gradients, shadows or bezels
    • Get iOS7 Ready iOS 7 Redesign: Simplify navigation Clarity Text is legible at every size, icons are precise and lucid, adornments are subtle and appropriate. In this example • Nav is free of outlines/bezels/shadows • Nav focuses on text-only
    • Get iOS7 Ready iOS 7 Redesign: Focus on content over chrome Deference The UI helps users understand and interact with the content, but never competes with it. In this example • Content maximizes the available area
    • Get iOS7 Ready iOS 7 Redesign: Restrain the navigation Deference The UI helps users understand and interact with the content, but never competes with it. In this example • Nav/UI doesn’t compete with content
    • Get iOS7 Ready iOS 7 Redesign: It’s about layering, not piling Hierarchy conveyed through depth Visual layers and realistic motion heighten users’ delight and understanding In this example • Tint layers are used to convey depth • Embellishments are stripped away
    • Get iOS7 Ready iOS 7 Redesign: Breaking away from tradition Hierarchy conveyed through depth Visual layers and realistic motion heighten users’ delight and understanding In this example • Content can be layered • Content is the focus of the experience • Nav compliments but doesn’t compete
    • Get iOS7 Ready iOS 7 Redesign: Facebook in iOS7 Get iOS7 Ready
    • Get iOS7 Ready Tigerspike Key Considerations: Overview Resource - http://www.taming-openoffice-org.com/newsite/?page_id=90 The new flat aesthetic Tinting, not textures Dynamic typography Full bleed interfaces Hierarchy conveyed through depth Physics engine Enhanced multi-tasking 1500 new APIs to use New Safari is omni-channel friendly
    • Get iOS7 Ready Key Consideration: iOS6 Support Does your app need to support iOS 6? iOS users tend to be very quick to update their devices and expect their favorite apps to follow suit.
    • Get iOS7 Ready Key Consideration: The New Flat Aesthetic
    • Get iOS7 Ready Key Consideration: Tinting, Not Textures Get iOS7 Ready
    • Get iOS7 Ready Key Consideration: Dynamic Typography
    • Get iOS7 Ready Key Consideration: Full Bleed Interfaces
    • Get iOS7 Ready Key Consideration: Hierarchy Conveyed Through Depth
    • Get iOS7 Ready Key Consideration: Physics Engine Get iOS7 Ready
    • Get iOS7 Ready Key Consideration: Enhanced Multi-tasking Get iOS7 Ready
    • Get iOS7 Ready Key Consideration: 1500 New APIs To Use Get iOS7 Ready
    • Get iOS7 Ready Key Consideration: New Safari is Omni-channel Friendly Get iOS7 Ready
    • Get iOS7 Ready Where to start Get iOS7 Ready Compile and test your iOS 6 app(s) on iOS 7 ASAP Get a point release ready with updated iOS 7 UI components (and any bugs fixed) for when the update arrives Begin work on your next major release re-imaging your experience to take full advantage of the OS Don’t boil the ocean—release, iterate & release.
    • Get iOS7 Ready Upcoming events: San Francisco Wednesday October 23rd, 2013 8am to 10am PST Wearable Tech Round-Table Thank you!
    • Get iOS7 Ready Helpful Resources iOS7 App Redesigns http://ios7redesigns.tumblr.com The iOS 7 Design Cheat Sheet http://ivomynttinen.com/blog/the-ios-7-design-cheat-sheet/ 36 High-Quality Flat Design Resources http://mashable.com/2013/07/29/flat-design-ui-kits/ iOS 7 GUI PSD http://www.teehanlax.com/tools/ios7/ http://applidium.com/en/news/introducing_ios_7_gui_psd/