While at Bearded, I worked with PPG Architectural Coatings to redesign their room visualizer app. This tool helped customers imagine their paint projects by giving them the ability to apply a paint color to a stock image or photograph of their room.
My Role:
UI Design (Lead)
UX Design*
HTML/CSS Prototyping*
Client Workshopping*
*In collaboration with Bearded team members
PPG's Original app
Key Project Goals
Choose Your Own Adventure vs Guided Workflow
The current app presents users with many different ways to achieve the same goal. Our goal was to provide a more linear and defined workflow so that users don’t become overwhelmed.
Mobile Matters
PPG’s current app did not support mobile, and this was causing many of the brands that used it to stop promoting the Room Painter Tool. Our focus was to make sure the room painter was responsive and worked at various device widths.
White Labeled for Brands
The new design needed to accommodate dozens of global paint brands and languages without looking generic.
Drive Users to Key Tasks
The tool was not only about color exploration, but also getting users to take the next step – finding a store or sharing on social media – without creating an account.
This can’t be a one-time effort
This project is not meant to be a final iteration, but a starting point focused on user needs and improving as PPG’s technology advances.
Choose Your Own Adventure vs. Guided Workflow
The existing tool was open-ended, with multiple starting points, unclear next steps, and no obvious path to find paints in-store. To be successful, the new tool had to keep users on a defined path and keep them from the “inspirational loop” that was caused in the old version.
Mobile Matters
From PPG’s data and our initial testing, one screen that was extremely important was the “choose color by family” view. On the mobile view, I wanted this to be as efficient and intuitive as possible. Our first iteration with flyout menus on either side was well organized and scalable, but not efficient for users. I revised this design to allow users to see the color options on screen, and streamline their ability to move between colors quickly. We were able to carry this convention to other parts of the app as well, to increase ease of understanding and simplify use.
Our first iteration at the color selection screen.
Our second iteration, simplified and streamlined.
It is now easy to switch through family colors on screen and "my colors" are given a permanent place in the header and available throughout the app.
These views carried over similar conventions, so color options were not hidden on mobile.
Drive Users to Key Tasks
Our linear process was successful, but through testing we found that some options were more important to users than others, and getting the user through the app quickly was critical to retention. With this feedback, we simplified and combined choices to streamlined the experience.
One piece of feedback we received was that users “didn’t see their room” in the stock imagery. This was in response to the stock imagery they were seeing, which was all of a certain style. Creating new photography was prohibitive for PPG, but we were able to address the issue by combining two screens into one. By making “Upload Your Photo” the first option in every stock photo category, users could simply upload their own, if they didn’t see anything familiar.
First iteration
Reduce Cognitive Overhead
Rather than putting the onus on users to choose their own route, we reduced cognitive overhead by consolidating all the options into a single, efficient user experience that PPG’s users loved.
Original applications with options on separate paths.
The tool needed continuous improvement, and one area in which this was very evident was the room painter. Our first iteration was an attempt to help the user paint walls using PPG’s current tools of plotting points and drawing edges. Through testing we found most users didn’t want pixel perfect results, they simply wanted to see paint on a wall. After workshopping with PPG’s backend team and presenting them with usability findings, we were able to significantly simplify this process into a one-touch interaction that users preferred.
This can’t be a one-time effort
The Results
After 3 months, PPG was able to provide us with results. Thanks to our redesign, more people were interacting with the app, and completing processes than ever before.
