Johnson & Co. Website Redesign
The Challenge
Johnson & Co. Craft Hardwood Floors needed a new and updated website. The old website was out of date, cluttered, and difficult to navigate. Customers needed to be able to quickly and easily learn about Johnson & Co. and contact them for a quote.
The Solution
The solution to the problem is an updated, responsive website that makes it simple and easy to request a quote from Johnson & Co., and allows prospective customers to learn more about available services.
My Role
Product Designer
Understanding the User
In order to establish an initial direction for the new design, interviews were conducted with the target audience of the website. The goal of these interviews was to understand pain points and the user’s goal in using the Johnson & Co. website.
Based on these initial interviews, an empathy map was created in order to concisely understand more about who our user is and what really makes them tick.
Using the information gathered up to this point, a persona was created to represent users and help guide the design.
A key takeaway from time with users was that quality of work was one of their biggest concerns when looking for someone to work on their hardwood floors.
Requesting a quote was another primary concern for users, as they desired a quick and easy way to request a time for Johnson & Co. to look at their floor and offer a quote.
Beginning the Design
With the user in mind, a series of paper wireframes were created to establish some early ideas for the website. Based on initial user feedback, the goal was to create a simple layout that clearly communicated the quality of the service, and allowed for the customer to easily contact Johnson & Co.
Paper wireframes were also created for a responsive website, allowing the user to access the site via a mobile device.
With paper wireframes guiding the process, it was time to create low fidelity digital wireframes using Adobe XD.
A low-fidelity prototype was created in order to test the overall basic flow.
The Solution
After receiving initial feedback from target users, high-fidelity mockups and a working prototype were created. The emphasis was on highlighting the quality of Johnson & Co.’s work and allowing people to request a quote quickly and easily. A responsive website mockup was created as well, in order to allow users to seamlessly access the site from a desktop or on their mobile device.
The home screen offers a clear layout, highlighting the benefits of Johnson & Co., and guiding the customer toward requesting a quote
Requesting a quote is a simple and straightforward process.
User Testing
With a working high fidelity prototype, it was time for final input from users. An in-person moderated usability study was conducted in order to gather more insight on the website design and the user flow to request a quote.
Users provided the following primary input:
A progress bar during the quote process would be helpful to know how long it is
A back button during the quote process would be helpful to allow the user to go back a step if they needed to change something
More clarity would be beneficial as to what happens next once the form is submitted
Based on this feedback, iterations were made in order to enhance the overall experience on the website.
Moving Forward
Impact
The Johnson & Co. website redesign will make it easier than ever for potential customers to learn more about Johnson & Co. Craft Hardwood Floors’ services, and allow website guests to request a time to receive a free in-home quote. This clearer design and simple process will ultimately lead to increased engagement and increased business for Johnson & Co.
Takeaways
The key to this redesign was simplicity and ease of use. Users wanted to find out more information about Johnson & Co. quickly and easily, and they wanted to be able to receive an estimate for the work without having to spend too much time or energy on that process. Focusing on the needs of the user guided the design decisions along the way, resulting in a website that will ultimately serve both the customer and the business.
Next Steps
Finalize launch of new website
Monitor utilization of the “Request a quote” function
Track completion rate of request process, and watch for drop-offs during quote requests