techlist.io
KREN
figma

Making Design Within Reach for online shoppers | Figma Blog (opens in new tab)

figmadesign-systemsux-designresponsive-designcomponent-libraryuser-testinge-commerce

Design Within Reach (DWR) redesigned its e-commerce site to recreate the personalized showroom experience online, responding to changing consumer expectations and increased online shopping during COVID-19. In partnership with BASIC®, DWR adopted a transparent, collaborative workflow using Figma, conducted extensive customer research, and launched a responsive site with live sales support. The redesign increased sales and established a scalable design system for Herman Miller’s broader family of brands.

A Transparent Agency Partnership

  • DWR partnered with BASIC® to combine the agency’s e-commerce expertise with DWR’s internal brand and product knowledge.
  • Both organizations worked as one co-creative team rather than in separate workstreams.
  • Shared Figma files allowed designers in different companies and time zones to collaborate in real time.
  • Continuous access to the latest files eliminated version-control issues and effectively created 14-hour workdays across teams.
  • Figma prototypes also made it easy for executives and other stakeholders to review progress through shareable links.

Bringing the Showroom Experience Online

  • The redesign was informed by 110 hours of customer research and testing with more than 200 participants.
  • Interactive Figma prototypes enabled rapid usability testing and iteration.
  • The site launched in July 2020 with responsive layouts and video chat connecting shoppers with sales associates.
  • Customers using the new live chat features were nine times more likely to complete an online purchase.
  • DWR saw an immediate increase in purchases after launch instead of the typical temporary decline following a major website release.

A Scalable Design System

  • The redesign became the foundation for Herman Miller’s first design system spanning multiple brands.
  • DWR and BASIC® created a shared set of reusable components and a consistent visual language.
  • Developers can implement standardized components more quickly.
  • Content authors can assemble pages by dragging in prebuilt components, updating images, and editing text.
  • Cloud-based Figma libraries make it easier to share assets and scale the system across internal teams and external partners.

DWR’s experience suggests that combining close agency collaboration, user-centered research, real-time design tools, and reusable components can make complex showroom-style retail experiences effective online while preparing a brand for future growth.