Enter Password
Project Overview
Timeline: May – Sep 2023
Status: Launched
My Role: UI/UX Designer
Team: Project Manager: Yao Tang
Design Lead: Jinghao Ran
UI/UX Designer: Qingyu Zhang & I
Context & Goals
[Context] A Chinese-market smart-home mobile app that manages multiple device types (lighting, curtains, outlets, speakers) and everyday routines through reusable UI components.
[Goals]
Unify look & feel with minimal, brand-aligned visuals
Ship a reusable component set (cards + controllers)
Introduce a simple “Scenes” pattern for grouped actions
Keep documentation lightweight and easy to adopt
Visual Language
A brand-forward color palette paired with a bilingual type scale (EN/中文) creates clear hierarchy and calm, legible screens for dense smart-home data.
Illustrations & Pictograms
Friendly, minimal illustrations and icon-like pictograms support empty states, onboarding, and feature highlights without competing with core controls.
Component Library
A compact, reusable set of mobile components—shown through the AC control system as the example.
1) AC Device Card
At a glance: a device pictogram, name, a run-status line (mode + temperature with contextual badges), a primary Power toggle, and a room tag.
2) Controller
AC controllers are designed for quick, one-hand adjustments with clear, glanceable states—prioritizing the most common actions while keeping the interface calm and brand-aligned.
3) Bottom Sheet
A concise bottom sheet surfaces advanced AC options without leaving the page. Primary controls stay at the top, with secondary adjustments below, so routine tweaks are one swipe away while deeper settings remain discoverable.
Full-page Compositions
Full-page compositions place the AC device card, controllers, and bottom sheet into real screens—highlighting consistent color/type tokens, clear hierarchy, and calm visual density.
AC Controls - different mode in use
Additional AC Controls - Bottom sheet in use