iPhone X user interface game design — new UX pattern. Pro, rounded corners, full screen, cropped scr…
Minimal Match Three — Home Screen
Designing for the new iPhone X proposes two new issues:
- The screen is obscured where common navigation items are placed
- Gestures drive the navigation through the UI.
To solve an interactive navigation like a video game, in this case a match three game, the UI needs to lean into the same interactions of the native apple interface
Story, aesthetics and design.
The design for this match three app is based on the idea that popular app genres can have modern clean aesthetics, simple gameplay design and tell a story without resorting to candy crush-ing or cute animals.
Minimal Match Three—Level Selection
Less is more
The navigation of Minimal Match Three is bottom left, top right and centre stage. I’ll go into some more detial:
- Back is bottom left like Android and Windows Phone. Back is not top left, but bottom, all UI that is used commonly should sit in thumbs reach
- Settings is where settings is for the native iOS
- Promos are easy to reach but also the least important
- Selection items are large and tell a story — instead of large titles with long descriptions and tiny ‘read more’ call to actions
- Top left tells you where you are—area one
Minimal Match Three — Gameplay area
In arms reach
The area of gameplay that is available on large screen is minimal when held in portrait mode, and smaller still when standing on a crowded moving bus.
iPhone X makes UI design easy—because all there is no UI
The UI disappears, there is no need for faint lines, small arrows, tiny text.
UI on iPhone X is should be as invisible as the iPhone itself, the content should be the main interaction point.
In this respect text as a button — something Windows Phone innovated on, is a interesting new UI pattern for the iPhone X.
Minimal Match Three—Level Theme Progression
What can we learn from iPhone X?
In the advertisements by Samsung for the edgeless display content becomes the focus of the device not the UI.
What Apple understands is that by removing the edge of the screen you need to remove the UI at the same time, and by doing so the content needs to work harder then ever to convey the actions the user should take next.
Now more then ever, content that is not clickable, is not usable.
Show your support
Clapping shows how much you appreciated Zakary Kinnaird’s story.
Be the first to write a response…