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

Information Architecture

02.18.2017

The Strategic Structure of Great UX

Jessica DuVerneay

Manager, Strategy

One North Interactive

Chicago, IL

3

Explain the relationships between Strategy, IA, & UX.

Share My Failures.

Help You Avoid Them.

Story Time

6

Building a Mud Hut

7

Building a Mud Hut

8

Building a Mud Hut

Day 3

9

Building a Mud Hut

MUDSLIDE!!!

10

Aspirational Concrete Complete

Story Time Part 2

13

Strategy IA UX

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

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

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

We Had A Digital Strategy & Roadmap

19

Short Term2017 – Release 1

Establish the CoreReplace several aging websites with a consolidated, integrated, mobile-friendly presence.

Medium Term2-3 Years – Release 2+

Extend ConnectionsFurther integrate digital marketing tools, create a more connected experience, and track behavior across channels.

Long Term3-5 Years

Personalize ExperienceOffer a personalized, seamless digital experience that replicates the feeling of offline interactions and adds real value to relationships.

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

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

And We Needed it…

22

55global nav

product elements

35%use the words

“Advising”, “Consulting”, or

“Services”

6mega-products that

contain a poly-hierarchical mix of

other products

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

IA UX & Design

Design & Functional

Specs

FED & Development

FED & Development

OCT NOV DEC JAN FEB

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

27

28

IA UX & Design

Design & Functional

Specs

FED & Development

FED & Development

OCT NOV DEC JAN FEB

Strategy IA UX

Putting it Together

Aspirational Concrete Complete

33

Aspirational Concrete Complete

35

Mud hut

Strategy IA UX

37

38

?

Strategy IA UX

Strategy IA UX

Aspirational Concrete Complete

Abstract strategy is made concrete through IA;

Concrete IA is made complete through UX

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

Strategy IA UX

Strategy IA UX

Strategy IA UX

Strategy IA UX

Now What?

I Messed Up.

Learn from failure.

50

I Should Have:

Known the questions can we answer with each phase and how they are interdependent

Understood the reasons these phases are descopedand 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!

Strategy IA UXWhat 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

“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.”

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

The Numbers

54

7.5 weeks of time

burned

4.5xover the cost of initial IA phase

4team members that

had headaches

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)

56

?

57

Next Steps

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

60

IA Institute & Mentoring Program

WIAD

Library of Online Resources

Mentoring Program

Leadership Opportunities

Salary Survey

iainstitute.org

61

2017 IA Summit

Vancouver, Canada

March 22-26, 2017

IA, UX, & Strategy

3 Days, 3 Tracks

Pre-conference workshops

iasummit.org

62

Work (Shameless Plug)

One North is Hiring: • UX Strategists• Senior UX Strategists• Senior QA• Developers / FED• Account Coordinator• …More!

onenorth.com/careers

THANKS!