Embedded Files
Building a modular, mobile-first UI library to support recurring collection releases for Pleihouse, a furniture and home decor e‑commerce brand.
Role: UI DesignerScope: Brand exploration, UI library, high fidelity prototype
Brand & Audience
Pleihouse is a design-led furniture and home décor brand focused on modular, expressive living. Its products are playful yet functional, combining tactile materials and sculptural forms to support real-life use. The brand balances personality with practicality, creating spaces that feel intentional, adaptable, and distinctly human.
Design System Approach
The UI library follows Brad Frost's Atomic Design method: Foundation → Atoms → Molecules → Organisms → Templates → Pages.
The system accomodates a variety of considerations.
Mobile-first: Designs prioritize small screen web browsers, incidentally reinforcing hierarchy and simplicity.
Modular product releases: Components must be reusable across recurring seasonal collections.
Brand flexibility & limited marketing control: Images may vary across campaigns; UI must remain reasonably neutral, legible, and functional regardless of photography.
Accessibility: Reasonable contrast considering colourful photography + interactives sized for comfortable mobile interaction.
Desktop scalability: While mobile-first, the modules also consider desktop as it is a browser experience .
Conversion: Elements designed to support business goals (ex. primary buttons to recommend low-friction purchasing actions, modular content blocks to guide exploration + repeat visits, clear product display.)
Outcome
Within this design system, the brand identity informs the UI without compromising usability, letting personality coexist with structure. While the UI remains fairly neutral to maintain usability alongisde expressive visuals, there are subtle moments of delight that don't compromise clarity (ex. hover animations).
As a result, we have a documented, scalable, mobile-first UI library designed to support recurring furniture collections while maintaining a strong brand voice.
The system in action can be seen in this ordering flow.
Next Steps
More screen sizes: Expand the system to desktop and tablet breakpoints for responsive layouts.
Developer documentation: While specs have been outlined in the design system, a dev-specific handoff document that doesn't go into component purpose would be helpful.
More pages: Design more pages to test the functionality of the UI library, and add more content blocks if needed.
Usability testing: Conduct usability testing on modules and flows to refine hierarchy and delight.
Other Projects
Lululemon Audit & Redesign—Improving discoverability and personalization for the Lululemon experience.
CityScout—Walking app supporting curious, lightweight discovery for casual urban explorers.
Google Sites
Report abuse