Company
Pro.com
Brief
Redesign website in order to help customers more easily find Pro.com early in their journey of a home improvement project
Note: An existing designer had started this project and handed off some competitive research, an initial site architecture, and early wireframes of the new website. We collaborated for a week to make sure I had all the necessary information before his departure.
Timeframe
2.5 months from build to launch
The original Pro.com website was effectively a landing page/brochure page for the company. However, it was not designed to optimize SEO and was ranking poorly in user searches. My goals for this redesign were to increase brand awareness and rankings on the site to help customers find us, and then help them feel validated that Pro.com is the right company for their project. Through a more image forward website with intuitive user flow, customers would be able to discover if we serviced their area, the kind of work we do, and more.
Over the course of 2.5 months, I was able to restructure, redesign, and ship the improved website. The new site was faster, optimized for search, easier to update, and overall more indicative of Pro.com as a company.
This project was a huge success as we were able to hit or exceed our metrics. One of the largest indicators of success was an increase in organic lead traffic from high intent customers. Additional metrics below:
Impression levels reached the highest level so far at around 30-35,000 impressions per day
Clicks on searches rose from an average of 50 to over 350 per day (from
Traffic from high intent customers rose from 50-60 in December to around 200-250 sessions per day
(Old and Redesigned Pro.com website side by side)
Content Hierarchy + Wireframes
I inherited this project from another designer who had already created an initial site map, sketches, and conducted competitive research. I took this existing site map (see below) and worked with the Marketing team to develop the right level of content hierarchy for the site.
I collaborated with my team to create basic wireframes to guide discussions with relevant stakeholders on page content. Here are some examples.
Below is a description of each page type described by its intended purpose and the final mock ups that were presented to the CEO and executive team prior to development.
Homepage: Needed to demonstrate what we do and where we work. Previously, we received feedback that homeowners,
architects, and other customers didn’t know what kind of company we were.
City Pages: Surface the local projects we’ve completed in each market while highlighting the team members that you might work with. These pages are designed to rank on Google searches for terms like “Denver general contractor” and “remodeling company near me”.
Service Pages: Intended to surface the variety of work that we do with multiple project examples in each category.
Portfolio Page: Showcases our completed projects and is now easily navigable from all page types
Individual Project Pages: Provide more detail for each project including the project type, location, and a more blog-like overview of the project details. These pages are accessible from nearly any page on the site.
Art Direction + Brand Representation
One of the key asks from the CEO was that the website instills that feeling of “pinterest home inspiration” but also makes it clear that we are a general contractor who builds / remodels homes. Previously, we received feedback that homeowners, architects, and other customers didn’t know what kind of company we were. Often, they associated the name “pro.com” with sites like Home Advisor or Thumbtack.
While we had many photos of our finished homes, we did not have many that showed our work in action. Therefore, In true start up fashion, my manager and I decided to hold a photo shoot to create our own hero image. Within a few days of making this decision I had gathered visual inspiration and was out at a construction site art directing the shoot.
My directive was that we were creating an image that shows the following:
We are a general contractor and we build / remodel homes
We are focused on the customer and our project managers are hands on
How we use technology in our approach
We choose to have the shoot in one of our unfinished homes (with owner permission of course) to show our work in action and had a customer engaging with one of our Pro.com Project Managers. In an effort to avoid the look of a stock photo, we used more dramatic lighting and chose angles of the home.
Launch
Here is the live site for Pro.com. All mockups were shared with our developers via Zeplin so they could access specs, but I also worked closely with the developer going back and forth to fine tune UX/UI elements.