AI Meeting Translator
Reading time: 3 minutes
My Role
Research + Wireframes
Device
Mobile
Tool
Figma
Design Goals
Conceptual Model
Begin by creating the user journey.
Then, transform key insights into How Might We questions.
Finally, explore high-level design opportunities based on those HMWs.
Feature Lists
Converge high-level design opportunities into feature lists
Site Map
Based on feature lists, create site map
Tabs
Ensuring 4 tabs by above research: photos, albums, and templates, respectively.
Photos
Albums
Template
Design Iterations
Before
Critique：
Search Box:
It blends in with the white background, lacking visual prominence.
The clickable area of the background box is small, making it easy for users to miss.
The color of the search icon does not match the gray hint text color. Research shows that in most real-world products, the search icon color matches the gray hint text color.
Theme Color Icon:
The icon is not intuitive enough.
Fonts:
The font sizes and weights of different titles and content need further optimization. For example, the text in the tags is too small.
Current Tag:
The current tab (photo) icon has a blue border; the time tag is entirely blue; and the camera icon is also entirely blue. This can confuse users about which tag they are currently on and obscure the hierarchy.
After
Design Improvement：
Redesigned a more intuitive theme color icon.
Adjust the search bar height, making it easier to tap with fingers.
Added a stroke and white background to the search box, contrasting with the blue-gray background, making it more noticeable.
Enlarged the text size on tags under the tabs for better readability.
The current tag's background color uses a gradient as a highlight, which is a trendy color choice.
The current tag (photo) uses a filled blue color, making it clear to users which tag they are currently on.
The album uses AI to automatically categorize photos and generate tags displayed at the top for easy access.
Users can add custom tags via the "+" button, delete tags by long-pressing, and reorder them by dragging to prioritize.
Users can co-manage and edit shared albums in real-time. Colored profile icons show how many invitees are active, creating an emotionally engaging experience.
Two editing scenarios:
User and invitee edit the same photo
User and invitees edit different photos