Architectural Website Redesign

 
  • Client: Sherwin-Williams

  • Project Type: Consulting Engagement

  • Timeline: December 2018 - May 2019

  • Team: 10 Undergraduate Students

My Role

I was the lead designer, advocating for the team’s research process and partnering with another member to create the new landing page. It was my first time utilizing the design process and it was inspired by my experience at RocketAir, a product design agency that I worked for at the same time as this project.

The Challenge

Sherwin-Williams is looking for new ways to engage potential stakeholders by enabling new marketing strategies.

The team was tasked with generating solutions for DIY and Architectural customers and presenting them at the GS headquarters. The company’s District Manager and point of contact emphasized the overall goal of our recommendation is to increase all three levels of architectural specifications preference (product, product-level, and product and color), each one of which has progressively greater value to Sherwin Williams. 

Research

Company Revenue ($17 Billion)

Wholesale Revenue Breakdown

User Interviews

The team was able to receive qualitative data by conducting 3 phone interviews with local architects, 2 of which were existing clients of Sherwin-Williams. Initially, most team members were not even on board with conducting user research before starting the ideation process. I was eventually able to convince two team members to help coordinate the interviews.

We had to consider early on that architects don’t come into contact with the company’s products, but they recommend those products to contractors through their specification sheets. Understanding this document was important because it helped the team determine the relationship between our client, buyer, and the user. Some of the questions we asked include:

  • What do you care about most when you write a spec sheet for a project?

  • How do you do research to find the best materials? What are some key things you consider?

  • How long does the process take? Do you ever find yourself overwhelmed?

  • Who do you normally work/consult with to get spec sheets done?

  • How does working on a spec sheet relate to your everyday responsibilities?

  • (For SW clients): What made you pick SW over a competitor?

Research Results

  • The #1 priority for architects is receiving the product at the right price while yielding quality.

  • They rely heavily on existing and long-term relationships with manufacturers, which might exist before they even join their firm.

  • They prefer to use familiar products that have already been tested.

  • They occasionally do online research when they can find the time.

  • A study done by the American Institute of Architects found that out of 300 architects, 60% were considered dynamists/innovators. They tend to be concerned about environmental factors and are willing to take calculated risks. However, they still make decisions primarily based on price.

Proposed Solution

With our users’ motivations in mind, I worked with one of my team members to find a way for Sherwin-Williams to take these insights further. We pitched our idea to the rest of the team and they helped us refine some of the details. We went far and wide because the company had the resources and mindset to implement any and all of the suggested features.

Plenty of ideas didn’t make the cut, such as mall kiosks, billboards, cold calling, social media campaigns, a monthly newsletter, etc. Based on the team’s research, we determined that Sherwin-Williams should create a website dedicated to architects which includes:

  • Different website experiences depending on user segments

  • Contact information for consulting architects and designers

  • Recent news regarding products and environmental factors

  • Documentation of projects that feature real products and the final results

  • Color tools: picker, sample information, etc

The client liked this idea because it was quantifiable, had a reasonable startup cost, and could serve as inspiration for their in-house development team.

Company Website (2019)

During this stage, I  took note of the current navbar which only specialists from particular fields may understand.  I wasn’t aware of it, but at the time I was curious about semantics.

During this stage, I took note of the current navbar which only specialists from particular fields may understand. I wasn’t aware of it, but at the time I was curious about semantics.

New Landing Page

A team member and I worked closely to bring the idea together on Figma. I took the lead on pushing pixels and structuring the content to align with the company’s business objectives. We ended up taking elements from the website’s original UI because it would be familiar to the client and more importantly, our users.

A team member and I worked closely to bring the idea together on Figma. I took the lead on pushing pixels and structuring the content to align with the company’s business objectives. We ended up taking elements from the website’s original UI because it would be familiar to the client and more importantly, our users.

Project Updates

In 2020, Sherwin-Williams went on to build out the following pages for its existing website which fell in line with the team’s recommendations.

Experiences Tab

The new Sherwin-Williams website is guided by an "experiences" tab that takes customers to the right products and services based on their segment.

The new Sherwin-Williams website is guided by an "experiences" tab that takes customers to the right products and services based on their segment.

Other Features That Made The Cut

The following are additional pages that align with our recommendations made a year prior.

Lessons Learned

  • Going the extra mile for user research, even if it's 2-3 users, is worth it. Some research is always better than none.

  • Always reflect on the relationship between the buyer and user, they aren’t always the same person and that can determine who you’re designing for.

If I Had More Time

  • I’d consider experimenting with different CTA’s through A/B testing.

  • I’d explore how the UI would look on mobile and design a semi-functional prototype.

  • I’d do more user research to see how the new website format can potentially scale to other customer segments.

If I Could Do It All Over Again

  • I’d take the time to wireframe on paper before touching a computer - the landing page was created over a single weekend and at the time I wasn’t aware of how wireframing could help us create with more intention instead of jumping right into the final mockup.

  • I'd spend more time selling my team on the design process. Several recommendations were being cultivated at the same time, so creating the space to talk about why we were so invested in certain ideas didn’t seem like it was worth it compared to working with a few members who were already on board. By spending more time creating a shared understanding of why we were committed to things like user feedback or taking time to make a landing page, the team would have established trust more easily.

Previous
Previous

Daily UI Challenge 2021