Wearable Shutter OS.
Interface Design | WearOS
my role
Product designer
duration
24 hours
project overview.
During my 3rd year of college, a graduated senior who was employed at Google reached out to our design group unexpectedly. He suggested organizing a designathon where we would all tackle the same problem statement. Intrigued by the idea, we agreed to participate. The format required each designer to develop a project based on the given statement, after which we would critique each other’s work. We thought it sounded like a great opportunity, so we decided to give it a try.
problem statement.
Camera app for Android watch. Works as a remote for your phone's camera. Imagine you put your phone on a tripod and want to click pictures or record videos. How would you expect the app to look and work?
Functionalities - click pictures, set timer, record videos, switch between primary lens and wide angle lens.
Deliverables - minimum 3 screens. Dimensions 360pixels x 360pixels. Remember smallest tap target size is 44pixels x 44pixels. Try applying Google Material 3.
assumptions.
Wear OS watches are made by various brands in three shapes: square, rectangle, and circle. This project uses a circular design, as it aligns with Wear OS guidelines optimized for circular screens, which are present in over 80% of Android watches.
Each watch must have at least one physical button, and rotating the button or dial is not allowed due to inconsistent availability across devices.
Live camera feeds are not supported; watches can only control the camera on a paired mobile device.
solution.
to capture image with
shutter
Design the interface so it feels just like using the camera on a smartphone. Arrange the buttons and settings so users can easily snap a photo with a minimal learning curve. Some basic but important functionalities that I covered are switch over to video mode, set a timer for delayed shots, adjust the zoom, and change the megapixel count. Make sure all these features are easy to find and use on the smaller watch display, creating a smooth and familiar experience for the user.
The watch crown can also function as a shutter button, allowing users to take photos either by tapping the shutter icon on the screen or by pressing the watch crown.
record tab.
Users can easily switch to the recording tab from the bottom navigation. There, you'll find options to start a recording and other basic settings. Once you start recording, you can pause and resume with a simple tap, and stop it when you're done. You can also take snapshots from your video at any moment. The recording time is shown at the top, keeping everything straightforward and easy to use. This setup ensures a smooth and familiar experience, much like using your phone camera.
switches compatibility.
The mobile device connected to the watch may not support all features, such as zooming in and out or switching the camera's megapixel setting. Therefore, controls will only appear if the connected device supports those functions. If a specific feature isn't available, the corresponding control will be hidden, and the remaining options will be centered for better visibility and access.
learnings.
User Interface Design for Small Screens: Designing for a smartwatch teaches you to prioritize only essential features, enhancing your skills in creating minimalist, easy-to-navigate interfaces.
Adaptive UI Elements: You learn to design UI elements that adapt based on the connected device's capabilities, like showing or hiding controls if the smartphone doesn’t support certain camera functions.
Cross-Device Compatibility: Working on seamless app integration between the watch and various smartphones deepens your understanding of device syncing and communication, making sure a smooth user experience.
