The Art and Science of Web Design for ROI Taming the HIPPO, Improving Outcomes Bjorn Thomson, ImageX Media

IMAGEX AND HIGHER EDUCATION

 IMAGEX has delivered web services to colleges and universities throughout Canada and the US  Maintains an extensive presence in the higher-education marketplace  Higher ed team includes over 40 years of university experience  Developed OpenEDU, a Drupal Accelerator supporting the EDU marketplace

“ There are no expert marketers. Only experienced marketers and expert testers. ” – Flint McGlaughlin

CHALLENGE  Visual design is a space where people generally feel confident giving opinions  Those opinions do not always match what is in the best interests of the project  Projects are a significant use of time, money and knowledge and a HIPPO-based model dilutes this effort

6 STEPS FOR IMPROVING OUTCOMES 1.Back decisions with data 2.Incorporate user feedback early and often 3.Balance usability and conversion 4.Develop meaningful KPIs 5.Focus on outcomes, not preferences 6.Separate visual and interaction design

1. Back decisions with data Data-backed decisions are not only better in quality but tend to circumvent stakeholder objections: Reframes the conversation from preference to outcome If, for example, increasing enrolment is the goal, that’s how we should evaluate design effectiveness

From:

1. Back decisions with data Step One: competitive analysis Identify patterns, conventions Provides a baseline and a sense of direction Establishes hypothesis, but must be validated

1. Back decisions with data Step Two: user testing Three relevant dimensions: 1.usability 2.conversion 3.satisfaction

1. Back decisions with data

2. Incorporate user feedback Do this early and often Make this feedback easy to consume (visuals help) Include both stakeholders and end users in ideation Whenever possible, encourage stakeholders to be present during end-user ideation

3. Balance usability and conversion Usability: Establish clear pathways for users Define visual hierarchy Reduce cognitive load Key activities: Competitive analysis User testing (Optimal Workshop)

3. Balance usability and conversion Conversion: Strategic use of page elements Establish page flow Key activities: Heuristic analysis A/B testing

4. Define meaningful KPIs Create meaningful KPIs that: Will resonate with stakeholders Are demonstrably aligned with project goals Are small in overall number Are easy to measure and understand

5. Focus on outcomes, not preferences We can measure conversion and usability with testing – however, there is also an emotional component to design This emotional response can also be measured and quantified Design goals can include brand attributes, user’s desired attributes Ex: exciting, sophisticated, inclusive, bold etc. Microsoft Product Reaction Cards are good for this

6. Separate visual and interaction design Use style tiles Put interaction design on a separate track The visual design should then be much easier to approve

PUTTING IT ALL TOGETHER

Resources The Ultimate Guide to Conversion Centered Design: Treejack: Microsoft Product Reaction Cards: study.php study.php MarketingExperiments YouTube channel:

THE BIG FINISH