MY ROLE:  create high-fidelity wireframes, observe user tests, and collaborate with the UX and

development teams 

GOAL:  update the current Angie's List reviews system, and test an inline, progressive, and modal designs with Angie's List users 

Reviews Form

Summer 2016 - Angie's List

Brief

Angie's List thrives on customer feedback in the form of reviews and ratings. The current system is bulky and outdated, discouraging customers from providing feedback after using a service. Research shows that very satisfied customers leave reviews, as well as very unsatisfied customers - could a simplified, redesigned reviews system encourage an average customer to leave feedback? What is the easiest way to provide customers with options to express their opinions in a comprehensive, but uniform way?

Process

BRAINSTORMS & MAPPING

USER INTERVIEWS

INITIAL

WIREFRAMES

USER TESTING & ITERATIONS

HIGH-FIDELITY

DESIGNS

BRAINSTORMS & MAPPING

Since the company already had existing review forms, we started by brainstorming how to change the forms.

The team and I mapped out the process of the customer journey from receiving a service to leaving a review for that service. We then established three different main paths of travel to leaving a review throughout the current website, and brainstormed alternative journey maps with the goal of simplifying the process. This included drawing more attention to the review process and form, as well as reducing the amount of steps to find the review forms, and reducing the amount of steps to complete the review form. From this stage we moved into the specifics of the form design itself.

USER INTERVIEWS

User interviews were conducted with both Angie's List customers and service providers to gain updated data about the successes and pain points of the review system and form. These interviews provided insight from two very different points of view regarding the use and importance of reviews.

INITIAL WIREFRAMES

Wireframes took the structure of the current reviews form and modernized them. The team and I also experimented with multiple layouts to create a better flow for the user.

Initial wireframes were developed to give a visual representation to our ideas regarding the strategy of integrating the new reviews process as we presented them across development teams. We came up with two potential solutions to display the interface, and created wireframes for a mobile user interface.

USER TESTING & ITERATIONS

The user research team set up six testing sessions with Angie's List customers, and three with Angie's List service providers. Each testing session walked through the three different versions of the interface, randomized between participants. My role in the testing process was to attend sessions, record user feedback, and later assist in the coding of the data procured. As a team, we arranged the coded data into themes, from which we used to iterate upon our wireframes and create better, more high-fidelity designs. 

HIGH-FIDELITY DESIGNS

Based on user feedback, myself and my interaction design partner iterated upon the review form designs to create high-fidelity wireframes to prototype and use in another round of testing with users. 

Inline Design

Leaving Reviews + Feedback

  • The rating system is changed from 5-star to letter grades to promote a more grounded understanding of the service quality.

  • A simple Yes/No option for hire again was added after talking with users. The question "Would you hire again?" was one of the most important pieces of information for customers seeking service.

  • The option for a longer comment section supplements the more concise information on the page.

  • Optional additional information about service details that allows the company to collect qualitative data. 

  • A photo upload feature to show other potential customers the service provided.

  • Verification information confirms that users are Angie's List members in line with the review.

Service Details + Account Verification

PROS of the Inline Design include that all of the information for the user to complete is shown upfront, and in one page with minimized clicks or distractions from the purpose of the review form.

CONS of the Inline Design include that since all of the information is displayed together, customers may be overwhelmed by the amount of information, and not begin the review, or quit partially through completion. 

VeriBox Design

Submitting Reviews + Account Verification

  • The rating and review system remains the same as the Inline Design, the only change is the Account Verification flow. 

  • A lightbox appears before submitting the review, confirming that the user has an account, or requiring the user to create an account.

  • The toggle between Sign In and Register affords unnecessary information to be hidden.

  • The registration option allows Angie's List non-members to leave a rating and review, then sign up for an account. 

  • The registration process is detailed, but the lightbox takes the information out of the reviews flow, breaking the overall experience into two smaller tasks. 

Registering For An Account

PROS of the VeriBox Design include that the review and account sign in or registration process is separated out from the review process, breaking up the amount of information the user has to concentrate on at one time. 

CONS of the VeriBox Design include that the user does believe they are done with the process, then are introduced to another step before submitting. This could frustrate users and has the potential for users to quit rather than finishing the process.  

© 2020 MARLO OWCZARZAK | #MARLO2020