Medigap

August 06, 2018

Goals

  • Create a new flow with UX/UI best practices based on:
    • Get user to complete the quiz most of the time.
    • Get user to click one of the final results links most of the time.
  • Create mockup, using colors/ styles inline per the client's preference and according to UX/UI best practices
  • Code the mockup, install

Summary

The client had an existing medical quiz that had a less than satisfactory success rate in terms of % of visitors that finish the quiz and % who click on one of the affiliate links at the end of the quiz.  The client wanted to create a new quiz with better UX/UI to get a higher success rate in terms of stickiness and clicking on the end result.

Additionally, this was a team project I did with Tyler - I did the frontend UX/UI, wireframing, mockups, HTML5, CSS3, Bootstrap4, and he did the backend programming, including integrating with APIs and making the quiz work.

Process

  1. Reviewed old quiz, diagnosed where they went wrong in terms of UX/UI.
  2. Reviewed the client's competitor's quizzes, diagnose where they went right and where they went wrong in terms of UX/UI.
  3. Created new flow with UX/UI best practices.
  4. Created wireframe -> created mockup based on flow following UX/UI best practices.
  5. Revisions to mockup as necessary.
  6. Coded the final approved mockup.

Results

  • http://medigapquiz.com/
  • Client stated that this quiz was very sticky, with little to no drop-off once a user starts the quiz.

In the client's own words...

review

Details

More information coming soon..