Behr ColorSmart Kiosk

In 2001, Behr Paint wanted to increase its presence in Home Depot by launching an interactive kiosk. Our goal was to help people with the tasks that are a challenge when choosing paints: selecting colors, finding coordinate colors, visualizing them, and calculating quantities. Our challenge was to create an engaging self-serve experience for people unfamiliar with touchscreens.

Behr ColorSmart Kiosk

In 2001, Behr Paint wanted to increase its presence in Home Depot by launching an interactive kiosk. Our goal was to help people with the tasks that are a challenge when choosing paints. Our challenge was to create an engaging self-serve experience for people unfamiliar with touchscreens.

1. Context

[↓] The Behr ColorSmart Kiosk would be competing for attention in busy Home Depots across North America. It had to be intuitive to use and help people find paint color choices in just a couple of minutes.

2. Interaction Planning

[↓] It was important to help our team get a handle on the scope of work. There were a lot of conditionals and edge-cases to consider. Thoroughly mapping the interactions and unhappy path states helped streamline the visual design and engineering work.

3. Interaction Design

[↓] Interface ideas were sketched on paper at full-size. They were taped to a wall so that we could get a better sense about what the kiosk would feel like. This helped us uncover usability issues before moving to visual design. The basic organizing idea behind the kiosk was one task per screen with new choices being progressively disclosed. Animations would provide continuity as the user moved through the color selection process.

4. From Sketches to Visual Design

[↓] Once the interaction design had been finalized, the project moved to visual design. While some of the details changed, the overall structure described in the sketches carried through to the finished product. Visual design credit: Joshua Fehr.

5. ColorSmart Kiosk

[↓] Here's the finished product in the Behr color center at Home Depot. The user's color choices would be incorporated into calls to action. At the end of the process, the user would receive a printout of their color choices and had the option of saving their choices for viewing and exploration at home.

1. Context

The Behr ColorSmart Kiosk would be competing for attention in busy Home Depots across North America. It had to be intuitive to use and help people find paint color choices in just a couple of minutes.

2. Interaction Planning

It was important to help our team get a handle on the scope of work. There were a lot of conditionals and edge-cases to consider. Thoroughly mapping the interactions and unhappy path states helped streamline the visual design and engineering work.

3. Interaction Design

Interface ideas were sketched on paper at full-size. They were taped to a wall so that we could get a better sense about what the kiosk would feel like. This helped us uncover usability issues before moving to visual design. The basic organizing idea behind the kiosk was one task per screen with new choices being progressively disclosed. Animations would provide continuity as the user moved through the color selection process.

4. From Sketches to Visual Design

Once the interaction design had been finalized, the project moved to visual design. While some of the details changed, the overall structure described in the sketches carried through to the finished product. Visual design credit: Joshua Fehr.

5. ColorSmart Kiosk

Here's the finished product in the Behr color center at Home Depot. The user's color choices would be incorporated into calls to action. At the end of the process, the user would receive a printout of their color choices and had the option of saving their choices for viewing and exploration at home.

1. Context

The Behr ColorSmart Kiosk would be competing for attention in busy Home Depots across North America. It had to be intuitive to use and help people find paint color choices in just a couple of minutes.

2. Interaction planning

It was important to help our team get a handle on the scope of work. There were a lot of conditionals and edge-cases to consider. Thoroughly mapping the interactions and unhappy path states helped streamline the visual design and engineering work.

3. Interaction Design

Interface ideas were sketched on paper at full-size. They were taped to a wall so that we could get a better sense about what the kiosk would feel like. This helped us uncover usability issues before moving to visual design. The basic organizing idea behind the kiosk was one task per screen with new choices being progressively disclosed. Animations would provide continuity as the user moved through the color selection process.

4. From Sketches to Visual Design

Once the interaction design had been finalized, the project moved to visual design. While some of the details changed, the overall structure described in the sketches carried through to the finished product. Visual design credit: Joshua Fehr.

5. ColorSmart Kiosk

Here's the finished product in the Behr color center at Home Depot. The user's color choices would be incorporated into calls to action. At the end of the process, the user would receive a printout of their color choices and had the option of saving their choices for viewing and exploration at home.

6. Impact + Takeaways

The Behr ColorsSmart Kiosk was installed in over 1500 Home Depot locations in North America. The core capabilities we launched more than 20 years ago live on in Behr's retail kiosks, website, and mobile apps.

  • Quickly learning what was at stake for this project was critical. We had to learn about Behr's color science, the challenges that come with finding coordinate colors, and we had to understand the technologies that would be utilized to deliver the experience.
  • Touch screens were a new technology at the time of this project. Making wireframe sketches at the same size as the screens helped us to get an intuitive feel for what would work. Usability testing and rapid iteration were crucial for the success of the project.
  • Designing for touch kiosks in busy environments involves many of the same challenges as working in interactive television or mobile devices. The number of choices on the screen must be minimized to speed up decision-making and reduce the potential for error.

6. Impact + Takeaways

The Behr ColorsSmart Kiosk was installed in over 1500 Home Depot locations in North America. The core capabilities we launched more than 20 years ago live on in Behr's retail kiosks, website, and mobile apps.

  • Quickly learning what was at stake for this project was critical. We had to learn about Behr's color science, the challenges that come with finding coordinate colors, and we had to understand the technologies that would be utilized to deliver the experience.
  • Touch screens were a new technology at the time of this project. Making wireframe sketches at the same size as the screens helped us to get an intuitive feel for what would work. Usability testing and rapid iteration were crucial for the success of the project.
  • Designing for touch kiosks in busy environments involves many of the same challenges as working in interactive television or mobile devices. The number of choices on the screen must be minimized to speed up decision-making and reduce the potential for error.

6. Impact + Takeaways

The Behr ColorsSmart Kiosk was installed in over 1500 Home Depot locations in North America. The core capabilities we launched more than 20 years ago live on in Behr's retail kiosks, website, and mobile apps.

  • Quickly learning what was at stake for this project was critical. We had to learn about Behr's color science, the challenges that come with finding coordinate colors, and we had to understand the technologies that would be utilized to deliver the experience.
  • Touch screens were a new technology at the time of this project. Making wireframe sketches at the same size as the screens helped us to get an intuitive feel for what would work. Usability testing and rapid iteration were crucial for the success of the project.
  • Designing for touch kiosks in busy environments involves many of the same challenges as working in interactive television or mobile devices. The number of choices on the screen must be minimized to speed up decision-making and reduce the potential for error.

← BEA Sales Demos

Site Planning →

← BEA Sales Demos

Site Planning →

← BEA Sales Demos

Site Planning →

Thanks for viewing my portfolio.

© Jess Ruefli 2025