Role: Product Design, Prototyping, User Flow, User Research 

Tool Used: Adobe XD

This project is a fictitious scenario, completed as a part of Adobe XD's UI Design Challenge.

The Problem

How can we make an ordinary household object into a personalized interactive device which displays electronic information in a real-world environment in a subtle, non-distracting and organized way?

The Idea

Turn a mirror into a personal assistant which can show more than just your reflection, but give you a glimpse of your day as well as help you decide what to wear.

Redefining Digital for A Ordinary Household Object

Since the number of smart mirror designs is still relatively low, I started by researching existing templates for the home screen and digital closets that have a modern,organized design and detailed the strengths and weaknesses of each. I looked at the user control and freedom, consistency and standards, and flexibility and efficiency of use for each . These designs set the visual direction for everything I would deliver in the future.

User Interaction

I decided on gestures for users interaction such as scrolling through the clothing options, selecting an item, and accessing full view display . The main gestures are displayed in the image to the right.

I also made minor changes on the layouts to make it look more clean, compact and aesthetically pleasing by adding menu icons, and highlighting items the user has selected.

Color Palette

One crucial tasks was to include all necessary elements (navigation bar, tabs, time, temperature, etc.) in a minimal way so not to distract the user or prohibit them from being able to view themselves in the mirror. After all, this piece is meant to be functional and not just a cool, tech toy to show off to guests. For this reason, I chose a soft color palette that blended well with the mirrors existing opaque design.

The Takeaway

Although this was a design challenge, the next steps would be to do user testing in order to see how people respond to the product in real time. This being a touch-based design could definitely lead to more problems needing to be resolved (i.e. fingerprints).

In future iterations, I would like to implement additional features I could not include due to time constraints, such as voice interaction, a memo on screen, selection of news headlines according to personal preferences, and possibly app usage such as ride sharing and food apps (i.e. Lyft, Uber, Postmates, Ritual, etc.) for more personalization in order for the user  to get the full virtual assistant feel.

◆    ◆    ◆

... Another One (Case Study)!

Using Format