Chick-fil-A.com Redesign
Chick-fil-A.com Redesign
Fall 2015–Fall 2016 • Wondersauce
Team Members:
Team Members:
- Kaley Hedric Product Management
- Corey Michalek Design Lead
- Mark Austin Junior Visual Design
- Lindsay Knoll Junior Visual Design
- Meghann Bush Project Management
- Kaley Hedric Product Management
- Corey Michalek Design Lead
- Mark Austin Junior Visual Design
- Lindsay Knoll Junior Visual Design
- Meghann Bush Project Management
America’s most beloved restaurant chain was ready for a complete redesign and reimagining of their online presence.
Working together we created a new site that’s both a storytelling and information hub that serves as a digital extension of their restaurants. The site features localized menus and pricing and content that adapts based on location, time of day, and customer preferences.
America’s most beloved restaurant chain was ready for a complete redesign and reimagining of their online presence.
Working together we created a new site that’s both a storytelling and information hub that serves as a digital extension of their restaurants. The site features localized menus and pricing and content that adapts based on location, time of day, and customer preferences.
America’s most beloved restaurant chain was ready for a complete redesign and reimagining of their online presence.
Working together we created a new site that’s both a storytelling and information hub that serves as a digital extension of their restaurants. The site features localized menus and pricing and content that adapts based on location, time of day, and customer preferences.
America’s most beloved restaurant chain was ready for a complete redesign and reimagining of their online presence.
Working together we created a new site that’s both a storytelling and information hub that serves as a digital extension of their restaurants. The site features localized menus and pricing and content that adapts based on location, time of day, and customer preferences.
How can we set a new precedent for modern fast food websites?
How can we set a new precedent for modern fast food websites?
How can we set a new precedent for modern fast food websites?
Goals
- Consolidate duplicate and fragmented content, digital properties, and microsites.
- Create a storytelling platform that emphasizes people and their stories
- Embrace a commitment to food transparency with nutrition and ingredients
- Prioritize location finding to drive guests to nearby restaurant locations
- Highlight and integrate online ordering throughout the experience
- Individualize each guest’s experience through personalization and localization
- Craft a premium experience that brings the brand to life on the web
- Cleverly integrate the iconic “Eat Mor Chikn” cows
- Consolidate duplicate and fragmented content, digital properties, and microsites.
- Create a storytelling platform that emphasizes people and their stories
- Embrace a commitment to food transparency with nutrition and ingredients
- Prioritize location finding to drive guests to nearby restaurant locations
- Highlight and integrate online ordering throughout the experience
- Individualize each guest’s experience through personalization and localization
- Craft a premium experience that brings the brand to life on the web
- Cleverly integrate the iconic “Eat Mor Chikn” cows
- Consolidate duplicate and fragmented content, digital properties, and microsites.
- Create a storytelling platform that emphasizes people and their stories
- Embrace a commitment to food transparency with nutrition and ingredients
- Prioritize location finding to drive guests to nearby restaurant locations
- Highlight and integrate online ordering throughout the experience
- Individualize each guest’s experience through personalization and localization
- Craft a premium experience that brings the brand to life on the web
- Cleverly integrate the iconic “Eat Mor Chikn” cows
- Consolidate duplicate and fragmented content, digital properties, and microsites.
- Create a storytelling platform that emphasizes people and their stories
- Embrace a commitment to food transparency with nutrition and ingredients
- Prioritize location finding to drive guests to nearby restaurant locations
- Highlight and integrate online ordering throughout the experience
- Individualize each guest’s experience through personalization and localization
- Craft a premium experience that brings the brand to life on the web
- Cleverly integrate the iconic “Eat Mor Chikn” cows
Content Consolidation
Content Consolidation
Content Consolidation
Content Consolidation
Chick-fil-A wanted to bring all their digital properties together under one roof. Over the years they had amassed quite a collections of one-off site for "this and that, and that, and don't forget about this one, and oh... I'd never actually seen this one before, and who knew this one existed?" And so on and so forth. Get the picture? We worked really hard to understand all the content we were being asked to consolidate, looking not just at what it was, but what it might belong with, who the intended audience was, and asking where it fell in a hierarchy with the other content.
Chick-fil-A wanted to bring all their digital properties together under one roof. Over the years they had amassed quite a collections of one-off site for "this and that, and that, and don't forget about this one, and oh... I'd never actually seen this one before, and who knew this one existed?" And so on and so forth. Get the picture? We worked really hard to understand all the content we were being asked to consolidate, looking not just at what it was, but what it might belong with, who the intended audience was, and asking where it fell in a hierarchy with the other content.
Chick-fil-A wanted to bring all their digital properties together under one roof. Over the years they had amassed quite a collections of one-off site for "this and that, and that, and don't forget about this one, and oh... I'd never actually seen this one before, and who knew this one existed?" And so on and so forth. Get the picture? We worked really hard to understand all the content we were being asked to consolidate, looking not just at what it was, but what it might belong with, who the intended audience was, and asking where it fell in a hierarchy with the other content.
Chick-fil-A wanted to bring all their digital properties together under one roof. Over the years they had amassed quite a collections of one-off site for "this and that, and that, and don't forget about this one, and oh... I'd never actually seen this one before, and who knew this one existed?" And so on and so forth. Get the picture? We worked really hard to understand all the content we were being asked to consolidate, looking not just at what it was, but what it might belong with, who the intended audience was, and asking where it fell in a hierarchy with the other content.
How do you architect a website cleanly and simply but still fold in an abundance of content?
How do you architect a website cleanly and simply but still fold in an abundance of content?
How do you architect a website cleanly and simply but still fold in an abundance of content?
How do you architect a website cleanly and simply but still fold in an abundance of content?
Through card sorting we ultimately recognized we were designing for four main audiences: customers, employees, restaurant operators, and business partners. It might not look sexy but boy was it helpful.
Through card sorting we ultimately recognized we were designing for four main audiences: customers, employees, restaurant operators, and business partners. It might not look sexy but boy was it helpful.
Through card sorting we ultimately recognized we were designing for four main audiences: customers, employees, restaurant operators, and business partners. It might not look sexy but boy was it helpful.
Menu as the Homepage
Menu as the Homepage
Menu as the Homepage
Our early research with customers quickly revealed that the top reason to visit Chick-fil-A's website was to see the menu. Based on this insight we took an unconventional approach and rather than force visitors to seek out that portion of the site, we simply moved menu to homepage. Right when a user lands on the site, there it is.
Our early research with customers quickly revealed that the top reason to visit Chick-fil-A's website was to see the menu. Based on this insight we took an unconventional approach and rather than force visitors to seek out that portion of the site, we simply moved menu to homepage. Right when a user lands on the site, there it is.
Our early research with customers quickly revealed that the top reason to visit Chick-fil-A's website was to see the menu. Based on this insight we took an unconventional approach and rather than force visitors to seek out that portion of the site, we simply moved menu to homepage. Right when a user lands on the site, there it is.
The menu begins with a fullscreen area that can adapt its content based on the time of day, what we know about the individual's preferences, or any local promotions. As the user scrolls down the page they discover a tabbed menu navigation preset to the most appropriate menu section for the time of day.
The menu begins with a fullscreen area that can adapt its content based on the time of day, what we know about the individual's preferences, or any local promotions. As the user scrolls down the page they discover a tabbed menu navigation preset to the most appropriate menu section for the time of day.
A majority of specialty running shoe sales happen in-store where shopper's are able to speak directly with a running shoe specialist. In this direction we wanted to capture the familar in-store conversational format to guide the shoe selection process.
Storytelling
Storytelling
Storytelling
Storytelling
Spreading positive heart-warming stories is one thing Chick-fil-A cares about most. "We wanted to offer [guests] something a little unexpected, like access to acclaimed chefs, seasonal recipes they can make at home, and stories that inspire, like the documentary-style film of a high school student who bonds with a dementia patient through their love of art,” Ashley Callahan of Chick-fil-A explained. As a result, storytelling became a central pillar of the online experience.
Spreading positive heart-warming stories is one thing Chick-fil-A cares about most. "We wanted to offer [guests] something a little unexpected, like access to acclaimed chefs, seasonal recipes they can make at home, and stories that inspire, like the documentary-style film of a high school student who bonds with a dementia patient through their love of art,” Ashley Callahan of Chick-fil-A explained. As a result, storytelling became a central pillar of the online experience.
Spreading positive heart-warming stories is one thing Chick-fil-A cares about most. "We wanted to offer [guests] something a little unexpected, like access to acclaimed chefs, seasonal recipes they can make at home, and stories that inspire, like the documentary-style film of a high school student who bonds with a dementia patient through their love of art,” Ashley Callahan of Chick-fil-A explained. As a result, storytelling became a central pillar of the online experience.
Spreading positive heart-warming stories is one thing Chick-fil-A cares about most. "We wanted to offer [guests] something a little unexpected, like access to acclaimed chefs, seasonal recipes they can make at home, and stories that inspire, like the documentary-style film of a high school student who bonds with a dementia patient through their love of art,” Ashley Callahan of Chick-fil-A explained. As a result, storytelling became a central pillar of the online experience.
"Our goal is to share stories and create meaningful moments with existing and potential customers.”
"Our goal is to share stories and create meaningful moments with existing and potential customers.”
"Our goal is to share stories and create meaningful moments with existing and potential customers.”
"Our goal is to share stories and create meaningful moments with existing and potential customers.”
The Today's Stories bar gives stories a presence on the homepage without them getting in the way.
The Chicken Coop serves as the site's central hub for all things storytelling with everything from recipes and stories to activities and press releases.
Small "bite-sized" pieces of content appear all over the site linking utility focused content to related stories.
Closed on Sunday
Closed on Sunday
Closed on Sunday
As one of the brand’s most recognizable traits, the site also “closes” on Sundays driving visitors to family focused stories and activities instead. As a day set aside to be spent with family and friends and worshiping if you choose, this content is intentionally non-promotional focusing on community and bringing people together. And don't worry, the rest of the site is still accessible on Sundays if you need it.
As one of the brand’s most recognizable traits, the site also “closes” on Sundays driving visitors to family focused stories and activities instead. As a day set aside to be spent with family and friends and worshiping if you choose, this content is intentionally non-promotional focusing on community and bringing people together. And don't worry, the rest of the site is still accessible on Sundays if you need it.
As one of the brand’s most recognizable traits, the site also “closes” on Sundays driving visitors to family focused stories and activities instead. As a day set aside to be spent with family and friends and worshiping if you choose, this content is intentionally non-promotional focusing on community and bringing people together. And don't worry, the rest of the site is still accessible on Sundays if you need it.
On Sundays visitors encounter a fullscreen timelapse we shot explaining that the restaurants are closed. The overlay can be dismissed to access the site normally.
On Sundays visitors encounter a fullscreen timelapse we shot explaining that the restaurants are closed. The overlay can be dismissed to access the site normally.
Thoughtful Touches
Thoughtful Touches
Chick-fil-A is known for going above and beyond and for thoughtfully considering the little things. We worked hard to bring that spirit to their new website.
Chick-fil-A is known for going above and beyond and for thoughtfully considering the little things. We worked hard to bring that spirit to their new website.
Mobile users can interactively construct each sandwich to learn what comes on it and to see each fresh ingredient individually.
Mobile users can interactively construct each sandwich to learn what comes on it and to see each fresh ingredient individually.
Mobile users can interactively construct each sandwich to learn what comes on it and to see each fresh ingredient individually.
Let's not forget about the cows. They'll pop up in various places across the site so stay on the lookout.
Let's not forget about the cows. They'll pop up in various places across the site so stay on the lookout.
Let's not forget about the cows. They'll pop up in various places across the site so stay on the lookout.
Chick-fil-A wanted to create an authentic experience avoiding overly aspirational beauty shots of the food and condiments. This sauce hover state lets guests interact with each sauce packet as they would in a restaurant and let's them see both the packaging and the sauce inside.
Chick-fil-A wanted to create an authentic experience avoiding overly aspirational beauty shots of the food and condiments. This sauce hover state lets guests interact with each sauce packet as they would in a restaurant and let's them see both the packaging and the sauce inside.
Chick-fil-A wanted to create an authentic experience avoiding overly aspirational beauty shots of the food and condiments. This sauce hover state lets guests interact with each sauce packet as they would in a restaurant and let's them see both the packaging and the sauce inside.
On scroll the primary navigation collapses down to a chicken sandwich menu icon.
On scroll the primary navigation collapses down to a chicken sandwich menu icon.
On scroll the primary navigation collapses down to a chicken sandwich menu icon.
Chick-fil-A.com is a massive site and I'm happy to talk about any of the nearly 100 pages we designed for the site (many of which follow a handful of templated structures we developed for the project).
*Additional process available upon request
I've also recently helped...
Chick-fil-A
Brooks Running
Brooks Running
The Daily Dot