Designing Narrative: Contrast, Timing, and Context

Designing Narrative Contrast, timing, and context Presented at Sears, February 10, 2010 Michael Leis http://blog.michaelleis.com

Aristotle ‣Poetics ‣The art of imitating life ‣Linear Narrative ‣Beginning, middle, end ‣350 BCE Michael Leis http://blog.michaelleis.com

Classic 3-Act Narrative Visible Story Beginning Middle End Complete Narrative Linear timeline Michael Leis http://blog.michaelleis.com

Classic Campaigns These videos, as well as the navigation above it are both examples of classic beginning-middle-end narrative convention. Beginning Middle End Michael Leis http://blog.michaelleis.com

Circular Narrative What makes circular narrative different, in this broad stroke, is that the visible storyline is detached from the linear timeline which it refers to. story Beginning Middle End Complete Narrative Linear timeline Story takes place after main timeline Michael Leis http://blog.michaelleis.com

What is the result of well- executed circular narrative? Michael Leis http://blog.michaelleis.com

Arguably the greatest movie of all time Michael Leis http://blog.michaelleis.com

Citizen Kane Structure ‣ We try to solve the mystery of Kane’s last word, “Rosebud” by learning about his life through the ﬁlter of those who were closest to him. Michael Leis http://blog.michaelleis.com

Rosebud Michael Leis http://blog.michaelleis.com

Mapping the Story Viewer ‣And if we were to create a Wal ter Thatc her Kane’s conceptual model of this Life interaction, it would look like J e didia h M r B er ns tein this: Lel and Rosebud M r. Thomp s on Sus a n Al e x a nde r S er vant Michael Leis http://blog.michaelleis.com

This is Social Media Community User Experience Public Internet ‣When Will Evans Brand visualized brand- Branded Public Content centered social Brand Brand media, it was clear Community this is the same model as circular narrative Lifes t yl e/ Brand Find out more about Will at Editor ial blog.semanticfoundry.com Brand Michael Leis http://blog.michaelleis.com

Circular Narrative is Interactive Narrative Linear to the viewer, circular to the creator Michael Leis http://blog.michaelleis.com

Circular Discourse Societal norms TV projects an abstraction or comment on societal norms Michael Leis http://blog.michaelleis.com

Circular Discourse Societal norms Viewers compare My norms? programming with their own opinions, values Michael Leis http://blog.michaelleis.com

Circular Discourse Societal norms The perceived differences, My norms? similarities are then presented to the peer group for mediation, Dinner table Facebook consensus Watercooler Train Check peers School Michael Leis http://blog.michaelleis.com

Circular Discourse Societal norms This process My norms? can take minutes, hours, days depending on Dinner table the peer group Facebook Watercooler Train School Check peers Phone/TXT Michael Leis http://blog.michaelleis.com

Circular Discourse Opportunity Societal norms to represent (now also social peers My norms? proof, mediation) instantanously on TV via mobile (now also social object) Check peers Michael Leis http://blog.michaelleis.com

Claus Facebook Page Michael Leis http://blog.michaelleis.com

Claus Facebook Page User Experience Viewer MP3s Claus Video e - c ard Palm Centro The Wal l G if t ap p l ic ation Naught y or N ice Michael Leis http://blog.michaelleis.com

Don’t turn off the way to buy! Michael Leis http://blog.michaelleis.com

The greater meaning of juxtaposition An idea from 1923 is what fuels Social Media Today Michael Leis http://blog.michaelleis.com

Sergei Eisenstein: Montage of Attractions The meaning of a single image is mostly one-dimensional. This is a woman. Michael Leis http://blog.michaelleis.com

Sergei Eisenstein: Montage of Attractions Look what happens when we add just one more image to the screen: subtext created by juxtaposition! Michael Leis http://blog.michaelleis.com

Sergei Eisenstein: Montage of Attractions When you juxtapose two images, they become more: creating subtextual meaning between them. In this scenario, by juxtaposing two images of similar color value (low contrast), the Michael Leis http://blog.michaelleis.comthese subjects must be related to each other. assumption is made that

Sergei Eisenstein: Montage of Attractions As soon as you add a third image with contrasting color value, you’ve increased subtextual meaning again -- more dramatically. Michael Leis http://blog.michaelleis.com

Sergei Eisenstein: Montage of Attractions This meaning can change depending on the order the images are viewed. Michael Leis http://blog.michaelleis.com

Sergei Eisenstein: Montage of Attractions This meaning can change depending on how closely you relate the images in time and space. Michael Leis http://blog.michaelleis.com

Montage of Attractions: Visa We used low-contrast in the MyVisa Desktop application so that over time, receiving timely news would be more closely assocated with the Visa brand. Michael Leis http://blog.michaelleis.com

Emotional connections in the context of brand Users build emotional connections with the iTunes interface cataloging their own collection of music. Low contrast between your computer and store is key. Michael Leis http://blog.michaelleis.com

Create attractions for all audiences Design for contrast and value for every audience: internal and external Michael Leis http://blog.michaelleis.com

The Brand At the Top Ultimately Wins Michael Leis http://blog.michaelleis.com

Brands as a Platform APIs rule. Michael Leis http://blog.michaelleis.com

How Twitter Engages: Juxtaposing images and text I’m walking the dog. This party is insane! I’m sacrificing goats. Michael Leis http://blog.michaelleis.com

How Twitter Engages: Juxtaposing images and text I’m walking the dog. This party is insane! I’m sacrificing goats. Simply by changing the image next to the text, new meanings are created. Michael Leis http://blog.michaelleis.com

Juxtaposition Between Tweets In the Twitter stream, we have both the juxtaposition between text and avatar image, as well as between all the updates on the page against each other. Michael Leis http://blog.michaelleis.com

Juxtaposition Between Tweets Facebook is no different Michael Leis http://blog.michaelleis.com

Juxtaposition Between Web Pages While all the UI controls are persistent in space, Twitter allows customization to drive maximum contrast in the User Experience of the Web presence Michael Leis http://blog.michaelleis.com

Juxtaposition Between Application Designs ‣Each App provides a more ﬁne-tuned UX ‣for the media and audience Michael Leis http://blog.michaelleis.com

Miller ServerSpeak ‣B2B ‣Teaching Bartender Tips ‣Watch the video ‣Take the quiz ‣Win a prize Michael Leis http://blog.michaelleis.com

Solution: Common Engine Content ‣One inventory of content serves up experience unique to segment Michael Leis http://blog.michaelleis.com

Mapping the Experience Viewer Cl ub hous e Server Speak Par t y Central Videos, Quizzes, Prizes, User Data ‘Ol R el iab l e Sp otl ight Home Away From Home Michael Leis http://blog.michaelleis.com

But We Can’t Offer Prizes ‣We can oﬀer prizes if they have no tangible value ‣How much is a Facebook Virtual Trophy worth? ‣115 exposures per win ‣Social capital for bartenders Michael Leis http://blog.michaelleis.com

APIs enable the “local destinations” of the information age Put the content, utility where people are. This is merely the newest, best content distribution system. Michael Leis http://blog.michaelleis.com

Distribution History of the New York Times Newsboys: Perfect for taking newspapers to crowded corners and yelling. Not so great where it comes to children and labor laws. Michael Leis http://blog.michaelleis.com

Distribution History of the New York Times Newsstands: much more content, associated product choice delivered to populated areas Michael Leis http://blog.michaelleis.com

Distribution History of the New York Times Honor Boxes: Like newsboys, but without all the messy labor laws and exploitation. Content is delivered via unionized labor driving trucks. Michael Leis http://blog.michaelleis.com

Distribution History of the New York Times The NYTimes OPEN API allows developers (read: newsboys) to develop and distribute content that makes the most sense for their populated corner of the mobile Web. Michael Leis http://blog.michaelleis.com

This is Not Just Push Marketing Michael Leis http://blog.michaelleis.com

Why Use Social Networks for Pull? ‣Put brand in the context of friends, peer group ‣Social Proof ‣The crowded line, canned laughter Michael Leis http://blog.michaelleis.com

Bring The Social Network Back To You Note the juxtapositions of your friends and major shared experience events at low contrast within the CNN brand context. Michael Leis http://blog.michaelleis.com

API Push/Pull is Important For People ‣Portability creates stronger friendships ‣Positioning within the peer group ‣Makes usernames and passwords easy to remember ‣For the user ‣For the brand Michael Leis http://blog.michaelleis.com

Twitpic: Dual-Purpose API use ‣Put your picture on TwitPic ‣Sends it to Twitter Michael Leis http://blog.michaelleis.com

How Can Brands Take Advantage of this? ‣Start one step into their own registration process ‣Provide API-based functions that help users on their own site Michael Leis http://blog.michaelleis.com

Metric Montage Timing as added subtextual meaning Michael Leis http://blog.michaelleis.com

The Right Way to Wireframe ‣Challenge ‣Depict/summarize the process of Interaction Design from persona through sketch, wireframe, visual design ‣Solution: Metric Montage ‣Will allow for atomization and contrast ‣Goal: Create larger subtext around the process Michael Leis http://blog.michaelleis.com

Michael Leis http://blog.michaelleis.com

The Death of Mom Jokes in Social Networks Social Networking in Small, Private Groups Michael Leis http://blog.michaelleis.com

Once Everyone is On Social Networks… ‣Niche networks that leverage time/ place/ exclusivity Michael Leis http://blog.michaelleis.com

Now That People Get Social Networks ‣Private Social Networks help facilitate: ‣Consensus for purchase ‣Big Ticket items like Diamond Rings, Wedding Dresses ‣Coordination purchases like vacations ‣Sharing pictures, conversation with small groups Michael Leis http://blog.michaelleis.com

Let’s Wrap This Thing Up. What the heck was he talking about? Michael Leis http://blog.michaelleis.com

The More Things Change... ‣Linear narrative has, and will continue to be solid as a way to consume content ‣Interactive, circular narrative is how brands need to furnish content going forward ‣Provide ways for people to mediate societal norms ‣Think more in terms of sponsoring experiences ‣Bring sociality, montage of attractions into the site as hub Michael Leis http://blog.michaelleis.com

Preparing For Ubiquitous Computing • Look for visual relationships, contrasts, meanings in platforms • How do people express identity, hierarchy within peer groups? • Agencies need to think in terms of connecting people to content, with meaningful design and UX • Inside and outside the organization Michael Leis http://blog.michaelleis.com

Think of brands as platforms Michael Leis http://blog.michaelleis.com

Help People Connect Or be left behind. Michael Leis http://blog.michaelleis.com

Thank you. ‣Michael Leis ‣Strategic Consultant ‣ml@michaelleis.com ‣@mleis

http://blog.michaelleis.com	51
http://blogs.imediaconnection.com	25
http://www.slideshare.net	8
http://www.lmodules.com	2
http://www.transmediastoryteller.com	1

Designing Narrative: Contrast, Timing, and Context

by Michael Leis on Feb 13, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

5 Embeds 87

Statistics

Designing Narrative: Contrast, Timing, and Context — Presentation Transcript