Menu Interaction [Touch screen]

Here is a variation of my last menu interaction concept. It was action-based, which means that triggering any button calls a particular function.

Made a few changes and turned the idea into a state-based one. Took an earlier mentioned example with a Gear Switch. Designing this interaction, I primarily thought about a thumbstick on a VR Controller, but you can also use it for touch screen devices. In the demo, I used SwiftUI to quickly prototype the touch-based interaction.

Also, in the live demo, we can see all the benefits and importance of real-life prototyping:

1. If you want to use the UI, you want to ensure the device's display surface is not too reflective (HMI display, pilot's monitor, etc.);

2. You also want to make sure that the environment where you use the device is dark to avoid killing the UI contrast (driver's cabin, pilot's capsule, etc.).

🐱+🐙 Source code — https://github.com/Volorf/Menu-Interaction

Tools

UI Design: Figma

Language: Swift

Framework: SwiftUI

IDE: XCode

Font: Aeonik Mono

Stay tuned —

Dribbble | Behance | Instagram | Twitter

Oleg Frolov
Experiment with Interaction Design. Explore AR/VR.

More by Oleg Frolov

View profile