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: The Strategic Structure of Great UX - WIAD 2017

1,822 views

Published on

World IA Day Talk 2017, Chicago. This talk begins by illustrating the relationship between strategy, IA, and UX. Then, it outlines the importance of information architecture as a crucial step between strategy and ux - and what to expect if any one of these key steps is overlooked. The presentation concludes with practical, actionable tips on advocating for IA to ensure great UX. 

Published in: Design
  • Hey guys! Who wants to chat with me? More photos with me here 👉 http://www.bit.ly/katekoxx
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Information Architecture: The Strategic Structure of Great UX - WIAD 2017

  1. 1. Information Architecture 02.18.2017 The Strategic Structure of Great UX
  2. 2. Jessica DuVerneay Manager, Strategy One North Interactive Chicago, IL
  3. 3. 3
  4. 4. Explain the relationships between Strategy, IA, & UX. Share My Failures. Help You Avoid Them.
  5. 5. Story Time
  6. 6. 6 Building a Mud Hut
  7. 7. 7 Building a Mud Hut
  8. 8. 8 Building a Mud Hut Day 3
  9. 9. 9 Building a Mud Hut MUDSLIDE!!!
  10. 10. 10
  11. 11. Aspirational Concrete Complete
  12. 12. Story Time Part 2
  13. 13. 13
  14. 14. Strategy IA UX
  15. 15. Definition May Look Like An abstract but clear and concise path forward for digital products or services. Supports business strategy and user needs. Deciding what places to make. The “Why” Stakeholder Alignment Market Research Competitive Analysis User Research Roadmap KPIs & Goals Strategy 15
  16. 16. Definition May Look Like The creation of intentional structures that support the extension of strategy into digital and physical places. Making places made of information that allow meaning making, wayfinding, findability, and understanding. The “What” Taxonomy Sitemap Navigation & Wayfinding Wireframes Content Model Metadata & Labels Information Architecture (IA) 16
  17. 17. Definition May Look Like Delightful interactions and meaningful experiences centered around user needs and expectations – making the places of information be the best that they can be in order to gain product or service traction. The “How” User Flows Personas Interactive Prototypes User Testing Cross Channel Touchpoint Map Interaction Design User Experience (UX) 17
  18. 18. 18
  19. 19. We Had A Digital Strategy & Roadmap 19 Short Term 2017 – Release 1 Establish the Core Replace several aging websites with a consolidated, integrated, mobile-friendly presence. Medium Term 2-3 Years – Release 2+ Extend Connections Further integrate digital marketing tools, create a more connected experience, and track behavior across channels. Long Term 3-5 Years Personalize Experience Offer a personalized, seamless digital experience that replicates the feeling of offline interactions and adds real value to relationships.
  20. 20. We Had A Website Strategy 20 Information Architecture Experience & Visual Design Technology Implementation Plan Content Governance Plan • Journeys achieved through relational data • Improved navigation • Robust Search • Evolved visual direction • Responsive Design • Achieve desired level of accessibility compliance • Implement a combined site architecture with CMS • Migrate appropriate site content • Position content management in a single backend instance • Achieve desired level of accessibility compliance • Execute a comprehensive redirect strategy • Enable tracking of anonymous visitors • Import contacts from CRM to enable tracking of known users • Simplify ecosystem toolset to essential systems • Enable Active Directory login to CMS for content administration • Plan for content ownership and roles • Content workflow diagram • Guidelines, procedures and tools to operationalize content governance • Main site navigation structure and “sub-sites” identified • Sub-navigation for sub- sites determined • Clarified service architecture – clearer paths across industries and practices, and better connections between entities • New topic-based taxonomy for easier content discovery • Header and footer content determined
  21. 21. We Had A Plan for IA 21 • Clarified product architecture – clearer paths across types of offerings , and better connections between these offerings • New taxonomy for easier content discovery • Main site navigation structure and “sub-sites” identified • Sub-navigation for sub-sites determined • Header and footer content determined
  22. 22. And We Needed it… 22 55 global nav product elements 35% use the words “Advising”, “Consulting”, or “Services” 6 mega-products that contain a poly- hierarchical mix of other products
  23. 23. We Had A Process for IA 23 1: Gather Inputs • Review current client engagement with service pages • Discussions with marketing & firm area leaders (as needed) • Competitive comparison 2: Recommendations • Collaborate with internal stakeholders on revisions • Draft clarified service architecture • Illustrate impact to site navigation, content structure 3: Implications • Integrate into navigation and content design • Map existing content to new structure
  24. 24. IA UX & Design Design & Functional Specs FED & Development FED & Development OCT NOV DEC JAN FEB
  25. 25. We *Had* A Process for IA 25 1: Gather Inputs • Review current client engagement with service pages • Discussions with marketing & firm area leaders (as needed) • Competitive comparison 2: Recommendations • Collaborate with internal stakeholders on revisions • Draft clarified service architecture • Illustrate impact to site navigation, content structure 3: Implications • ? Integrate into navigation and content design • ? Map existing content to new structure
  26. 26. 26
  27. 27. 27
  28. 28. 28
  29. 29. IA UX & Design Design & Functional Specs FED & Development FED & Development OCT NOV DEC JAN FEB
  30. 30. Strategy IA UX
  31. 31. Putting it Together
  32. 32. Aspirational Concrete Complete
  33. 33. 33
  34. 34. Aspirational Concrete Complete
  35. 35. 35 Mud hut
  36. 36. Strategy IA UX
  37. 37. 37
  38. 38. 38 ?
  39. 39. Strategy IA UX
  40. 40. Strategy IA UX Aspirational Concrete Complete
  41. 41. Abstract strategy is made concrete through IA; Concrete IA is made complete through UX
  42. 42. Strategy IA UX Aspirational Concrete Complete “We want to build a library” “We need bricks, and we need to stack the bricks intelligently, in the right order” “We have a house, we plaster the walls and make sure the doors are in the right spot” Big Picture Structure Interaction You might say: 42
  43. 43. Strategy IA UX
  44. 44. Strategy IA UX
  45. 45. Strategy IA UX
  46. 46. Strategy IA UX
  47. 47. Now What?
  48. 48. I Messed Up. Learn from failure.
  49. 49. 50 I Should Have: Known the questions can we answer with each phase and how they are interdependent Understood the reasons these phases are descoped and explain what can happen if we descope or skip Provided Concrete Examples of how IA will impact the project Showed how IA can expand beyond the site UX into visual design, build, service, and experience design Taken a time out!
  50. 50. Strategy IA UX What do we want this to do? Why? Who is this for? What are our constraints? What does success look like? How might this differentiate us from our peers? How is this related to other parts of our ecosystem? Based on what we know about our strategy, what pieces do we need? How are they organized? How will this structure meets the needs of the org? Of the people using it? Now that we have the pieces and and a sense of how they work together, how can we make this awesome? Questions We Can Answer 51
  51. 51. “It’s fine the way it is. We don’t have time.” “No budget for that step. It’s too politically loaded." “We can do it better internally. That’s not in scope.” “It’s not important. Just add that in when you make the designs.”
  52. 52. Strategy IA UX Products that don’t address a business need Specific tactics deployed without the intended results Something that will not be valuable or have utility in the near future Wasted budget Products that don’t make sense & are hard to navigate Disorienting user experience, even though design, or UI might seem fine (or even great) Issues with findability & scalability Difficulty creating great UX Complications & increased budget in build Low user adoption & opinion of the system Increased calls to support Poor Conversion Odd or lack of integration with the rest of the information environment If We De-scope or Skimp, Expect: 53
  53. 53. The Numbers 54 7.5 weeks of time burned 4.5x over the cost of initial IA phase 4 team members that had headaches
  54. 54. 55 Advocate & Make Clear the Value of IA Tell Your Stories Know the questions can we answer with Strategy, IA & UX - and how they are interdependent Understand the reasons Strategy, IA, & UX are de- scoped, and explain what can happen if we de-scope Provide Concrete Examples of how IA will impact your project Show how IA can expand beyond the site UX into visual design, build, service, and experience design Take a time out (or go guerilla)
  55. 55. 56 ?
  56. 56. 57
  57. 57. Next Steps
  58. 58. 59 Books Information Architecture - For the Web and Beyond, 4th Edition - Rosenfeld, Morville, Arango How to Make Sense of Any Mess - Covert Understanding Context - Hinton
  59. 59. 60 IA Institute & Mentoring Program WIAD Library of Online Resources Mentoring Program Leadership Opportunities Salary Survey iainstitute.org
  60. 60. 61 2017 IA Summit Vancouver, Canada March 22-26, 2017 IA, UX, & Strategy 3 Days, 3 Tracks Pre-conference workshops iasummit.org
  61. 61. 62 Work (Shameless Plug) One North is Hiring: • UX Strategists • Senior UX Strategists • Senior QA • Developers / FED • Account Coordinator • …More! onenorth.com/careers
  62. 62. THANKS!

×