WEARABLE UI DESIGN
PROJECT SUMMARY
This project involved developing a design language for a wearable watch interface that incorporated both weather and time data. To start, I made five mood boards which guided the design exploration of potential watch interface designs through sketching. Then the sketches were used to create a medium to high fidelity wireframe that visualized the final concept of my watch interface. To bring the design concept to life, I animated possible gestures and interactions in After Effects.
TIMELINE
April 2023
ROLE
UX Designer, Motion Designer
TOOLS
Figma
After Effects
Research
MOOD BOARDS
The five mood boards I created consisted of: two focusing on physical and digital clock faces, two on weather data graphics, and one that described my design language using visuals and one word.
Iteration
SKETCHES
I created sketches for the watch wearable interface based on the mood boards that I created. These sketches included a design for the clock face, as well as possible UI complications that could be used for the designs.
Design
MEDIUM AND HIGH-FIDELITY WIREFRAMES
MOTION DESIGN
To explore the motion design of my UI's interactions, I brought my high fidelity wireframes into After Effects. I focused on two touch gestures: long press and left swipe.
The long press gesture allows users to drag the large complication from the clock face and release it to drop it into the corner, changing it into a corner complication. The left swipe gesture switches to other complications assigned to the corner.
Mockup
PREVIOUS
NEXT
Humber Current
Toronto Zoo