77
Future Web Trends Where brands, people, and technology meet. Presented at Colle + McVoy, January 23, 2009

Future Web Trends

Embed Size (px)

DESCRIPTION

What are the future Web trends? It starts with understanding the larger framework of narrative conventions and building subtext to create immersive experiences.This is followed by examples of how brands and agencies can use these concepts to develop immersive experiences for their audiences.

Citation preview

Page 1: Future Web Trends

Future Web TrendsWhere brands, people, and technology meet.

Presented at Colle + McVoy, January 23, 2009

Page 2: Future Web Trends

Stop Chasing

‣Trying to find the coolest shiny object will not help you

‣Google has looked at over one trillion pages

‣How much information will be created this year?

‣Four Exabytes

‣(4.0x10^19)

Page 3: Future Web Trends

Look for the larger framework

‣Don’t start with the story

‣Start with the narrative

‣The entire arc of communication

‣Pick the best parts

‣Create subtext

‣Make them technologically available

Page 4: Future Web Trends

Aristotle

‣Poetics

‣The art of imitating life

‣Linear Narrative

‣Beginning, middle, end

‣350 BCE

Page 5: Future Web Trends

Poetry is the Foundation of Narrative

‣Poets have always been civilization’s systems thinkers

‣Taking complex societal movements

‣Expressing these concepts in concise, evocative terms

‣Requires deft manipulation of narrative conventions

‣Billy Collins, “Aristotle”

Page 6: Future Web Trends

The destination we cannot help imagining

Page 7: Future Web Trends

A streak of light in the sky

Page 8: Future Web Trends

A hat on a peg

Page 9: Future Web Trends

And outside the cabin,

Page 10: Future Web Trends

And outside the cabin,falling leaves

Page 11: Future Web Trends

Classic 3-Act Narrative

CompleteNarrative

Beginning Middle End

Visible Story

Linear timeline

‣Broadly, this is this is the framework we use to create stories

Page 12: Future Web Trends

Classic Campaigns

Beginning Middle End

These videos, as well as the navigation above it are both examples of classic beginning-middle-end narrative convention. It works!

Page 13: Future Web Trends

Circular NarrativeCompleteNarrative

Beginning Middle End

story

Linear timeline Story takes place after main timeline

What makes circular narrative different, in this broad stroke, is that the visible storyline is detached from the linear timeline which it refers to.

Circular Narrative

Page 14: Future Web Trends

What is the result of well-executed circular narrative?

Page 15: Future Web Trends

Arguably the greatest movie of all time

Page 16: Future Web Trends

Citizen Kane Structure

‣ We try to solve the mystery of Kane’s last word, “Rosebud” by learning about his life through the filter of those who were closest to him.

Page 17: Future Web Trends

Rosebud

Page 18: Future Web Trends

Rosebud

Kane’sLife

M r Bernstein

SusanAlexander

WalterThatcher

M r. Thompson

JedidiahLeland

Ser vant

ViewerMapping the Story‣And if we were to create a conceptual model of this interaction:

Character interactions with Kane to explain Rosebud

Exposed in scenes to the viewer through character filter

Page 19: Future Web Trends

This is Social Media Community User Experience

‣When Will Evans visualized brand-centered social media, it was clear this is the same model as circular narrative

Community

BrandedPublic Content

Li festy le/Editor ia l

Brand

Brand

Brand

Brand

Brand

Public Internet

Find out more about Will atblog.semanticfoundry.com

Page 20: Future Web Trends

Circular Narrative is Interactive Narrative

Linear to the viewer,circular to the brand

Page 21: Future Web Trends

Circular Media

Societal norms

My norms?

Check peers

Opportunityto represent peers on TVvia mobile

Page 22: Future Web Trends

What Bridges these Devices?Widgets

Page 23: Future Web Trends

ComScore reports: everyone uses widgets

‣77% penetration in the US

‣Just over 80% in Canada

‣Many Don’t even know they’re using them

Page 24: Future Web Trends

Portable Brands

‣Where can I take it?

Page 25: Future Web Trends

Portable Brands

‣Marketing through branded portals (free)

Page 26: Future Web Trends

Portable Brands

‣To a Facebook profile

Page 27: Future Web Trends

Portable Brands

‣To the Dashboard

Page 28: Future Web Trends

Claus Facebook Page

Page 29: Future Web Trends

Claus Facebook Page User Experience

PalmCentro

Claus

Video

Gif t appl icat ion

MP3s

The Wal l

e - card

Naught yor

N ice

Viewer

Each media object filters narrative from the brand to the product, through the Claus character, to the audience.

Sadly, this nice, effective (90k+ friends) circular narrative was planned in a linear model, leading to....

Claus as circular narrative first published by Adam Broitman http://amediacirc.us/

Page 30: Future Web Trends

Sigh.

Page 31: Future Web Trends

ApplicationsDeeper meaning in the context of brands.

Page 32: Future Web Trends

The greater meaning of juxtaposition

An idea from 1923 is what fuels Social Media Today

Page 33: Future Web Trends

Sergei Eisenstein

‣At the Circus, discovered that each added ring (attraction) increased the subtext and meaning created depending on contrast.

‣In 1923, he applied this to film theory with the “Montage of Attractions”

Page 34: Future Web Trends

Sergei Eisenstein: Montage of Attractions

‣With one image, the viewer can come to a simple conclusion about its meaning.

Page 35: Future Web Trends

Sergei Eisenstein: Montage of Attractions

‣Juxtaposing two images of low contrast (similar color values) tells the viewer that these items are linked.

‣A greater subtextual meaning and interest is created.

Page 36: Future Web Trends

Sergei Eisenstein: Montage of Attractions

‣Adding a third image of high contrast changes the meaning of all three pictures, creating even more meaning and interest to the viewers’ experience.

Page 37: Future Web Trends

Sergei Eisenstein: Montage of Attractions

‣Even changing the order in which the contrast appears changes the subtextual meanings, and the story we take away.

Page 38: Future Web Trends

Montage of Attractions: Visa

‣Creating a desktop RSS reader with low contrast in the application transforms the subtextual meaning of news to be within the context of the Visa brand.

Page 39: Future Web Trends

Emotional connections in the context of a larger brand

‣Visual contrast of four main elements

‣Creates visual, auditory juxtapositions for my music experience in the context of Apple

Page 40: Future Web Trends

Emotional connections in the context of a larger brand

‣The emotional, subtextual meanings created in the interface are transferred to the store

‣Audiences are persuaded and trained on how to shop by organizing the music that’s most important to them.

Page 41: Future Web Trends

Create attractions for all audiences

‣The future trend for agencies is to create meaningful interfaces for external and internal audiences

Page 42: Future Web Trends

The Brand At the Top Ultimately Wins

‣Following basic usability, top of the visual hierarchy is most important item.

‣Contrast and juxtaposition dictates meaning, value

Page 43: Future Web Trends

Brands as a PlatformAPIs rule.

Page 44: Future Web Trends

APIs

‣Application Programming Interface

‣Allows developers to take a controlled subset of your data

‣Create interfaces for their own niche audiences

‣The conceptual framework isn’t new at all

Page 45: Future Web Trends

APIs

Brand

Audience

Developers

Page 46: Future Web Trends

This is Not a Website

It’s the Twitter Web interface

Page 47: Future Web Trends

How Twitter Works (in theory)

Desktop appsTweetdeck, Twhirl

Web AppsTwitter.com,

Search.Twitter.com, Web Widgets,

Facebook

Phone AppsTwitterberry Twitteriffic,

et. al.

TV

Page 48: Future Web Trends

What Makes Twitter So Engaging?

‣Juxtaposition of images of faces with unpredictable text

‣API allows developers to design this engaging contrast in environment suited to their audience.

‣Montage of attractions = any text juxtaposition will make contrast of messages more sub-textually meaningful

Page 49: Future Web Trends

I’m walking the dog.

This party is insane!

I’m sacrificing goats.

How Twitter Engages: Juxtaposing images and text

Page 50: Future Web Trends

I’m walking the dog.

This party is insane!

I’m sacrificing goats.

How Twitter Engages: Juxtaposing images and text

Page 51: Future Web Trends

I’m walking the dog.

This party is insane!

I’m sacrificing goats.

How Twitter Engages: Juxtaposing images and text

Page 52: Future Web Trends

Juxtaposition Between Tweets

‣More than any three-ring circus, the Twitter Web interface is driving almost endless possibilities of subtextual meaning via contrasting images and text.

Page 53: Future Web Trends

Juxtaposition Between Web Pages

‣The experience of navigating Twitter.com is always juxtaposing contrasting images

‣The only consistency is in the Logo at top and ordering of objects

Page 54: Future Web Trends

Juxtaposition Between Application Designs‣Each App provides a more fine-tuned UX

‣for the media and audience

Page 55: Future Web Trends

Miller ServerSpeak

‣B2B

‣Teaching Bartender Tips

‣Watch the video

‣Take the quiz

‣Win a prize

Page 56: Future Web Trends

Solution: Common Engine Content

‣One inventory of content serves up experience unique to segment

Page 57: Future Web Trends

But We Can’t Offer Prizes

‣We can offer prizes if they have no tangible value

‣How much is a Facebook Virtual Trophy worth?

‣115 exposures per win

Page 58: Future Web Trends

Mapping the Experience

Videos,Quizzes,Prizes,User Data

ServerSpeak Par t y

Centra l

Spot l ight

Clubhouse

‘OlRel iable

Home Away From Home

Viewer

Page 59: Future Web Trends

APIs enable the “local destinations”

of the information agePut the content, utility where people are.

Page 60: Future Web Trends

Distribution History of the New York TimesNewsboys

Newsstands

Honor Boxes

API

Page 61: Future Web Trends

This is Not Just Push Marketing

Page 62: Future Web Trends

Why Use Social Networks for Pull?

‣Put brand in the context of friends, peer group

‣Social Proof

‣The crowded line, canned laughter

Page 63: Future Web Trends

Bring The Social Network Back To You

Page 64: Future Web Trends

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

Page 65: Future Web Trends

Twitpic: Dual-Purpose API use‣Put your picture on TwitPic‣Sends it to Twitter

This is not Twitter. Just using Twitter user data.

Page 66: Future Web Trends

How Brands Collaborate for API Push/Pull

Page 67: Future Web Trends

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

‣But is there critical mass in social networking?

Page 68: Future Web Trends

Top Four Most Popular TV Shows

‣M*A*S*H* 50.1M

‣Dallas 41.47M

‣Facebook 40M US users

‣Roots 36.38M

Page 69: Future Web Trends

The Death of Mom Jokes in Social Networks

When Everyone is on Social Networks:Social Networking in Small, Private Groups

Page 70: Future Web Trends

Niche Networks Leveraging Time/Place/Exclusivity

Page 71: Future Web Trends

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

Page 72: Future Web Trends

Let’s Wrap This Thing Up. What the heck was he talking about?

Page 73: Future Web Trends

The More Things Change...

‣Linear narrative has, and will continue to be solid

‣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

Page 74: Future Web Trends

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

Page 75: Future Web Trends

Think of brands as platforms

‣Widgets

‣Put value wherever people are

‣Applications

‣Brands must provide utility

‣APIs

‣The world is becoming networked

Page 76: Future Web Trends

Help People ConnectOr be left behind.

Page 77: Future Web Trends

Thank you.

‣Michael Leis

‣Trellist Marketing | Technology

‣Senior Associate, Strategy

[email protected]

‣@mleis