2. COMM1PCOMM1P This presentation © Gilbert Cockton 2001. For University of Sunderland students only. Permission is required for any other use of this material Have you looked at the resource page ? Link below module handbook Navigation 5

3. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 The Rule of HCI: Reminder 1005 Good Design … … demonstrably fits … … its context of use This lecture describes design options for navigation with indications of contexts where they (don’t) work

4. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 3 Fundamentals: Reminder 1007 Context  Design Evaluation

5. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Why, what, why? 1008 Users must navigate in multi-screen systems Getting from A to B involves moving through structure Users need to get from A to B because of context of use (info. needs, for fun) system makes them (instrumental, exploration)

6. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 The Role of Structure 1010 To distribute across a web-site To relate on a web-page C O N T E N T Information Digital Resources Activities

7. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Content Structures for Information & Digital Resources 1011 Structures are formed from conceptual relations between content items: hierarchy of (sub)categories and members network of related concepts and resources discourse of outlines, elaboration, detail, further information

8. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Site/Page Structure and Navigation Design 1013 Navigation Design uses concrete design features... Page layout, link labels/graphics and positions, site maps, contents, indices, search, breadcrumbs …. to render modified conceptual structures Navigation is concrete, but also may need changes to underlying structure

9. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Why Structures Get Modified 1015 When Shells are used (fixed links, don’t!) For future extensibility/modifiability When items map to page 1:n or n:1 avoid long scrolling on pages To get the right breadth/depth trade-off Business goals must guide trade-offs On balance, breadth preferable to depth Business model may require access denial

10. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Depth versus Breadth 1017 Deep Many levels, few links per page Long path lengths Fewer distractions Support for progressive disclosure Broad Few levels, several+ links per page Short path lengths Long lists to read/here Obstructs link elimination

11. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 From Structure to Navigation 1 1019 Decide on a compromise conceptual structure information structures activity structures - optimise task paths Refine to a feasible/acceptable structure screen estate limitations may require changes so may accessibility –short menus for screen readers

12. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 From Structure to Navigation 2 1021 Design the navigation paths through the information structure which paths to support (extra cross-links?) information and task needs decide Decide on navigation aids contents, indices, site maps, FAQs history and search mechanisms passive/interactive guided tours (demos/agents)

13. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Navigation Topics 1023 Links Location Structure Visualisation Search Agents

14. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Links 1024 Wording Expected user knowledge and links Link symmetry provide route back, especially from sub-sites to site home page Link order Link groups Off-site links

15. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Get me a return to Boston? 1026 Flight Paging 3 Best Itineraries Flights and Prices Timetables Fares

16. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guideline 1 Do not assume users’ have the domain Avoid Domain specific terms in links Use the Users’ language Remember Heuristic “Speak the users’ language –Stakeholder attribute

17. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Where is the Local Chamber of Commerce? 1028 Beyond the Magazine –Inc Real Time, Zinc, Online Entrepreneur, Between the Pages Virtual Consultant –worksheets, databases, reference desk, software, bulletin boards, links, your web-site Inc. Magazine –archives, Inc. Online, subscriptions, Inc. 500 Inc. Business Resources –products, conferences, consulting services, awards, expos

18. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1031 Link Wording 1031 Crucial - “Be Our Guest”, Travelocity Suggestiveness and discriminability –C|Net: Product Finder, BUYDIRECT.COM, SOFTWARE.COM Provide labels for graphics (or pop-ups) Supports prediction Fidelity Questions (Evaluation) Supports elimination: Global vs. International Select the WebSaver Annuity that’s right for you Is the WebSaver Annuity right for me?

19. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guideline 2 Links should adequately describe content Avoid ambiguous terms in links Maximise Information Scent

20. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1034 Users and Categories 1034 Football, Rugby Ball, Orange, Lemon Two ways to split into pairs?

21. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1036 Links: Expected user knowledge 1 1036 Users don’t build models of sites confusion with off-site links and within page-links considerable use of home page as safe point Anticipate category misunderstandings Edmunds Auto site, cross-link from cars to SUV and pick up area Amplifier text below (Disneyland, Disneyworld) Don’t expect users to use back button 1-2 hits at most

22. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guideline 3 Links should be “self describing” Within Page Within Site Off site links should be clear

23. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Anticipate Category Misunderstandings Effective use of cross-links Guideline 4

24. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 I want to buy some headphones….. Options –Home Audio –Home Video –Portable Audio Search Engine Because the cost of choosing one over the other was too much 1036 Links: Users Perceptions 1036

25. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1039 Link Orderings 1039 alphabetical, frequency, importance, safety context of use decides Grouping and spacing basis for (local) table of contents

26. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1042 Link Groups 1042 Links best kept separate Embedded links get missed Separate lines OK Avoid wrapping links over lines –or use bullets Navigation bars & common shopping buttons standard links, especially home better at top and bottom

27. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Avoid Embedded Links ‘Avoid’ does not mean Never Avoid Wrapping Links Create and follow site navigation standards Guideline 5

28. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1045 Break 1045 Back by 0955 Monday Tutorials Print Slides for Tutorial Group alarms by 19/10/01

29. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1100 Location 1100 You are Here (Breadcrumbs) Users often don’t understand or see them Unless they are interactive Visual coding for level/area of site Destination must confirm/exclude Bookmarks Problems with frames Some users bookmark within site

30. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guidelines?

31. COMM1P5COMM1P5 1103 Structure Visualisation 1103 Table of Contents Hierarchy of Links Side panel or separate page Site Map Graphic of nodes and links, best labelled and explained (integrating metaphors possible) –Doubled success of Fidelity test users (UIE) When used as header, must show where users are

32. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guidelines?

33. COMM1P5COMM1P5 1106 Search Mechanisms 1106 Are contents/site maps enough Will Indices be enough? Can FAQs do better than search? Search Engines users may expect them essential on large sites

34. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1108 FAQs 1108 Frequently asked questions Can be more effective than search engines Avoid adaptive FAQs Disney

35. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1112 The Search Activity 1112 Three Phases Specify search terms Interpret results Select a result Need to support all phases

36. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 Guideline 6 If a search facility is provided Does it provide adequate support?

37. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1114 Search Issues 1 1114 Need to provide index terms value of prior content analysis Users must use search terms boolean logic rarely suitable Show scope of within site searches make restricted scopes clear from the outset guide users to alternative searches use sensible parameters (Fidelity)

38. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1117 Search Issues 2 1117 Need to support use of results discard, browse, refine Relevance order is often not clear Repeated results confuse Garbage hits frustrate exclude some pages from search e.g., adverts

39. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1120 Agents 1120 Travel Metaphor (Allison & Hammond) key sites and highlights, fixed routes Agents (Brenda Laurel) lead and interact (salience?) personas/stereotypes (humans?) Intelligent agents monitor, model, infer (ethics?) How do you know they’ll work?

40. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1123 Evaluating Navigation 1123 Test before full page design! Scenarios Draw up a user task Add contextual details Describe the experience with the site Walkthroughs Step by step analysis of task description Can pick up need for cross-links

41. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1126 Cognitive Walkthrough 1126 Inspection Method (Analytical, Formative) 4 questions for each task step (Greg Abowd’s GIT) Will the users be trying to produce whatever effect the action has? [Right Goal?] Will users be able to notice that the correct action is available? Once users find the correct action, will they know that it is the right one for their goal? After the action is taken, will users understand feedback? Success/failure case according to answers

42. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1129 Content 1: Reminder 1129 Human-Computer Interaction for the Web Context Research Usability Evaluation Information Activity Architecture èNavigation Options, Page Layout, Interaction & Media

43. COMM1P5COMM1P5 SCET MSc EC/ECA © Gilbert Cockton 2001 1130 Summary 1130 Navigation Amends conceptual structures Renders structures Augments structures Visualises structures Hides structures Learn options, understand what works when