Trio

Freelance Project

Context

Trio's website wasn’t holding user attention and conversions were low. Our client felt that the website was too content heavy and it didn’t have a friendly look. She wanted some UX research/design to guide the update of the website. Trio’s target audience is millennials, entrepreneurs, and life changers.

Teammates: Tracy Wilbur and Jen Moore

I was the lead researcher for this project.

Methods employed: 

  • Online survey

  • User talk throughs  

  • A/B testing

  • User interviews

  • Usability testing

My Role

The Challenge

  • Reduce overall content

  • Reduce the amount of text

  • Improve IA

  • Use more emotional imagery

  • Increase "white space"

  • Replace some of the text with

    • infographics​

    • other graphics

    • bulleted text

The first step was an online survey to measure the affect of tone, and preference for format that is most appealing. I put together some wire frames for respondents to choose from, but in the end, it was thought that too much explanation may be needed to complete the task.

User Research

Trial and Error-Testing for preferences 

Instead of the wireframes, the images below were used on the online survey. Respondents were asked to select from a list words that the images invoked. The three highest rated descriptors are listed.

Curiosity

Hope

Trust

Annoyance

Boredom

Corporate

Confusion

Traditional

Curiosity

Corporate

Hope

Annoyance

Site Comparison User Talk-throughs

At the same time the online survey was launched, we conducted users talk throughs of the Trio and SoFi websites. 

They were given the parameters of a credit score of 640 and an income of $60,000 and asked to find out if they would qualify for financing under each program.

Trio

  • Too much text

  • Not friendly

  • Intent not clear

  • "Find a Home" not as expected

  • Didn't like videos for info

  • Was easy to find qualification info

SoFi

  • Preferred this look and feel

  • Liked photos of people

  • Liked infographic and less text

  • Wasn't easy to find qualification info

  • Didn't like that they had to sign up to gain info

A/B testing and paper prototypes

A
B

The A/B test was designed to test user preferences and the usability of each of the two versions of IA.

Version A

Navigation is similar to the current site and has an added resource center for additional information.

Version B

The pages were reorganized by phases in the process, and additional information is accessed through a link within each phase

Results of A/B Testing

  • There was a slight preference for a format including a resource center (A)

  • There was a preference for the organization by process steps (B)

  • The "Ready to Apply" button should be further down the page

  • Right side of global navigation is distracting, too dense, unbalanced

  • Confusion about page titles

  • Version B "More Information" was neither noticeable nor favored

Wireframes and Usability Testing

Some the wireframes I created:

Wireframes were created by incorporating initial ideas and insights from user research. After creating them in Sketch we tested them with users.

Findings:

  • Global navigation is too busy

  • Confusion about the location of social media icons 

  • Questions about which page, and position on the page, of the “apply” button- put in apply section and further down the page?

  • “House Hunting” and “find a home” leads one to think that you are going to see home search pages

  • Ideas for where to find trio map/location list

  • Prefer fewer steps in menus

  • Some icons not recognizable, need to add titles if used

  • Newsletter sign up further down the page or in footer

  • Re-think page titles

  • “Upload Documents” button should be on the apply page

Next Round of Usability Testing
  • Users liked the calculator and it's location

  • Liked the pared down navigation

  • Still concerned about position of social icons

  • Need more understandable page titles

Solution

The wireframes created were more open with decreased text. Information was delivered in short, scannable blocks, bulleted lists, and infographics. Photos of people enjoying their homes  would be included to give the website a friendlier and more emotional feel. The information architecture was reorganized for better user flow. As per client request, a resource center was created for users who are ready to dive deeper into the process.

Next Steps
  • My recommendations would be to test more users in each of the tests. 

  • Have respondents relate their income to the local median rather that the national median (Seattle median is about $90,000 whereas the national median is about $58,000).