Usability bootcamp 3 18-13 high edweb ne-final

459 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
459
On SlideShare
0
From Embeds
0
Number of Embeds
38
Actions
Shares
0
Downloads
3
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Shared this heatmap (visualization of where visitors are clicking) – brighter areas are most popular.Visitors were on task and were looking for info on:Tuition & financial aidAcademicsApplyingVery little interaction with all this content that they were putting resources against
  • Green light!
  • Green light!
  • Before we go any further, the best way to understand the NEW way of site development is to understand the OLD way – the linear waterfall approach
  • In user-centered dev, the design phase is a cyclical process whereby you’re using insights & analysis to inform the design and then testing the design BEFORE handing off to development.more cycles to the design phase …..don’t assume this means more work. Save time on the back end from fixes
  • Paper prototyping – no dev yet
  • In user-centered dev, the design phase is a cyclical process whereby you’re using insights & analysis to inform the design and then testing the design BEFORE handing off to development.more cycles to the design phase …..don’t assume this means more work. Save time on the back end from fixes
  • Typical use: reactions to brand positioning or new product/service
  • Not Zoomerang or Survey Monkey but on-site surveys to your visitorsExplain these are surveys that are served up on your site – just drop few lines of javascript code
  • Assume .5 – 1% of site visitors will complete survey
  • Musts:Real person: create empathy – you’re designing for real people!Compelling narrative: “day in the life”Call out key attributes: High level goals should be explicit (ie, print out app deadlines)Enable design decisions: Help design teams decide what features & functionality are criticalScenarios: the list of steps the persona will go thru to reach the goal
  • Scenario is the list of steps the persona will go thru to reach the goal
  • CrazyEgg supports heatmaps, scrollmap, confetti and other visualization toolsConfettishows you exactly where people clicked and is color-coded by referring site
  • Key pages:
  • All of those insights were compiled in a creative brief for the designer (who was also very vested & involved in process)
  • Introduce myself
  • Usability bootcamp 3 18-13 high edweb ne-final

    1. 1. Usability Bootcamp How we transformed Admission sites by adopting user-centered designVal FoxBentley UniversityOffice of Digital EngagementHighEdWeb New EnglandMarch 18, 2013
    2. 2. Business school in Waltham, MA• 4,000+ undergraduate students; 1,400 graduate students• 20 undergraduate majors; 10 masters programsDigital Engagement Office• 7-person team• Supports ~80 sites
    3. 3. “It doesn’t matter what Ithink about your website”
    4. 4. Our Users Design for me I need to findI don’t care aboutyour org structure NOT you! info quickly Don’t talk to me in If you don’t language I don’t make this easy, understand I’ll leave Photo source: webcoursesbangkok.com
    5. 5. Making a case for users beginswith NOT talking about users.
    6. 6. AdmissionsDid NOT want to talk aboutusers or a new website.
    7. 7. AdmissionsDid NOT want to talk about users or a newwebsite. We love our site! Don’t make us change our web process. We don’t have time to focus on this project.
    8. 8. AdmissionsSo we offered them what they DO want:• Increased lead pool• More applicants• Increased yield rates
    9. 9. Wake Up Call20% of prospective students saidthey would remove a school fromconsideration because of a poorweb experience Source: Noel Levitz 2011 E-Expectations Report
    10. 10. Wake Up Call
    11. 11. Wake Up Call
    12. 12. Wake Up CallMobile traffic was doubling every8-10 months Source: Google Analytics
    13. 13. Admissions We need a mobile site by Fall!We can learn Drupal 7 This is one of our top priorities
    14. 14. AdmissionsDesign a new site!
    15. 15. Traditional DevelopmentRequirements Design Development QA Launch
    16. 16. User-Centered DevelopmentRequirements Analysis Design Development Prototype QA Test Launch
    17. 17. But won’t all this take longer?! 100x more expensive to make a change post-release (for traditional software) Nielson Norman Group
    18. 18. User-Centered Development CycleRequirements Focus Groups Online Surveys Analysis Personas Analytics Design Development Prototype QA Test Launch
    19. 19. Focus Groups Photo source: cartoonstock.com
    20. 20. Focus GroupsBest for: Sourcing qualitative feedback Who: • Prospective undergraduate students • Parents (undergraduate) • Prospective graduate studentsSource: • Undergraduate Tours • Graduate Open House Goal: Gain an understanding of • Priority content • College research process • General web usage • Influencers Photo source: tamarabustos.com
    21. 21. Focus GroupsSet up: 1 hr sessions at our research lab Groups of 5-6 students/parents Paid $50 each + pizza Facilitator and note taker Cost: $2,500 Time: 4 weeks Center for Marketing Technology Bentley UniversityOutput: Summary of findings > shared w/team Bring personas to life: “Don’t tweet me after I apply, that’s just weird!” “My mom loves helping me with the research process, it’s her way of ‘bonding’ with me.”
    22. 22. Online Surveys
    23. 23. Online SurveysBest for: Quantitative feedback • Purpose of site visit • Able to complete purpose of visit • Why (or why not) Who: 500+ site visitors to our Admissions sites
    24. 24. Online Surveys Tool: iPerceptions “Plus” account • Data export • Unlimited data collection • Device-specific • Adjustable invitation rate • Multi-language Cost: $20/moApproach: 4 standard + optional questions
    25. 25. Online Surveys Standard Rate your overall site experience (1-10)Questions: Primary purpose of visit (multi-choice) Were you able to complete purpose of your visit (yes/no) • If yes > what did you value most • If no > why not How likely are you to recommend Optional Visit frequencyQuestions: Source (how you arrived at site) Demographics
    26. 26. Online Surveys Output: Summary shared via PPT doc Key Qualified visitors are mostLearnings: demanding Content = meat + potatoes “Information too vague” “Couldn’t find average SAT scores” “I want detailed information on the grad program curriculum” Photo source: chefmom.sheknows.com
    27. 27. Personas Source: Forrester Research Agency: Primacy
    28. 28. PersonasDefined as: Hypothetical user developed through interviews & observations of real users Use for: Create a common understanding of target audience Must: • Sound like a real person • Include compelling narrative • Call out key attributes & high level goals • Enable design decisions • Include scenarios
    29. 29. Personas Infographics convey Kelly’s device usage & tech proficiency Photos of Kelly’s items give a feeling for her lifestyle Source: Forrester Research Agency: Primacy
    30. 30. Personas Lend to Scenarios Persona Prospective graduate student Goal: Find a part-time MBA program in Boston areaScenario: • Searches for “Boston MBA programs” • Reaches Bentley.edu > Academics > Graduate Programs • Sees MBA programs but labels aren’t clear • Visits each program page to learn more but gets frustrated with time spent
    31. 31. Analytics
    32. 32. AnalyticsTools Google Analytics: Free CrazyEgg: $228/year for “standard” accountBest Revealing behavior – NOT for: intent Google Analytics: comprehensive site analytics CrazyEgg: ad-hoc reporting for specific pages
    33. 33. Google AnalyticsPre-launch: Tracking out-of-the-box stats: • Site visits & visitors • Pageviews • Pages/visit • Bounce rate • Top pages • Traffic by source Results: No actionable insights No ownership
    34. 34. Google AnalyticsPost-launch: Set up Admission profiles w/dashboards Tracking KPIs via automated reports • Conversion rates by form • Conversion rates by source • Cost per visit (search keywords) Results Weekly review w/stakeholders Ownership & accountability
    35. 35. Analytics Insights for Admissions Output: Key user insights: Google Analytics • High priority content • Top paths to content • Content gaps (top search terms) CrazyEgg • Overall site experience • Task success/failure & rationale
    36. 36. User-Centered Development CycleRequirements Focus Groups Online Surveys Design team Analysis Stakeholders Personas Analytics Design Development Prototype QA Test Launch
    37. 37. User-Centered Development CycleRequirements Analysis Design Development Prototype QA Test Launch
    38. 38. User Testing
    39. 39. Usability TestingBest for: Finding specific problems (prototype or live site) Who: 8-10 students for each Admission site Set-up: Facilitator + note-taker Camtasia Studio (screen capture) Cost: $99/license – Camtasia $15 gift card - tester
    40. 40. Usability Testing Tasks Site navigation (find a major or program) Tested: Sign up for a tour Find application deadlines Find link to apply Find info for accepted students Output: Summary of findings Design modifications before handoff to devTotal cost: $400
    41. 41. Launch of BOTH sites Nov-Dec 2012bentley.edu/undergraduatebentley.edu/graduate
    42. 42. Results Results: Year-over-year online leads Undergrad: 6% increase Grad: 11% increase Year-over-year mobile traffic: 2.4x higher Year-over-year mobile traffic Bounce rate: Dropped by 10% to 42% Pages/visit: Slight increaseTotal cost: $2,800
    43. 43. Stay in touch• Twitter:@ValerieFox• www.slideshare.net/FoxAtBentley• www.bentley.edu/DE

    ×