iOS7
The good, the bad & the changes
Chrissy Welsh
Lead UX - Backbase
@chrissywelsh
iOS7
The good, the bad & the changes
Chrissy Welsh
Lead UX - Backbase
@chrissywelsh
What we will cover
• Bugs to watch out for
• Design decisions for native apps
& websites + their workarounds
• Gestures
• ...
Bugs to watch out for...
• Web SQL permissions to increase the default 5MB of
space for an app to the previously permitted...
Design decisions: Tints
Feature: Tints are selected based on the primary
background colour
Workaround: Select your backgro...
Design decisions: Navigation
Feature: Bottom navigation is
problematic, in this design it’s
disabled because of the new iO...
Design decisions: URL bar
Feature: No way to hide the URL bar with javascript, no full screen
mode. Problem if your app re...
Design decisions: Page titles
Feature: Safari now ignores page <title>
Workaround: It will show the URL, so make sure it
m...
Design decisions: HTML5
Issue: Animating SVG
with Javascript is a bit hit
or miss with your
performance.
Workaround: Look ...
Gestures: Up-swipe
Feature: iOS7 now has a control
center visible on a bottom up
swipe.
Workaround: Be careful with
your a...
Gestures: left/right-swipe
Feature: Right and left
swipe gestures within
about 10 percent of
display edge are always
grabb...
The new look & feel
Feature: The new OS
icons are 5% bigger in
7.0 that 6.0
Workaround: Update
those bad boys
Removed features: Datetime
Issue: doesn’t
support the
datetime input type
anymore and it will
fallback to text.
New feature: Sticky position
Feature: Sticky position is a new experimental feature that
allow us to fix an element to the ...
New features: Multitasking
Issues: When running a
homescreen app the system will
use a while image.
Workaround: None
New features: Dynamic behaviour
Feature: Dynamic behaviors offer
a way to improve the user
experience of your app by
incor...
New features: Speech synthesis
Feature: Speech Synthesis api
allows mobile safari to speak.
New features: Custom transitions
Feature: Allows you to set up the screen changes in
the UI the way you want it.
New features: Smile detection
Feature: If you have a camera
app - or use the camera there are
some playful things you can ...
New features: Image filters
Feature: There are now image
filters available as part of the OS.
• CILinearToSRGBToneCurve
• CI...
New features: Motion effects (parallax)
Feature: Phone titling to see
more background, or provide
direction in games.
New features: QR code generator
Feature: For all your QR Code
needs. Available as part of the OS.
New feature: Touch iD
Feature: Touch iD as
identification - not available for
websites/apps ... yet.
New feature: Touch iD
http://www.youtube.com/watch?v=1OFW6Va1m5k
*Just remember to test all those cool new features!
What we covered
• Bugs to watch out for
• Design decisions for native apps & websites + their
workarounds
• Gestures
• The...
Question Time
ios7 samples: github.com/shu223/iOS7-Sampler
Chrissy Welsh
Lead UX - Backbase
@chrissywelsh
Upcoming SlideShare
Loading in...5
×

Ios7 - The good the bad & the changes

4,697

Published on

Amsterdam UX talk about the new iOS7. It covers some bugs, some changes, some removed features and some of the new cool stuff you can do.

Published in: Design, Technology

Ios7 - The good the bad & the changes

  1. 1. iOS7 The good, the bad & the changes Chrissy Welsh Lead UX - Backbase @chrissywelsh
  2. 2. iOS7 The good, the bad & the changes Chrissy Welsh Lead UX - Backbase @chrissywelsh
  3. 3. What we will cover • Bugs to watch out for • Design decisions for native apps & websites + their workarounds • Gestures • The new look and feel • New & removed features
  4. 4. Bugs to watch out for... • Web SQL permissions to increase the default 5MB of space for an app to the previously permitted 50MB limit no longer work correctly, and require a workaround. • “Save to Home Screen” apps are basically broken. Once more than four apps are saved to home screen, the save slots are recycled and sometimes duplicated, and the phone has to be rebooted in order to clear itself. • If your app uses AppCache and you are managing state via hash or other mechanisms, the history object will never update, disabling history.back.
  5. 5. Design decisions: Tints Feature: Tints are selected based on the primary background colour Workaround: Select your background colours carefully
  6. 6. Design decisions: Navigation Feature: Bottom navigation is problematic, in this design it’s disabled because of the new iOS7 Safari toolbar. Workaround: 2 user taps will activate the menu again - or rethink the UX & navigation.
  7. 7. Design decisions: URL bar Feature: No way to hide the URL bar with javascript, no full screen mode. Problem if your app relies on absolute positioning. Workaround: Swiping up will reset to full screen, or asking user to add app to homescreen
  8. 8. Design decisions: Page titles Feature: Safari now ignores page <title> Workaround: It will show the URL, so make sure it makes sense.
  9. 9. Design decisions: HTML5 Issue: Animating SVG with Javascript is a bit hit or miss with your performance. Workaround: Look at your interactive elements and slim them down if possible.
  10. 10. Gestures: Up-swipe Feature: iOS7 now has a control center visible on a bottom up swipe. Workaround: Be careful with your app or site to suggest an upwards swipe gesture to the user.
  11. 11. Gestures: left/right-swipe Feature: Right and left swipe gestures within about 10 percent of display edge are always grabbed by iOS and treated as a forward/back request, and not passed to the browser. Workaround: None
  12. 12. The new look & feel Feature: The new OS icons are 5% bigger in 7.0 that 6.0 Workaround: Update those bad boys
  13. 13. Removed features: Datetime Issue: doesn’t support the datetime input type anymore and it will fallback to text.
  14. 14. New feature: Sticky position Feature: Sticky position is a new experimental feature that allow us to fix an element to the viewport but only when it’s off the visible area (usually after a scrolling action)
  15. 15. New features: Multitasking Issues: When running a homescreen app the system will use a while image. Workaround: None
  16. 16. New features: Dynamic behaviour Feature: Dynamic behaviors offer a way to improve the user experience of your app by incorporating real-world behavior and characteristics, such as gravity, into your app’s animations.
  17. 17. New features: Speech synthesis Feature: Speech Synthesis api allows mobile safari to speak.
  18. 18. New features: Custom transitions Feature: Allows you to set up the screen changes in the UI the way you want it.
  19. 19. New features: Smile detection Feature: If you have a camera app - or use the camera there are some playful things you can do.
  20. 20. New features: Image filters Feature: There are now image filters available as part of the OS. • CILinearToSRGBToneCurve • CIPhotoEffectChrome • CIPhotoEffectFade • CIPhotoEffectInstant • CIPhotoEffectMono • CIPhotoEffectNoir • CIPhotoEffectProcess • CIPhotoEffectTonal • CIPhotoEffectTransfer • CISRGBToneCurveToLinear • CIVignetteEffect
  21. 21. New features: Motion effects (parallax) Feature: Phone titling to see more background, or provide direction in games.
  22. 22. New features: QR code generator Feature: For all your QR Code needs. Available as part of the OS.
  23. 23. New feature: Touch iD Feature: Touch iD as identification - not available for websites/apps ... yet.
  24. 24. New feature: Touch iD http://www.youtube.com/watch?v=1OFW6Va1m5k *Just remember to test all those cool new features!
  25. 25. What we covered • Bugs to watch out for • Design decisions for native apps & websites + their workarounds • Gestures • The new look and feel • New & removed features
  26. 26. Question Time ios7 samples: github.com/shu223/iOS7-Sampler Chrissy Welsh Lead UX - Backbase @chrissywelsh
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×