Designing for the User Experience Darlene Fichter Data Library Coordinator University of...

download Designing for the User Experience Darlene Fichter Data Library Coordinator University of Saskatchewan Library Computers In Libraries

of 63

  • date post

  • Category


  • view

  • download


Embed Size (px)

Transcript of Designing for the User Experience Darlene Fichter Data Library Coordinator University of...

  • Designing for the User Experience

    Darlene Fichter Data Library Coordinator University of Saskatchewan

    Computers In Libraries 2004Intranet Professionals Academy

  • OutlineUser experienceWeb designUsability testing

  • User experienceDefined as how a product behaves and is used in the real worldEverything the user experiences should be the result of a conscious decision on your partThink about possible actions and user expectationsJesse James Garrett. The Elements of User Experience: User-Centered Design for the Web

  • Totality of the intranetJesse points out that the user experiences the "totality of the intranet" - not one piece separate from another. We rise and fall together.

    InterfaceVisibleInvisibleContent, Architecture and Tools

  • LayersStrategy user needs, objectivesScope functional requirements, contentSkeleton interface, interaction, and information design Surface visual designStructure IA, interaction designJesse James Garrett

  • Where does user experience start?Its all about your intranet audience

  • Primary characteristics of an intranet audienceEmployees are focused on getting the job doneTypically expert usersDont want fluffDiverse ExperienceUsage patternsNature of their work EngineersFinancial analystsMarketersCustomer support

  • Novice / occasional usersIntimidated by complex menusLike unambiguous structureApples or Oranges, not both!Easy access to overviews that illustrate how information is arrangedMapsFAQsGlossary of technical terms, acronyms, abbreviationsVisual layouts & graphics that trigger their memoryTendency is to design for this type of user

    Adapted from Patrick Lynch and Sarah Horton, Web Style Guide. Yale University Press, 1999.

  • Expert/frequent usersDepend on speed and accuracyImpatient with low-density graphics that offer only a few choicesPrefer stripped down, fast loading text menusHave specific goalsAppreciate detailed text menus, site structure outlines, comprehensive site indexes, well designed search enginesWant accelerators ways to bypass the fluff

    Adapted from Patrick Lynch and Sarah Horton, Web Style Guide. Yale University Press, 1999.The majority of intranet users fall into this category, eventually

  • What do intranet users want?Research study by Head & Staley Looked at 6 research intranetsSynopsys in Mountain View, Calif.Fireman's Fund Insurance CompanyGale GroupBechtelChevronGilead SciencesSun Microsystems

    Started with survey to identify what information intranet users wantAlison Head and Shannon Staley. On-the-Job Research: How Usable Are Corporate Intranets? Special Libraries Assoc. 2002

  • Top 10 things employees need to know

  • Top 10 things (cont)

  • Design Touch PointsGoing from general to specific

    Create profiles of key user groupsManagers, market analysts, other groupsWho are your major publishers Who are your top users?Identify the personality traits of user typesAnalyze the tasks that they will perform

    Distributed non-profit Intranet priorities very different from research Intranets

  • How well do intranets do? Our research studies in a wide variety of corporations show very low satisfaction among users of corporate intranets. It's important that corporate intranet teams start focusing on the information content that end-users consider mission-critical.

    Anthea Stratigos, Outsell's CEO

  • Can employees find what they want on intranets?10 tasksOverall 44% success rate

    Head & Staley

  • Determining visitor needsFocus groupsUser surveys ObservationUsage reportsQuestionsWeb log analysisSearch log analysis Formal assessment

  • Keeping the user front and centerPersonasUsability testingConsult oftenInvite comments and feedback

  • Visual design scratching the surface Builds upon the other layersConcerned with look and feelVisual elementsColorTypographyLayoutImagesMenus

  • Text heads or next heads?

  • Design goalSupport the sites message Be appropriateHave unity and varietyAid the sites functionalityTransparent to the user

    Good design is clear thinking made visible; Bad design is stupidity made visible. Edward Tufte

  • The messageWhat colors are associated with your organization and the material for your intranet? Are the colors vivid, pastel, primary, saturated, cool, trendy, classicWhat culture are you trying to create?Formal, informal, engaging, playfulWhat images do you associate with the organizations, services or product?

  • Porfolio

  • Porfolio

  • Porfolio

  • JPL Portal: Screen Shot of Inside JPL from Jayne Dutras presentation

  • My departmental Intranet

  • Porfolio

  • Unity and variety Consistency of visual designFonts, colors, layout, stylesBrandingNeed both consistency and some variety to liven it up

  • Support functionUse color and layout organize information and facilitate groups and zonesUse it judiciously give prominence to important elements and draw the eye

  • Visual design pitfallsInconsistencySet standardsGratuitous use of design for design sake refusing to prioritizeWell balanced teamDense textRead the research, learn what worksSite wide vs. page level95% of the effort on the top page

  • Site level vs. page Level Traditional design Greatest emphasis is on site wide issuesNavigationContentVisual identityFor intranets, both mattersMicro-content cannot be neglectedNeed to be concerned about information design not just graphic design

  • How users read on screensHow do people read on the screen?Top to bottomLeft to rightFocus first on the micro-content Scroll to the bottomOnly after failing - side menu- top menu

  • Reading

    25% slower on the screen compared to equivalent on paper

  • Research shows people dont readPeople who are looking for information don't read, they scan. Most people will not read instructions or help pagesEven when this would benefit themLess is moreUnderstanding is higher with fewer words are used

  • ScanabilityCreate page titles, headings and subheadingsBe consistent in designing titles/headingsUse font and/or color to offset headingsBe careful with emphasisBold or size, but not bothEyes are tuned to small differencesNo need to SHOUT at usersUse bulleted lists and linksBullets when sequence doesnt matterNumbers when it doesUse lists when you have key concepts, not full sentences

  • Scanability tipsLists speed up scanningbut slow down readingDesign for scentBe concise & pithyUse a much smaller word count than conventional writingWrite in pyramid styleUse parallel constructionAvoid jargon

  • Scanning mistakes and how to avoid themClassic mistakes with linksOverused everything is a linkUse long, descriptive links and headingsEnables users to eliminate items more easilyUIEs research shows that links with 4 to 9 words are more effective then short links

  • Design trendsPortals and portletsManage syndicated, chunked contentBuckets or zonesTypography as designCSS based templates Fluid rather than fixed

  • Example

  • Keep in mindGorilla in an Armani suit is still a gorilla

    The Inmates are Running the Asylum. Alan Cooper

  • What really works?

    The font is too small. The font is too big.The search box is confusing.The red is too red. Place controls above the box.

  • Need ways to measureWhat worksUsability testingLog analysisFeedback forms

    During web design and development stages, usability testing helps provide feedback on design ideas.

  • What is usability?Ease of useEase of learningFitness for purpose

    An effective productDefinition from Dorothy Kushner

  • Types of usability testingHeuristic evaluationCognitive walkthroughsPreference testingTask Based testingField studies

  • Cognitive walkthroughPerformed by development teamCollective walkthrough of siteAssessment of whether the user has the information to confidently make the next right action

  • AssessingHow easy is the system to learn?Can it be learned by exploration?Is site elements support the user achieving their goal? Which dont?

  • Whats requiredDetailed description of the systemPrototypeLocation of items on the screen and wording should be filled inRepresentative tasksComplete list of steps that need to be taken to complete the taskIndication of the user type and experiencePersonas (user scenarios, user cases)

  • Document the problemsA recorder should note problems on the detailed task sheet:By step in the taskGive a description of the problemNote the severity

  • Task based testingSample of real usersPerform specific tasks on the siteEvaluators watchrecord observations

  • Guerilla task based testingIdea popularized by Jakob NielsenShowed that simple low tech testing of five to seven users could yield excellent resultsNot everyone agrees with this though5-7 users will typically uncover 80% of site-level usability problems

  • Preparing for task based testingWhat do you want to know?Decide who to testDesign your tasks

  • Example tasksFind the phone number of the head of Human Resources.

    Submit your travel expense claim.

    Update the staff directory to include a new department head in sales.