Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Information Architecture: Core Concepts and Best Practices

853 views

Published on

Core concepts and best practices for information architecture and user experience in the higher education industry.

Published in: Marketing
  • Did u try to use external powers for studying? Like ⇒ www.WritePaper.info ⇐ ? They helped me a lot once.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • ♣♣ 10 Easy Ways to Improve Your Performance in Bed... ★★★ http://ishbv.com/rockhardx/pdf
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Information Architecture: Core Concepts and Best Practices

  1. 1. Information Architecture: Core Concepts and Best Practices Francis Zablocki, Strategist
 mStoner
  2. 2. INFORMATION ARCHITECTURE mStoner CORE CONCEPTS USER EXPERIENCE BEST PRACTICES 
 23 February 2016
 Fran Zablocki
  3. 3. m Fran Zablocki Strategist at mStoner @Zablocki ABOUT ME
  4. 4. mStoner INFORMATION ARCHITECTURE DEFINITION ELEMENTS IA PRACTICE ON CAMPUS
  5. 5. DEFINITION ELEMENTS IA PRACTICE ON CAMPUS CONTEXT USER EXPERIENCE DISCIPLINES
  6. 6. m CONTEXT The structured design of shared information environments. Source: IA for the WWW, 
 Morville & Rosenfeld, 2006 INFORMATION ARCHITECTURE IS:
  7. 7. m CONTEXT The combination of organization, labeling, search, and navigation systems within web sites and intranets. Source: IA for the WWW, 
 Morville & Rosenfeld, 2006 INFORMATION ARCHITECTURE IS:
  8. 8. m CONTEXT The art and science of shaping information products and experiences to support usability and findability. Source: IA for the WWW, 
 Morville & Rosenfeld, 2006 INFORMATION ARCHITECTURE IS:
  9. 9. “The work we do involves high levels of abstraction, ambiguity, and occasionally absurdity, and to some degree we’re all still making it up as we go along.” — Peter Morville & Louis Rosenfeld, Information Architecture for the World Wide Web, 2006
  10. 10. m How do we make sense of all of this?CONTEXT
  11. 11. m Planned Structure Form & Function Designated Pathways But the analogy only gets so far... INFORMATION VS. PHYSICAL ARCHITECTURE CONTEXT
  12. 12. Most buildings aren’t designed to be entered via: • The window • The ceiling • The plumbing But most websites have to be. http://farm5.staticflickr.com/4019/4684666416_1750a85773.jpg
  13. 13. DEFINITION ELEMENTS CONTEXT USER EXPERIENCE DISCIPLINES
  14. 14. m The Elements of User Experience Jesse James Garrett A Visual Model to Make Sense of a Rapidly Evolving Field Because IA is a piece of a much bigger puzzle, we need to understand how all the pieces fit together. USER EXPERIENCE OUR MODEL
  15. 15. Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
  16. 16. Source: http://www.jjg.net/elements/pdf/elements.pdf
  17. 17. Source: http://www.jjg.net/elements/pdf/elements.pdf
  18. 18. m Strategy USER EXPERIENCE
  19. 19. m What do your visitors need to do? Research Compare Apply Donate Contact USER EXPERIENCE STRATEGY: USER NEEDS
  20. 20. m What do your visitors need to know? Why is your school is a good fit for me? Who teaches and learns at your school? How can I apply? When should I apply? What’s the latest news? Where are you located? USER EXPERIENCE STRATEGY: USER NEEDS
  21. 21. m What purpose does this site serve? To sell your institution to prospective students. To encourage alumni engagement. To provide employees with resources. USER EXPERIENCE STRATEGY: SITE OBJECTIVES
  22. 22. m What business objective does the site meet? Increase applications. Increase donations. Decrease time spent on information requests. STRATEGY: SITE OBJECTIVES USER EXPERIENCE
  23. 23. m Scope USER EXPERIENCE
  24. 24. Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
  25. 25. Source: http://www.jjg.net/elements/pdf/elements.pdf
  26. 26. m What features will the site need to include? Search Social Media Video Forms Logins USER EXPERIENCE SCOPE: FUNCTIONAL SPECIFICATIONS
  27. 27. m What content will the site need to include? Notifications Events News Testimonials Reference SCOPE: CONTENT SPECIFICATIONS USER EXPERIENCE
  28. 28. m Structure USER EXPERIENCE
  29. 29. Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
  30. 30. Source: http://www.jjg.net/elements/pdf/elements.pdf
  31. 31. m Information architecture is the structure of content. It is the structure, order, and hierarchy of content labels and categories. STRUCTURE: 
 INFORMATION ARCHITECTURE Source: http://www.jjg.net/elements/pdf/elements.pdf USER EXPERIENCE
  32. 32. m Interaction design is the structure of experience. It’s the hover state, slide out effect and behavior of that structure. STRUCTURE: 
 INTERACTION DESIGN Source: http://www.jjg.net/elements/pdf/elements.pdf USER EXPERIENCE
  33. 33. m Skeleton USER EXPERIENCE
  34. 34. Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
  35. 35. Source: http://www.jjg.net/elements/pdf/elements.pdf
  36. 36. m Decisions: What font will we use for the navigation? How much space (kerning) between the navigation items? How will different navigation elements be placed in relation to one another (alignment)? SKELETON: 
 INFORMATION DESIGN USER EXPERIENCE
  37. 37. m Decisions: Carets or Bullets or Arrows to represent child links? Bold or Underline to represent what page people are on? SKELETON: 
 NAVIGATION DESIGN USER EXPERIENCE
  38. 38. m Decisions: Does the navigation expand on hover or click? Does the navigation slide out sideways, or down? How many levels are shown at once? SKELETON: 
 INTERFACE DESIGN USER EXPERIENCE
  39. 39. m
  40. 40. m Surface USER EXPERIENCE
  41. 41. Source: http://www.jjg.net/elements/pdf/elements_simpleplanes.pdf
  42. 42. Source: http://www.jjg.net/elements/pdf/elements.pdf
  43. 43. m Every layer below contributes to visual design. Each layer is invisible to the visitor - they just see ‘the design’. Even as site creators, we don’t typically think of each of these components in isolation. SURFACE: VISUAL DESIGN USER EXPERIENCE
  44. 44. Visual Design Everything Else
  45. 45. m
  46. 46. mStoner DEFINITION INFORMATION ARCHITECTURE ELEMENTS IA PRACTICE ON CAMPUS
  47. 47. ELEMENTS IA PRACTIVE ON CAMPUS DEFINITION SCHEMES & 
 STRUCTURES TAXONOMY & VOCABULARY
  48. 48. m SCHEMES & STRUCTURES Alphabetical Chronological Procedural EXACT ORGANIZATIONAL SCHEMES
  49. 49. m Topical Tells the visitor what the most important categories of information are. AMBIGUOUS ORGANIZATIONAL SCHEMES SCHEMES & STRUCTURES
  50. 50. m Audience Asks the user ‘Who are you?’, ‘How do you identify yourself?’ AMBIGUOUS ORGANIZATIONAL SCHEMES SCHEMES & STRUCTURES
  51. 51. m Task Designed to allow someone to accomplish something. Uses action verbs in labels. AMBIGUOUS ORGANIZATIONAL SCHEMES SCHEMES & STRUCTURES
  52. 52. m Global Local Hybrid (MegaMenu) DEPTH OF STRUCTURE SCHEMES & STRUCTURES
  53. 53. Global
 Navigation
  54. 54. Local
 Navigation
  55. 55. Hybrid Mega-Menu Navigation
  56. 56. m Contextual Supplementary Convenience Site Map BREADTH OF STRUCTURE SCHEMES & STRUCTURES
  57. 57. Contextual
 Navigation
  58. 58. Supplemental
 Navigation
  59. 59. Convenience Navigation
  60. 60. Site Map
  61. 61. ELEMENTS IA PRACTICE ON CAMPUS DEFINITION SCHEMES & 
 STRUCTURES TAXONOMY & VOCABULARY
  62. 62. m Know Your Audience Be Efficient Anticipate what the user will expect to see TAXONOMY TIPS TAXONOMY & VOCABULARY
  63. 63. The label says research - where does it lead?
  64. 64. m Uniform method of describing things Provides quality and consistency Consistency means predictability ‘About’ or ‘About Us’? ‘Admission’ or ‘Admissions’ CONTROLLED VOCABULARY TAXONOMY & VOCABULARY
  65. 65. mStoner INFORMATION ARCHITECTURE DEFINITION ELEMENTS IA PRACTICE ON CAMPUS
  66. 66. IA PRACTICE
 ON CAMPUS STAFFING EVANGELISM PROFESSIONAL DEVELOPMENT
  67. 67. STAFFING Ideal: Dedicated Information Architect on staff Reality: Key point person for IA Goal: All staff associated with the web need to be versed WHO SHOULD DO IT?
  68. 68. STAFFING You are ALL information architects! WHO SHOULD DO IT?
  69. 69. Demand that IA be taken seriously Use the tools at your disposal Read, watch, listen, learn - there is an entire IA community out there BE A CHAMPION EVANGELISM
  70. 70. PROFESSIONAL DEVELOPMENT Establish IA as a real thing, just like design, development, and content Use case studies from industry Insert IA into your training regimen Build up expertise among staff who work in the UX family (hint: that’s everybody) IA AT YOUR SCHOOL
  71. 71. Information Architecture for the World Wide Web (Book):
 http://amzn.to/3RqL7y Elements of User Experience (Book) http://amzn.to/18Q4fA4 Jesse James Garrett
 http://www.jjg.net Karen McGrane
 http://karenmcgrane.com
 RESOURCES PROFESSIONAL DEVELOPMENT
  72. 72. Adaptive Path 
 adaptivepath.com/events-training Smashing Magazine
 smashingmagazine.com A List Apart’s UX section
 alistapart.com/topics/user- experience mStoner Blog
 mstoner.com/team/fran-zablocki/
 RESOURCES PROFESSIONAL DEVELOPMENT
  73. 73. THANK YOU! QUESTIONS? HELP US HELP YOU WITH IA @MSTONERINC | 773.305.0537 CASSI.GREENLEE@MSTONER.COM mStoner
  74. 74. Strategy. Research. Branding. User Experience. Content Strategy. Digital and Print Design. User Testing. Technical Execution. www.mstoner.com 773.305.0537 cassi.greenlee@mstoner.com @mStonerInc

×