Content Out is the UX Strategy

Download Content Out is the UX Strategy

Post on 11-Feb-2017

103 views

Category:

Design

5 download

TRANSCRIPT

What it means to work Content Out

Content Out is a UX Strategy

Aug. 24, 2016Mike Donahue@mdonahue37

Content is not a replacement for place holdersLorem ipsum dolor sit amet, consectetur adipiscing elit. Cras facilisis aliquet vehicula. Maecenas feugiat mattis urna, nec feugiat neque tempus ut. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce non facilisis urna, ac aliquam sem. Vivamus laoreet ligula quis enim ultricies, finibus rutrum arcu aliquet. Nam ac blandit sem. Etiam rutrum gravida nulla ut commodo. Ut congue fermentum nisi porta sollicitudin. Aliquam pellentesque ipsum felis. Sed molestie consequat nibh nec blandit. Sed cursus, leo sed tincidunt lobortis, enim nibh porta lorem, non porta justo dui vitae massa.

Button label

Content is not just text.

Content is not king!

Definitions from my MacAdjectivein a state of peaceful happiness: he seemed more content, less bitter.satisfied with a certain level of achievement, good fortune, etc., and not wishing for more: he had to be content with third place | the duke was content to act as Regent.Noun1 (usu. contents) the things that are held or included in something: he unscrewed the top of the flask and drank the contents | he picked up the correspondence and scanned the contents.[ usu. in sing. ] the amount of a particular constituent occurring in a substance: milk with a low-fat content.(contents or table of contents)a list of the titles of chapters or sections contained in a book or periodical: the contents page.information made available by a website or other electronic medium: online content providers.2 the substance or material dealt with in a speech, literary work, etc., as distinct from its form or style: the outward form and precise content of the messages.

SatisfactionHow it makes people feelStuffWhat it isSubstanceWhat its made of or meanscontentcontentcontentThe 3 Ss of great content

Does the content of your content leave people feeling content?substancestuffsatisfied

Content is core!

Would you spend $8 in bar for an empty glass you cant keep?

Satisfaction comes from the substance of stuff.

Content should inform design, design should not dictate content.

People want content that helps them accomplish their goals.

There is ahugedifference between writing brand copy (text) and writing UX copy. Brand copy supports the image of the company. UX copy gets shit done as directly and simply as possible.

Joel Marshhttp://thehipperelement.com/post/72080847673/daily-ux-crash-course-3-of-31

Creating the right contentBe thoughtfully ruthless to create appropriately precise content.

Case study: Citrix intranet redesign (Backstage)

Employees felt they spent too much time trying to locate relevant content too much stuff to sift throughIt was painful and confusing to locate and open support requestsThey came to get answers so they could get back to work, not be entertained or socializeOld version

Without UX

Or worse.

This is what we want.

Page table - Priority Index

http://www.slideshare.net/donahuephoto/page-table-template

Put 90% of your time into these two box

Emotion-driven goal (page table objective)We want employees to feel confident and efficient finding the right information and support so we will remove noise and downplay distractions so they can return to work as quickly as possible.

There can be only one...Priority 1Get thoughtfully ruthless.

After page tables...and a complete overhaul of the IA, UI, and visual design.

Net results75-90% reduction*in content across sections383% increase in search use224% increase in page views per session34% decrease in average time per session59% decrease in bounceMassive improvement in employee satisfaction

*excluding support section

Creating functional contentGreat content makes it easy for the viewer to find and comprehend what is presented

Expanding our definition of interaction

The hand isnt the only way to interact with content.

Most interactions begin the eyes.

Most interactions begin in the eyes.

Function: Findability through lookingstock image

Content is not the text you get two days before launch to replace the lorem ipsum, thats too long or too short for the space you alloted in your wireframe, that got carried over to your Photoshop mock-up, and then to the coded prototype. Nor is it some irrelevant stock image of a smiling couple with a cute puppy or baby playing at the beach that has no connection the aforementioned last minute text that was selected because some read an article that said images of people lead to higher conversions, but instead draws the eye away from the primary call to action action you want the visitor click on.

Content is not the text you get two days before launch to replace the lorem ipsum, thats too long or too short for the space you alloted in your wireframe, that got carried over to your Photoshop mock-up, and then to the coded prototype. Nor is it some irrelevant stock image of a smiling couple with a cute puppy or baby playing at the beach that has no connection the aforementioned last minute text that was selected because some read an article that said images of people lead to higher conversions, but instead draws the eye away from the primary call to action action you want the visitor click on.

Content is not a replacement for lorem ipsumContent is not a pleasing but irrelevant stock image

Function: Findability through clicking/typing

Function: Findability through clicking/typing

Decision fatiguePogo sticking

Emotion-driven goal (page table objective)We want employees to feel confident and efficient finding the right information and support so we will remove noise and downplay distractions so they can return to work as quickly as possible.

After page tables

Net results46% reductionin support content48% increase in online support tickets21% decrease in misdirected tickets$383K annual cost savings

Test the content like you test the UI?Content optimization yields bigger rewards.

All content is UI.

Case study: Citrix.com redesignTracked NPS score before and after redesignApplied the same design changes to all category and product pagesOnly had resources to rewrite the content within the networking categry and products

Function: Readability which feels easiest?

ABC

Function: Readability what is easiest?

https://readability-score.com/text/

Function: Readability - scoringGrade levelIdeal grade score for average audience is 8Lower grade indicates easier readingIs a good indicator of vocabulary required by readerAvoid unnecessary big words at all costReading easeIdeal reading score for average audience is 45 or higherHigher scores indicate easier readingIs a good indicator of sentence qualityAvoid run (long) on sentences

Function: Readability impact on satisfaction Networking and NetScaler readability scores before and afterBeforeAverage grade: 20Average readability: 12Worst scores: 27/-47AfterAverage grade: 14Average readability: 35 and higher

Function: Readability impact on satisfaction Networking and NetScaler readability scores before and after416%

Function: Understandable

What does that mean? Why did wait until I finished everything to check?What do you mean invalid? Thats my number!How should I know this was required?

Example page: https://www.citrix.com/lp/try/xenapp.html#/createAccount46

Function: UnderstandableAvoid errors with preemptive messagingValidate as you go, avoid unnecessary for visitorProvide hint text especially if you want something thats not the norm

Example page: https://www.citrix.com/lp/try/xenapp.html#/createAccount47

Simple error message templateWhat went wrong?What should have happened?MessageUser entered dashes into the phone field.User should only enter numbers without space or dashesEnter only numbers without spaces or dashes (hyphens). Example: 0000000000User submitted form without filing in required phone field.User must fill in phone field.Phone number is required. Example: 0000000000Employee tried to create a new accountEmployee should just log in with credentials.Employees can sign in with their network credentials to begin. Sign in now.

Example page: https://www.citrix.com/lp/try/xenapp.html#/createAccount48

3 keys to successfully working content outBe thoughtfully ruthless, cut content until its appropriately preciseGet everyone on board, content is everyones responsibilityMake content that helps people get shit done and measure it

Content is not king.Content is CORE!

Keys to working content outBe thoughtfully ruthless, cut content until its appropriately preciseAvoid long blocks of copy, no ones reading every word anywayUse lists, tables, pictures, or graphics when appropriate to make content snack-ableUse plain, simple languageUse contrast to provide contrast to high value keywordsCheck your analytics to identify high value search terms (keywords)Leverage all available forms of interaction, not just touch those done by handsMake sure your content helps people get shit done and measure it.

Content is not the text you get two days before launch to replace the lorem ipsum, thats too long or too short for the space you alloted in your wireframe, that got carried over to your Photoshop mock-up, and then to the coded prototype. Nor is it some irrelevant stock image of a smiling couple with a cute puppy or baby playing at the beach that has no connection the aforementioned last minute text that was selected because some read an article that said images of people lead to higher conversions, but instead draws the eye away from the primary call to action action you want the visitor click on.