Knucklepuck Case Study

Chico’s FAS

The Challenge

Chico’s FAS, Inc. is a retail brand that markets to fashion-savvy women 30 years and older through its three brands: Chico’s, White House Black Market and Soma. It operates 1,518 boutiques and outlets in the United States and Canada. Each of the brands presents a distinct online identity. Chico’s contracted Corey Brown to help architect a website update for Chicos.com, WhiteHouseBlackMarket.com and Soma.com.

Chico’s FAS needed to streamline a cumbersome, traditional workflow between designers and developers while bringing more consistency to the way the products were being presented on the website. They also needed responsive web pages for delivery on desktop, tablet and mobile.

The Solutions

We audited Chico’s FAS brand websites for all common elements. Then, we created a new, universal markup library to be used for each of Chico’s FAS brand websites. This created consistently in the markup and user experience.

Following an initial audit of each brand’s website templates and interviews with key stakeholders, a universal design system was developed to provide all members of the Chico’s FAS design and development teams with an atomic library and a new built-in workflow.

This extensible atomic library includes elements from each brand to maintain style guide consistency:

  • Headings
  • Paragraphs
  • Buttons
  • Form elements

The workflow is a low-fidelity, multi-level architecture allowing for brand-specific styling to be applied through production-ready markup, CSS and Javascript.

The Results

Chico’s FAS has an atomic library that is used by all design and development team members for each brand to create rapid prototypes and faster implementation with improved workflow.

What once took hours can now be completed in minutes. The way that products are being presented on the websites is consistent. All sites are responsive for delivery on desktop, tablet and mobile.

Photo for Gregg Friedman
“By moving to a flexible and responsive framework we have become more mobile optimized. The atomic library allows the teams to create consistent and unique layouts while reducing rounds of revisions and gaining speed to market.”
Gregg Friedman
Vice President, Digital Creative & Experience Design

Let's Get To Work

Contact Us - Homepage