Pattern Brands

I was a Junior Product Designer at Pattern Brands, a rapidly-growing lifestyle e-commerce startup with the mission to make everyday rituals at home enjoyable. I worked closely with the  e-commerce, marketing, and development teams to establish a strong web foundation for the growing portfolio of brands. Each brand had their own website in addition to being part of the Pattern Family of Brands site. I helped maintain and grow one centralized web system. As we scaled, the other product designer and I quickly adapted our corpus of design elements, styles, modules, and UX flows.

Design Systems • Flexible Web Modules • Web & Graphic Design

Impact

  • Incorporated 3 new brands into the portfolio by integrating them into the design system and establishing each brand’s new web presence
  • Continuously audited and restructured the robust design system, saving the design team’s time when acquiring new brands
  • Worked directly with the development team to create new modules for the design team to use
  • Templatized the modules for the design team to easily and consistently grow the websites
  • Created web style guides for future designers to maintain visual consistency on each brand’s site
  • Created web graphics, including some brand elements, for all 6 brands’ new products, campaigns, and promotions
  • With other teams, established process and communication line to improve overall efficiency

One Design System, Countless Brands

I re-organized, added new elements, combined elements, added auto-layout to more complex ones, and grouped & labeled components. This helped me and the other product designer to incorporate new brands more efficiently.

Flexible Web Modules

Making existing modules flexible by finding creative hacks, while templatizing permutations for speedy webpage-building. My biggest takeaway was that coming with a solution for one use case can open up a door to myriad use cases, providing engaging variety for the user while keeping engineering demands to a minimum.

Templatizing module variations for YIELD, allowing designers to build webpages faster with visual consistency.

Highlight Lists

The Highlight List module provides an new way to view featured products, while making cross-brand product features possible. It autoplays like a slideshow to highlight one of the items in the list. Each item is also interactive, pausing the autoplay on hover and linking to the respective product.

Exploring scent notes and products for YIELD
Cross-selling other portfolio brands on the Letterfolk site

Masonry Grids

Masonry grids are very flexible for a variety of uses, while being visually appealing and interactive. Originally designed for exploring possible designs for Letterfolk’s Tile Set Bundles, this module also showed a lot of potential for other use cases. This module could be used for moodboards, blogs, and user-generated content. As needs grow in the future, this module can flex to serve other purposes such as including videos for customer testimonials.

Early Concepting

First use case to explore different style bundles for Tile Mat designs
Adding a filter option

Later Concepting

A regular grid display was more fitting in the initial use case since we wanted to use non-lifestyle images. However, the masonry style still had potential for other purposes.

User-Generated Content & Moodboarding

Flexing the grid to add vibrancy, community, and inspiration.

Web & Graphic Design

Web Style Guides

Landing Pages

Homepages

Newsletter Designs

Next: Branding & Website Redesign
→