WHAT’S NEW IN IOS 10, watchOS 3 and tvOS 10FROM A DESIGN PERSPECTIVE

October 2016

QUICK OVERVIEW HOW IOS HAS EVOLVED

A LONG TIME AGO…

Before iOS 7 the User Interface we have seen on our iPhone and iPad was completely different. So the approach of designing interfaces.

Apple was using examples of physical objects when designing an application interface: the Calculator app looked like a real calculator, the Notes app had ripped paper effect, etc.

We are calling these visual metaphors “Skeuomorphism”. These metaphors was helping to make the connection easier with the user and the application.

Copyright @ Accedo 2016 | Apple TVOS3

IOS 7

iOS 7 was a complete redesign, wiping away the skeuomorphic design and putting physics-based interactions in its place.

As the iPhone grew in popularity, it needed to prove a relationship to real-world items lessened. They introduced new visual elements in iOS, for example the dynamic blur effect, new color scheme. They also simplified the buttons and the form elements.

4Copyright @ Accedo 2016 | Apple TVOS

IOS 8

iOS 8 was a functional revolution, decoupling features and activities from apps and letting them extend into other interfaces and continue across devices.

The most impressive new feature in iOS 8 is what Apple is calling "Continuity." iOS 8 works with Apple’s new Mac OS X 10.10 Yosemite to provide a completely new level of interactivity between an iPhone or iPad and a Mac computer.

5Copyright @ Accedo 2016 | Apple TVOS

IOS 9

iOS 9 is designed to work with 3D Touch in the new iPhone 6S and 6S Plus.

To coincide with the introduction of the iPad Pro, the iPad family will gain new features like Slide Over and Split View for enhanced multitasking; Picture in Picture to watch videos while in other apps.

6Copyright @ Accedo 2016 | Apple TVOS

IOS 10

Now, iOS 10 takes the next step, using all of the advances that came before to make everything more fun and flexible.

Siri is now more open and accessible, notifications are more persistent and convenient, and the entire experience cleaner and clearer.

7Copyright @ Accedo 2016 | Apple TVOS

COMPATIBILITY

COMPATIBILITY

iPhone 6 SE iPhone 6s iPhone 6s Plus iPhone 6 Plus

iPhone 6 iPhone 5s iPhone 5c iPhone 5

iPad Pro iPad Air 2 iPad Air iPad 4

iPad mini 4 iPad mini 3 iPad mini 2 iPod touch 6

Apple dropped several older models, including all non-Retina display devices.

9Copyright @ Accedo 2016 | Apple TVOS

WHAT’S NEW IN IOS 10

NOTIFICATIONS

Notifications have been redesigned, with clearer bubbles containing time stamps and the source of the notification.

When a new notification pops up, you can hard-press it to reply, view attachments, or watch any videos right from the lock screen.

Widgets are now removed from the notification center (but can be accessed with a swipe), which means less noise and more emphasis on notifications.

11Copyright @ Accedo 2016 | Apple TVOS

WIDGETS

When picking up an iPhone running iOS 10, the screen will automatically turn on (only on 6s or later). You can view your notifications, swipe to view your widgets like now. They can be accessed from the home screen by swiping from left.

With this change, “Slide to unlock” has been terminated. Pressing on an app icon reveals the standard shortcuts and a widget regardless of whether or not you've added it to your list in the Today View.

With this move, the widgets are getting closer to the User and it makes the widgets more important then before.

12Copyright @ Accedo 2016 | Apple TVOS

SIRI

Apple is now giving app developers the ability to integrate with Siri. That means apps can be controlled with your voice.

Siri is also using machine learning to give intelligent suggestions while you're in a conversation.

13Copyright @ Accedo 2016 | Apple TVOS

APPS IN IMESSAGE

Apple also opened iMessage to third-party developers.

Since messaging is probably one of the most common activity on any platform, therefore makes iMessage an attractive tool for brands.

14Copyright @ Accedo 2016 | Apple TVOS

PRESS HOME TO UNLOCK

Unlocking an iPhone now requires a physical press on the Home Button by default.

The unlock in the old “slide to unlock” meant “open your phone” i.e. go to the Home Screen. If a passcode was set, then you were hit with a passcode screen along the way. With the introduction of Touch ID, you could skip that screen and go straight to the Home Screen using your fingerprint.

Now unlocking and opening have been decoupled where “unlock” means Touch ID and “open” means go to the Home Screen. You must first unlock, and then open. The reason, perhaps, is that Apple wants you to actually use the Lock Screen.

15Copyright @ Accedo 2016 | Apple TVOS

DESIGN LANGUAGE

BIG. BOLD. BEAUTIFUL.

SF UI Text and SF UI Display are the main system fonts of iOS 10: the former covers all font sizes under 19pt, while the latter focuses on 20pt+ sizes.

UI Text is thicker at those smaller sizes to preserve legibility, but still captures the style of the original San Francisco and Helvetica Neue.

17Copyright @ Accedo 2016 | Apple TVOS

BIG. BOLD. BEAUTIFUL.

In Music, Maps, Health, and Home, the mix of thicker, large headliners and thinner sub-headers provides for a rich experience previously unseen in this era of iOS.

The Music app is the best example of Apple's reinvented minimalist style: The app is using colored and shaded backgrounds for a white background, instead using bold headers and images to build the sections.

18Copyright @ Accedo 2016 | Apple TVOS

COLORS

In iOS, color can indicate interactivity, impart vitality, and provide visual continuity. Look to the system’s color scheme for guidance when picking app tint colors that look great individually and in combination, on both light and dark backgrounds.

• In Health, Apple uses bright colors to demarcate between activities and brighten up icons for discoverability.

• In Music, the company is letting the album artwork speak for itself.

• Home, in contrast, plays with a dark navigation bar, orange highlight color.

19Copyright @ Accedo 2016 | Apple TVOS

IPHONE 7

WIDE COLOR GAMUT

The Retina HD display of iPhone 7 is able to deliver cinema‑standard colors (DCI-P3). More shades of the color spectrum can be used to create an image.

The display is also 25% brighter. Therefore, it will be important to use high quality pictures when designing a user interface.

21Copyright @ Accedo 2016 | Apple TVOS

watchOS 3

THE DOCK

Accessed with the side button, the Dock holds up to ten of the user’s favorite apps. Apps in the Dock are given an opportunity to run at least once an hour so that they can check for new content.

Apps can also update their snapshot, which is the static version of the app’s interface displayed in the Dock. These updates make the Dock a useful way for users to get information quickly.

23Copyright @ Accedo 2016 | Apple TVOS

GESTURE RECOGNIZERS

Gesture recognizers make it really easy to add custom tap interactions to your apps, touch interactions such as tap, swipe, and pan.

The gyroscope is also accessible in addition to the accelerometer.

24Copyright @ Accedo 2016 | Apple TVOS

DIRECT ACCESS TO THE DIGITAL CROWN

An app can be notified when the user rotates or stops rotating the Digital Crown, and can retrieve the rotational speed of the Digital Crown while it's in motion.

You might use this information to change selections, modify values, or update your interface.

25Copyright @ Accedo 2016 | Apple TVOS

IMPROVED NOTIFICATIONS

You can schedule local notifications directly from your Apple Watch app, even while your app is running in the background.

You can use local notifications to alert users when tasks are complete, giving users the freedom to drop their wrists more quickly rather than wait for your app.

26Copyright @ Accedo 2016 | Apple TVOS

EXTRA LARGE COMPLICATIONS

Complications display timely and relevant information about your app on the watch face. Some watch faces do not display any complications, but most display at least a few. Complications are divided into families—circular, modular small, modular large, utilitarian small, utilitarian large, and extra large—and each family determines how information is presented onscreen.

27

38mm 42mm

Ring 126x126 133x133

Simple 182x182 203x203

Stack 156x84 174x90

Copyright @ Accedo 2016 | Apple TVOS

FASTER INTERACTIONS

Apps that appear in the Dock or whose complications appear on the watch face remain in memory, minimizing the time it takes for them to launch and respond to the user.

Built-in apps have been designed with the goal that interactions should take only 2 seconds, and the new features like Background App Refresh make this goal more achievable than ever.

28Copyright @ Accedo 2016 | Apple TVOS

tvOS 10

DARK MODE

Dark mode is applied to both the interface surrounding Apple TV apps and apps themselves to the extent they use standard user interface elements.

Apps with custom elements, like many games, will require a little more work by developers to implement dark mode.

30Copyright @ Accedo 2016 | Apple TVOS

SIRI

You can now combine multiple criteria in one query. For instance, you could say “find me this year’s best superhero movies” and Siri would then show you a list with all these criteria.

Third-party apps, such as YouTube, now also support Siri and deep links. You can search directly from the home screen.

31Copyright @ Accedo 2016 | Apple TVOS

APPLE TV REMOTE APP

The app lets users control their Apple TV with touch gestures; use the iPhone’s keyboard to enter email addresses, passwords, or other text; play, pause, fast forward, or rewind currently playing videos or songs; and, for owners of the latest-generation Apple TV, ask Siri to find something to watch.

32Copyright @ Accedo 2016 | Apple TVOS

SOME USEFUL LINKS

SOME USEFUL LINKS

• iOS Human Interface Guidelines

• Get Ready for iOS 10 / Checklist for IT

• Download iOS 10 UI Kit (.sketch, .psd)

• Download iPhone 7 mockup (.sketch, .psd)

34

iOS 10• watchOS Human Interface Guidelines

• Resources (.sketch, .psd)

watchOS 3• Getting Started with Apple TV HIG

• tvOS Human Interface Guidelines

• Resources (.sketch, .psd)

tvOS 10

Copyright @ Accedo 2016 | Apple TVOS

THANK YOU