BAB-Hero-NEW-1BAB-Hero-NEW-1BAB-Hero-NEW-1

Experience Make-Your-Own Fun

Bringing life into the online experience with updated site design and iconic step-by-step stuffed animal creation

Platforms

Salesforce Commerce Cloud

Deliverables

Wireframes, Prototypes

Expertise

iA, UI / UX Design

Year

2015

BAB-Intro-1
BAB-Intro-2

Discovery

D-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-yD-I-S-C-O-V-E-R-y
LYONSCG was approached by Build-A-Bear Workshop to redesign their online shopping experience. At the core of the project was the goal of translating the unique and fun-filled experience of the physical retail storefront into the digital world. This meant that our team had to take into consideration the in-store experience, from the friendly and helpful staff to the bright and colorful displays. Additionally, we had to ensure that the website was user-friendly and easy to navigate, while also incorporating the ability for customers to customize their own teddy bears online.
BAB-Disc

Information Architecture

I-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-eI-N-F-O-R-M-A-T-I-O-n-A-R-C-H-I-T-E-C-T-U-R-e
One of the biggest challenges we faced was bringing the in-store experience online in an organized and intuitive way. We knew that our customers wanted to be able to purchase our products with ease, and that required a seamless online experience. To achieve this, we started off by creating concepts of step-by-step product configuration UI.
BAB-IA-1

Product Configuration - Build-A-Builder

Our goal was to create a product configuration experience that emulated the in-store customization journey as much as possible. We believe that customers should have the ability to fully personalize their purchases to their liking, and this vision is what drove us to design our product configuration experience.

BAB-IA-2
BAB-IA-3
BAB-IA-4
BAB-IA-5
BAB-IA-6
By creating an experience that is as close to the in-store customization journey as possible, we hope to provide our customers with a seamless and enjoyable process that allows them to create products that are uniquely their own.
BAB-IA-7

Make-Your-Own Product Configurator

The Build-A-Bear Workshop website redesign aimed to enhance the user experience by incorporating new features and improving the overall design. One of the key focuses was creating a virtual workshop experience that allows users to design their own bears online before visiting a physical store. This feature was developed to provide customers with a more personalized experience that enables them to customize their bears with various clothing and accessories.

BAB-IA-8
When customers enter a Build-A-Bear store, the first thing they must do is choose a furry-friend. This is the first step in the beloved journey to personalizing your stuffed animal. In addition to the unique designs that Build-A-Bear offers, there are also licensed character designs that customers can select from. These designs include popular characters from movies, TV shows, and other forms of media that are sure to delight fans of all ages.
BAB-IA-9

Made with Love <3

Overall, the experience of building a bear at Build-A-Bear is one that is both fun and memorable, providing customers with a lasting memento for themselves or their loved ones. The process of building a bear is interactive and engaging, something that we needed to bring to the online experience. We even provided special touches like a heart ceremony where customers can make a wish and place it inside their stuffed animal. Overall, Build-A-Bear is more than just a store - it's an experience that customers of all ages can enjoy and cherish for years to come.

BAB-IA-11
BAB-IA-12
ATC-Heart-Animation

E-Commerce Experience

E-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-eE-C-O-M-M-E-R-C-e-E-X-P-E-R-I-E-N-C-e
Our objective for the Build-A-Bear site redesign was to improve the user experience by creating a more modern and visually appealing design, while also taking advantage of the new ecommerce platform to enhance the overall functionality of the site. In order to achieve this, we conducted extensive research on the latest design trends and user behavior, and worked closely with the development team to ensure that the new design was optimized for seamless navigation and enhanced user engagement.
BAB-EE-1

Find-A-Workshop

During the site redesign process, one of the key areas of focus was the "Find a Workshop" feature. The goal was to make the process of finding the nearest Build-A-Bear Workshop location as simple and streamlined as possible for users.

BAB-EE-2
BAB-EE-3
We added more search filters to help users find the most relevant locations for their needs. Additionally, we redesigned the interface to make it more user-friendly and intuitive, with clear calls to action and helpful guidance throughout the process. Overall, these changes have helped to improve the user experience and make it easier for users to find and attend workshops on the site.
BAB-EE-4

Collection Landing Pages

We undertook a complete redesign of Build-A-Bear's landing pages with the objective of highlighting their featured collections more effectively. The company's licensed collections have seen a surge in popularity over the years, and our aim was to ensure that this growth translated into online sales as well.

BAB-EE-5
In order to achieve this, we implemented several new landing page concepts that we felt would be most effective in capturing the attention of potential customers. Additionally, we also designed a detailed Collection page that showcases all of the different collections available on the Build-A-Bear website. This page provides customers with detailed information about each collection, including pricing, availability, and other important details.
BAB-EE-6
BAB-EE-7

Product Details Page

We redesigned the product details page to optimize the ecommerce user experience. Our goal was to make it easy for customers to find everything they need to know about our products, including detailed specifications, shipping information, and customer reviews. In addition, we wanted to provide a way for users to fully customize their stuffed animals, so we added a “Start Customizing” button to every details page.

BAB-EE-8

Fun-Filled

Overall, the redesign was a success, providing customers with a more personalized and user-friendly experience that fully captures the unique and fun-filled nature of the Build-A-Bear Workshop.

Scroll-To-Top-Rocket-Animation
BAB-Grid
Previous
Bowflex
Next
iRobot