never draw a pig in clay (and the ticket taker in the tutu)

Never Draw a Pig in Clay(and the Ticket Taker in the Tutu)

Wayne MacPhail, Web Coordinator, Centennial CollegeOctober 3, 2002

What we’ll be doing

1 hour 30 minute talkLots of questions welcome

Challenge and engage

The Good News

You already know a lot about creating online

content.Why?

Because you live in the real world. I hope.

The Bad News

Online content creation has been dominated by

MBAs, graphic designers, and software engineers -

not writers.

The Problem?

ADD

Attention Deficit Disorder

Attention Deficit DisorderNot enough attention paid to

the:

• past

• world

• user

• words

• structure

• audience

• purpose

• results

• experience

• lessons

And too much attention paid to the wrong things

The State of the (Too Much) Art

Medium and Memento

The Selfish Medium

The Ticket Takerin the Tutu

ADMIT ONE

www.120seconds.com

www.klan123.com

www.twinkies.com

www.cbc.ca

“Years ago Lord Reith, director-generalof the BBC, gave the right reply to

those whowould dumb down Web media today.An interviewer asked: “Will you give

thepeople what they want?” “No,” he

replied,“we shall give them something better.”Martyn Perks - Create Online March,

2002

When MBAs rule the Web

That’s not an org chart, that’s site architecture

www.bayer.com

Computers and the Beauty Myth

The Joy of Complexity

www.slashdot.com

When MBAs Rule Newspapers

Citizens, Audience,Eyeballs and Customers

The Dirty Truth about Online Canadian Content

More good news

www.ofoto.com

www.ofoto.com

iPhoto

What We Can Learn

The Willful Web

Never Draw a Pig in Clay

Never Draw a Pig in Clay

Rabbis, Monks and Blind Guys with Harps

Book Larnin’

Lessons from theReal World

What’s Your Handle?

LessonsFrom Other Media

Tell readers where they areProvide a convenient map of the work (TOC, index)Provide a title pageLet users mark their spot and progressShow users how long the text isBreak the text into standard pieces (chapters)

From Books

Keep visuals interestingMake screen graphics readableTell a story with picturesOnline cannot compete as a rich media experience

From Television

Social relationships do not depend on bandwidthCompletion is a powerful tool for engagementTell a story with picturesKeep dialogue crispTell a human story

From Comics

To think of character as response to conflictFigure out whose story it isProvide tension and releaseBreak story into fractal units (acts/scenes/beats)Give the story a dramatic arc

From Movies

Keep the front page freshTell human storiesTell them what you're going to tell them, tell them, then tell them what you told themKeep writing short, muscular and activeProvide surprise and a sense of discovery

From Newspapers

Story Space

Stories can have a geographyObjects can contain storiesSpace can replace time as the axis of storytellingStories, objects and memory have resonanceIn the absence of forward momentum, story dies

From Hypernarrative

Being Human

Being Human

We often experience only what we expect to experience

We often miss the obvious

We can be absolutely blind to data we don't expect

We are creatures of paradigm

We all respond to human stories

Our short-term memory is fragile, limited and easily taxed

Our long-term memory compresses events and is unreliable

Being Human

We have limited bandwidth, especially when we're busy or focussed

We are easily distracted

We could always use more time

We understand symbols, conventions, narratives and scripts

We often believe other people experience the world the same way we do

Being Human

We easily form social relationships, especially under stress

We need feedback

We tend to blame ourselves for errors when confronted with new technology

We find our own uses for technology

We are fragile, frightened and flawed

The Media Equation

The Media Equation

MEDIA = REAL LIFE

Being Human - Part Two

We are helplessly social especially when stressed

We cannot tell true praise from flattery

Other praise is valued higher than self-praise

Expertise can be easily conferred

We more easily criticize to a third party

We want to be polite and expect politeness

We like people most who are most like us and like people best who become more like us

Know Thy Usersfor They are not You

The Birdfeeder Lessons

User Goal

User Interface

What We Can Do

We can listen welland watch

intelligently

We can learn that no user cares about our code, our

graphics or jargon.

They only care about their task.

And so should we.

Our job is simple.

Get out of our users’ way

so they can achieve their goals.

The user as hero

Listening and Watching Well

Stakeholder inputPaper prototypingUsability testing

Discontent,Content

andMicrocontent

Create Clear Microcontent

HeadSubheadBylineStory Summary

Part OnePart TwoPart Three

The Story Begins

Banish Happy Talk

Hello. Welcome to our new, improved site about gardening in Canada. We’re sure glad to see you and hope this site provides you with the tips, message boards and catalogue guides every Canadian gardener needs! Enjoy your visit and thanks!!!

NewMessage BoardsTipsCatalogues

Be Clear

Clarity of writingstarts with clarity of

thought and intention

Write Tight

Say what you want to say.Cut it in half.Cut it in half again.

Write it.Cut it in half, twice.

Write. Cut. Twice.

Rewrite Exercise

Think of Buttons as Doors

You’re in a strange room full of doors.You’re rushed and searching for something.The only way you know where to go next is toread the signs on the doors.

Imagine that when you’re writing the wordsfor your navigation buttons.

Don’t bury the user in bananas

Give users one task at a time.Make the task clear.

Use the right word(s)

Useful Devices for the DisabledWorkshops to Help You Succeed

Use Standards

There are few Web standards, but here’s one.

The term is look for something on the Web is: Search

Not

FindFind ItFind it NowGoGetLook it upetc.

Designing for Disability

Tag content for meaning, style for presentationUse style sheets, but make pages legible without themDon't rely on colour aloneImages and image maps must have ALT text labels Use concise link namesScripts must have a nonscript alternativesApplets must have alternative textAllow users to freeze moving or blinking textProvide synchronized text transcript for audio, and audioProvide text transcripts for videoGive clear titles to acronyms and abbreviationsFrames are optional and titled and contain documents, not images directlyIf all else fails, link to an alternate page and give alternate contact information

Disability Design Tips

Let UsersParticipate

SearchingTrading

EducationContent Building/Issue Oriented

Scheduled eventsSubscriber-based

E-mail and ListserversSupport

Customer Relations ManagementMultiuser Dimensions or Dungeons (MUDS and MOOs)

3D WorldsWebLogs

ChatSMS

Instant MessagingWalled gardens

Types of Online Community

Planting Marigolds

Summary

Learn from the past and the world.

Don’t get fancy.Write tight. Be clear.Use the right word(s)

Listen.Tell human stories.Stay out of the way.

Be helpful.

Wayne MacPhailwmacphail@centennialcollege.ca

Web CoordinatorCentennial College