Responsive Self service website (saas)

 
Responsive Self Service Website (SaaS)

Responsive Self Service Website (SaaS)

My UX role

UX lead and facilitator of an agile and lean UX approach to creating delightful user experiences in the insurance self service space. Led the Farmers product, development and UX team in an iterative UX process where learning is paramount and iteration is second nature. Casting a vision for the product’s end state while breaking down the UX roadmap into small chunks of work that enabled the development team to code iteratively and release value to our customers at a rapid pace.

Trust The PRocess

Assumptive Personas

Led the product managers/owners and developers in a brainstorm exercise where the team sketched out our assumptions about who our current users are and what they are like. Later in the UX process we validated or invalidated our assumptions about our users through in depth 1-on-1 exploratory interviews with users.

Assumptive Personas

Assumptive Personas

Exploratory User Interviews

I led 10 exploratory user interviews with actually users and used the team used the qualitative insights to build Farmers Insurance’s first user persona. Product owners/managers and developers watched the interviews live and took notes on sticky notes. This is a great way to build empathy for users amount digital teams.

Affinity mapping

The team took the notes from the exploratory interviews and grouped them into themes using sticky notes. These themes were used to build the persona for our self service website.

Affinity Map of User Interview Notes Grouped Into Themes (That’s me on the right)

Affinity Map of User Interview Notes Grouped Into Themes (That’s me on the right)

Persona Finalized

The user insight themes from the affinity map groupings above were used to create a user persona that represented Farmers’ self service website users. This helped everyone on the team empathize with our users.

Self Service Website User Persona

Self Service Website User Persona

Rapid usability testing and design iteration

Throughout the UX work, I rapidly usability tested the site and iterated the designs in two week agile sprints. For example, I captured screenshots of the site’s pay bill and autopay flows to begin with the most used features. I built clickable InvisionApp prototypes within a few days to use to usability test these two flows. After each two week testing and UX design sprint, I created a UX research deck of user insights and created proposed mock ups in Sketch. I presented the user insights along with the proposed UX designs to developers and product owners/managers for discussion, feedback and approval.

Collaborative sketching Exercise

During this phase of the process, the development, UX and product teams sketched out new flows using paper and sharpie for the autopay and pay bill flows. I led the team through the sketching exercise to capture the teams best ideas and thinking. Each person presented their sketches and ideas to the team. The team dot voted on UX designs and ideas they liked most from everyones sketches. I used the top voted ideas to inform my UX designs to create the final UX flows.

Team Sketches of the Autopay and Pay Bill Flows

Team Sketches of the Autopay and Pay Bill Flows

User Test updated UX designs and ideas

Next, I took the best ideas that got the most votes and used them to create new UX flows for autopay and pay bill user flows. I built the UX designs in sketch and imported them into InVisionApp.com to create a clickable prototype for usability testing. I conducted 5 usability tests and iterated the designs. I continued the usability testing and design iteration until there were no noticeable usability issues found in user tests.

Autopay Page UX Design

Autopay Page UX Design

Navigation Redesign (Card Sort Research Study)

During usability test, we noticed that users could not find the autopay page and other important pages, sections and features.

  • I conducted a card sort UX research study using Optimal Sort to blue sky how users would categorize content and features of the site.

  • Then I placed the content, pages and features into updated navigation categories and labels that are based on the insights the study.

Screenshots from a Card Sort UX Research Study

Screenshots from a Card Sort UX Research Study

Developer/UX collaboration

  • I included developers throughout the UX process. I used techniques like having them take notes during UX studies, sketching out UX ideas together as a team and design/developer pairing in order to work closely with developers.

  • I created a design system/style guide using Zeplin’s Style Guide feature to use technology to enable our collaboration.

Self Service Design System Using Zeplin’s Style Guide Feature

Self Service Design System Using Zeplin’s Style Guide Feature

Coaching and mentoring

I manage a Senior UX Designer UX work for the Farmers Insurance responsive self-service web app.

  • Successfully on-boarded a Senior UX Designer onto the site by using the following techniques:

    • Design pairing and sketching out ideas together

    • Data transfer in presentation format about our users, insurance and billing specific product and technology knowledge and website strategy and vision.

  • I design pair with him 1 hour per week to transfer knowledge about the website platform, contextual information about our users and business and to learn from each other by co-designing together.

  • I meet with him regularly as well to review UX designs and provide constructive feedback.

Business results

NPS score went up consistently

Our self service website NPS score went up 20 points during my 3 year tenure as UX lead