Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How a Web Redesign 
Drives Organizational Chang...

How a Web Redesign 
Drives Organizational Change: A Cautionary Tale

Few people set out to change their organization when they begin redesigning a website, but the process of creating an effective user experience can reveal gaps in an organization's strategy/business processes/etc.

To improve user experience in a sustainable way, while achieving business goals, your job may extend beyond wireframes and content outlines and require you take a seat at the table where business decisions are being made.

Sorel Denholtz

April 28, 2016
Tweet

More Decks by Sorel Denholtz

Other Decks in Business

Transcript

  1. How a Web Redesign
 Drives Organizational Change presented by Toni

    Bird — @tonibird
 Sorel Denholtz — @sorel
  2. A Cautionary Tale In Which They Attempt to Redesign a

    Web Site, 
 and Discover Quagmires of Conflict, Overgrown Timelines, Creeping Scope, and Swamps of Despair
  3. The marketing team wanted to bring their site into the

    21st century. Audience-centric User-friendly Visually appealing Responsive And bound to be award-winning!
  4. 
 2. Make the site audience-centric Organize information for audiences,

    rather than by departments 
 1. Improve look & feel New design with compelling visual elements. 
 Use existing copy to streamline the effort.
  5. “Where is MY section? Why is my content in three

    different places. Why is another group’s content here with mine?!?”
  6. “Where is MY section? Why is my content in three

    different places. Why is another group’s content here with mine?!?” “How will I edit this? Who owns this content???”
  7. “Where is MY section? Why is my content in three

    different places. Why is another group’s content here with mine?!?” “How will I edit this? Who owns this content???” “Why did you do this to us?!?!?”
  8. 
 The marketing team was shocked. Their work had been

    thought through so carefully. Why didn’t people like it? Surely the visual design presentation would go better. The new design was fantastic.
  9. And yet, when they presented, more outcries… There are too

    many pictures! We won’t have enough good ones!
  10. And yet, when they presented, more outcries… There are too

    many pictures! We won’t have enough good ones! Why is there so much copy? Who wrote it? 
 Why is it so long? Why is it so out of date?
  11. And yet, when they presented, more outcries… There are too

    many pictures! We won’t have enough good ones! Why is there so much copy? Who wrote it? 
 Why is it so long? Why is it so out of date? This is unacceptable!!
  12. Again, they were stunned. It was so beautiful. Highly visual,

    like everyone wanted. The parallax scrolling was fresh and new. They had used existing copy — which everyone had been happy with.
  13. In desperation, they reached out to the CMO, the visionary

    who had initially requested a web redesign. The CMO loved the site, and was on board with their execution. Until…
  14. …the CMO spoke to other leaders in the organization, and

    heard the complaints, questions, and concerns.
  15. Three case studies No.1 Managing Expected Change No.2 Navigating Unexpected

    Change No.3 Intentionally Driving Organizational Change
  16. The problems Visual design was out-of-date Disorganized and redundant content

    and navigation Staff were entering the same content multiple times
  17. The problems Visual design was out-of-date Disorganized and redundant content

    and navigation Staff were entering the same content multiple times Alumni were confused by reunion pages
  18. The problems Visual design was out-of-date Disorganized and redundant content

    and navigation Staff were entering the same content multiple times Alumni were confused by reunion pages Mobile website was incomplete and cumbersome
  19. The solutions New visual design and information architecture Leverage Drupal

    content management system (CMS) to author once, display multiple times
  20. The solutions New visual design and information architecture Leverage Drupal

    content management system (CMS) to author once, display multiple times Provide a tool for alumni to easily find their class reunion page
  21. The solutions New visual design and information architecture Leverage Drupal

    content management system (CMS) to author once, display multiple times Provide a tool for alumni to easily find their class reunion page Use responsive templates
  22. These are the organizational changes 
 we expected Authors would

    no longer be able to add pages or extend the navigation at will
  23. These are the organizational changes 
 we expected Marketing would

    need to support authors when new pages were needed. Authors would no longer be able to add pages or extend the navigation at will
  24. These are the organizational changes 
 we expected Class pages

    would no longer be unpublished between reunions Marketing would need to support authors when new pages were needed. Authors would no longer be able to add pages or extend the navigation at will
  25. These are the organizational changes 
 we expected Content would

    be needed to maintain reunion pages at all stages of the cycle Marketing would need to support authors when new pages were needed. Class pages would no longer be unpublished between reunions Authors would no longer be able to add pages or extend the navigation at will
  26. These are the organizational changes 
 we expected Authoring would

    be less redundant but would be require using the Drupal CMS Content would be needed to maintain reunion pages at all stages of the cycle Marketing would need to support authors when new pages were needed. Class pages would no longer be unpublished between reunions Authors would no longer be able to add pages or extend the navigation at will
  27. These are the organizational changes 
 we expected Content would

    be needed to maintain reunion pages at all stages of the cycle The publishing tool was complex. Processes would need documentation. Marketing would need to support authors when new pages were needed. Class pages would no longer be unpublished between reunions Authoring would be less redundant but would be require using the Drupal CMS Authors would no longer be able to add pages or extend the navigation at will
  28. After people reach a stable level of comfort, they are

    more tolerant of change, risk, and uncertainty. @sorel @tonibird
  29. Communicate at all levels Cultivated executive sponsorship: CMO and director

    of alumni relations Partnered with the“do-ers:” director of alumni communications, alumni web manager
  30. Shrink the change Step-by-step approach Divided our project into increments:

    Goals, target audience, content, design One presentation, one topic Built anticipation
  31. Frame the project
 in your stakeholders’ language Built excitement and

    energy about coming improvements: social media integration, and stronger visual impact Described the project using their vocabulary 
 and priorities.
  32. Site authors were able to update easily in real time.

    And now spend less time updating content.
  33. One year later, the site continues to be up-to-date, and

    has remained organized and easily navigable.
  34. A shift occurred: 
 Marketing is seen as a 


    trusted and strategic partner.
  35. The problems Visual design was out-of-date Profiles were difficult to

    scan Content, such as journal articles, was not shared across the site
  36. The problems Visual design was out-of-date Profiles were difficult to

    scan Content, such as journal articles, was not shared across the site Publication management system out-dated and difficult to use
  37. The problems Visual design was out-of-date Profiles were difficult to

    scan Content, such as journal articles, was not shared across the site Publication management system out-dated and difficult to use Faculty were building profiles off-site with no benefit to institution
  38. The solutions Fresh new look: Bigger text, images Improved page

    presentation for high scan-ability Profiles would stay up-to-date as publications, books, courses, etc., were added to Drupal
  39. The solutions Fresh new look: Bigger text, images Improved page

    presentation for high scan-ability Profiles would stay up-to-date as publications, books, courses, etc., were added to Drupal Given the complexity of the profiles in this new system, faculty assistants would be trained as authors
  40. Changing the profiles 
 would need to address several factors

    Faculty care deeply about how they are presented to the academic world
  41. Changing the profiles 
 would need to address several factors

    We presented designs early and often; sought extensive input from faculty administration Faculty care deeply about how they are presented to the academic world
  42. Changing the profiles 
 would need to address several factors

    Faculty vary widely. One size does not fit all
 We presented designs early and often; sought extensive input from faculty administration Faculty care deeply about how they are presented to the academic world
  43. Faculty vary widely. One size does not fit all
 Changing

    the profiles 
 would need to address several factors We analyzed the content of profiles and planned for many variations We presented designs early and often; sought extensive input from faculty administration Faculty care deeply about how they are presented to the academic world
  44. Faculty vary widely. One size does not fit all
 Changing

    the profiles 
 would need to address several factors Faculty are busy and are supported by faculty assistants We analyzed the content of profiles and planned for many variations We presented designs early and often; sought extensive input from faculty administration Faculty care deeply about how they are presented to the academic world
  45. Faculty vary widely. One size does not fit all
 Faculty

    are busy and are supported by faculty assistants Changing the profiles 
 would need to address several factors We analyzed the content of profiles and planned for many variations We designed a system that would be easy for assistants to manage We presented designs early and often; sought extensive input from faculty administration Faculty care deeply about how they are presented to the academic world
  46. The dean insisted that faculty be able to edit profiles

    themselves at launch. Relying on faculty assistants to edit would not work.
  47. This had serious implications Profiles are part of a system.

    Authors must also add publications, working papers, case studies, books, and more.
  48. This had serious implications Profiles are part of a system.

    Authors must also add publications, working papers, case studies, books, and more. Faculty would not be expected to go through training. Site must be self-explanatory.
  49. This had serious implications Profiles are part of a system.

    Authors must also add publications, working papers, case studies, books, and more. Faculty would not be expected to go through training. Site must be self-explanatory. An increase in the number of authors meant increased risk of inconsistency.
  50. Identify influencers Faculty trust their peers and key members of

    the academic administration team Certain faculty would vocally dissent — we could learn from those opinions
  51. Engage influencers directly We partnered with academic administration early Vocal

    and influential faculty participated in usability testing of our authoring prototype
  52. In the first two weeks, 
 125 faculty updated profiles

    and
 1000+ publications were added
  53. We shifted the perception of Marketing. We are seen as

    a trusted partner by the faculty and by their support teams.
  54. The problems Visual design was out-of-date Navigation did not invite

    further exploration Articles appeared nowhere else on site
  55. The problems Visual design was out-of-date Navigation did not invite

    further exploration Articles appeared nowhere else on site Users were unable to distinguish between editorial content and news about the school
  56. The solutions Fresh new look Leverage CMS to dynamically provide

    related articles, and to showcase articles across the site
  57. The solutions Fresh new look Leverage CMS to dynamically provide

    related articles, and to showcase articles across the site Encourage site exploration from stories
  58. The solutions Fresh new look Leverage CMS to dynamically provide

    related articles, and to showcase articles across the site Encourage site exploration from stories Use navigation, functionality, and design to distinguish between editorial and news stories
  59. Editorial The new approach would be 
 audience-centric, designed for

    specific needs Audience is interested in learning and exploring ideas
  60. School news Editorial The new approach would be 
 audience-centric,

    designed for specific needs Audience is interested in learning and exploring ideas Audiences want information about the school
  61. School news Editorial They could no longer be interchangeable Audience

    is interested in learning and exploring ideas Audiences want information about the school
  62. Use navigation, functionality, and design to distinguish types of content

    Story encourages exploration: 
 Has related topics and 
 editor’s picks School news Editorial
  63. Use navigation, functionality, and design to distinguish types of content

    Story encourages exploration: 
 Has related topics and 
 editor’s picks Story encourages follow-up: 
 Has links to programs, media toolkit, other school information School news Editorial
  64. Use navigation, functionality, and design to distinguish types of content

    Context would be editorial: Navigation includes other 
 business topics School news Editorial
  65. Use navigation, functionality, and design to distinguish types of content

    Context would be editorial: Navigation includes other 
 business topics Context would be school- related: Navigation includes information about the school School news Editorial
  66. Use navigation, functionality, and design to distinguish types of content

    Tone is journalistic. Appropriate for syndication in other business media. School news Editorial
  67. Use navigation, functionality, and design to distinguish types of content

    Tone is journalistic. Appropriate for syndication in other business media. Tone is approachable and informative. Invites audiences to explore further. School news Editorial
  68. Use navigation, functionality, and design to distinguish types of content

    Simple link for general media inquiries School news Editorial
  69. Use navigation, functionality, and design to distinguish types of content

    Simple link for general media inquiries Contact info for a specific
 media relations team member School news Editorial
  70. Why did the media relations team want editorial articles to

    stay the same? They didn’t want to lose the media contact name from the articles.
  71. Why did the media relations team feel it was important

    to keep the media contact name on articles?
  72. Why did the media relations team feel it was important

    to keep the media contact name on articles? It was the only way they could connect the press with the media relations team.
  73. Why was it important to use the articles to connect

    the press to the media team? They sent the articles out on BusinessWire as press releases.
  74. Why were they sending them out on BusinessWire as press

    releases? They needed to reach journalists, and it was the only distribution channel they had access to.
  75. Why did they need to distribute the research to reach

    journalists? There was no place on the site for the press to find information specifically for them.
  76. Think beyond 
 the scope of your project They needed

    a dissemination channel for research
  77. Think beyond 
 the scope of your project Social media

    and email could be the primary dissemination channel They needed a dissemination channel for research
  78. Think beyond 
 the scope of your project Social media

    and email could be the primary dissemination channel They needed a place on the site for the press to contact them directly They needed a dissemination channel for research
  79. Think beyond 
 the scope of your project Social media

    and email could be the primary dissemination channel Adding a Newsroom to the site would help media find the information and contacts they wanted They needed a dissemination channel for research They needed a place on the site for the press to contact them directly
  80. The 50:50 Rule 50% 
 of your time: 
 project

    tasks 50% 
 of your time: 
 stakeholders
  81. Bringing stakeholders to excitement Communicate at all organizational levels Use

    every channel Shrink the project Repeat yourself Frame the project in your 
 stakeholders’ language
  82. Inviting stakeholders into the process Identify influencers and engage them

    directly Individualize your approach to address individual needs
  83. Inviting stakeholders into the process Identify influencers and engage them

    directly Individualize your approach to address individual needs Track the big picture and communicate the details
  84. Addressing the root problems Ask “why?” And then ask “why?”

    again Think beyond the scope of your project
  85. 5 major launches later New roles & responsibilities across the

    school Fewer web authors overall; marketing can easily support most departments
  86. 5 major launches later New roles & responsibilities across the

    school Fewer web authors overall; marketing can easily support most departments Site remains consistent, easily navigated, highly usable, content-rich
  87. 5 major launches later New roles & responsibilities across the

    school Fewer web authors overall; marketing can easily support most departments Site remains consistent, easily navigated, highly usable, content-rich Marketing is seen as an effective and valuable partner across the organization
  88. – from The Little Prince by Antoine de Saint-Exupéry “If

    you tame me we’ll need each other.”