While it’s not quite as stark as the iOS 7 update, Apple is clearly marching towards a new design language in iOS 11. While iOS 7 was all about minimalistic and thinness, iOS 11 seems to be the opposite – big and bold. Across the app and feature redesigns, we see a decreased information density, big navigation bar headers and bolder typography everywhere.
There are more subtle design changes as well. Read on for our comparison of UI design and feature changes for iOS 11, as they compare to iOS 10. In the images below, the screenshot on the left is from iOS 10 and the one on the right is from iOS 11.
iOS 10 vs iOS 11: UI Design Changes
1. Merged Lock screen and Notification Center
The first stark difference between iOS 10 and 11 greets you right at the front door. Apple made a big splash when they redesigned the Lock Screen in iOS 10. In iOS 11, they’ve done something different, and what right now, seems confusing.
They’ve merged the Lock Screen and Notification Center to be one thing. So when you’re on the Lock Screen, you’ll see notifications you got when your phone was locked. But then you can swipe up in the middle of the screen to view notifications that came before.
There’s too much swiping going around right now and I’m not sold on the idea of merging the Lock Screen and Notification Center. But we’ll see more refinements here in the next 3 months before the final release.
2. Now Playing Card on Lock Screen
Now when you’re playing some music, it shows up as a card on the Lock screen (and thereby, the Notification Center), instead of taking up the entire screen.
What this means is that you’ll be able to scroll through notifications even when there’s media playing, and look up past notifications by swiping up.
3. Unlock Animation
In the first iOS 11, the unlock animation is new. When you press the Home button, the Lock Screen, slides up to reveal the Home Screen. As it’s now merged with Notification Center, this animation makes sense.
4. Home Screen
There are small changes on the Home screen. There’s the new wallpaper of course, along with new icons for status bar. The starkest difference is that the apps and folders on the dock no longer have their names. And thanks to this, the dock itself has shrunk by a few pixels.
5. Control Center Redesign
Control Center is back to being a one page only affair (thankfully). The buttons now have a dark background. Control Center can now take up an entire screen and comes with tiles that you can 3D Touch to expand. The expanded view gives you more information or options.
6. iMessage App Drawer
Apple has redesigned the iMessage app drawer to make it easier to find and use iMessage apps. They’ll now show up as a little ticker at the bottom of a conversation. Tap and hold to expand them. Swipe horizontally to scroll through. Tap an app icon to open it.
7. App Store Redesign
App Store has been completely redesigned and it looks more like the Apple Music app now. With a lower information density, bigger type and visuals.
There’s also a new Today tab, Games tab and Apps tab.
8. Siri UI Update
Siri’s UI has been changed. The text and updates are now left-aligned. The text is bigger and Siri now shows multiple answers instead of just one. There’s now a clearer button to edit your question to Siri as well.
9. Phone App Redesign
Similarly, the Phone app has also been redesigned to include the big bold headers, and titles in bold. Everything is more spaced out and clearer to read.
10. Calculator App Redesign
Both the icon and the entire app have been redesigned.
The icon has a more retro feel while the app looks more like the circular keypad in the Phone app.
11. Video Player UI
The built-in video player on iOS 11 sees a visual update.
Instead of the frosted glass sections on the top and bottom, iOS 11 player now has dark floating sections. On the iPad, there’s now a clear way to engage Picture-in-Picture and AirPlay.
12. Settings App Redesign
Settings app is also replacing the top navigation bar with huge titles. This is common in the Settings list page and some top level pages like Control Center as well.
This is common in the Settings list page and some top level pages like Control Center as well.
13. Status Bar Redesign
Status bar now has signal bars instead of dots. The location services icon is also different now – an outline instead of a solid icon.
14. Notes Design Refinement
Notes app gets bolder headings and titles across the app.
15. Safari Design Refinement
Safari’s UI is a lot more spaced out, with the URL bar expanding a couple of pixels. The URL text itself gets a bit of padding.
16. Calendar Design Refinement
In the calendar app, the Year view now looks different. The headers are again, bolder and they’re no longer all caps.
17. Storage Management Section
iCloud & Storage section has been renamed to iPhone Storage. It now has a Mac-style chart on top that breaks your storage usage by Apps, Photos, Videos and more. You’ll also see the last used date for apps in the list below.
18. iPad Dock
iPad’s new Dock looks a lot like the one on the Mac, it’s now floating and can be brought up by swiping up from the bottom of the screen. You can put more than 6 apps here. And recent apps show up in the right edge.
19. iPad Slide Over
Slide Over doesn’t show up from the right edge of the screen anymore. You have to tap and hold on an app from the Dock and bring it up to the screen to open it in a narrow, floating view above the full sized app.
20. iPad App Switcher
iPad App Switcher has been completely redesigned. It now includes the Dock, Control Center, apps, and Spaces.
Caught Any Subtle Changes?
Have you been using iOS 11? Did you catch any new design change that we missed out on? Share with us in the comments below.
