Or a ‘cinematic’ webpresence with a chatbot voiceover

Sketch for Digital Experience Interface.jpg

Digital experiences are what fascinate and drive me. That’s why I admire new media art or #netart (e.g. MuchBetterThanThis.com by Rafaël Rozendaal ) and I strive to create inspirational and lasting digital presences in whatever digital medium that is applicable.

It’s with this in mind that I propose the idea of a web presence with cinematic traits and embedded chatbot, and critique the existing examples of digital experiences.

Introduction

Let me first state that — in my opinion — it’s impossible to actually create or design an experience; a person has an experience. And unless you’re a geneticist or neuroscientist running a mind control experiment, you don’t get to determine the actual experience (sorry UX’ers 🙁).

You can however try to influence the experience, by telling a story, compel actions/reactions, evoking emotions and designing the interface the person interacts with. I prefer to call this the Experience Interface, rather than the User Interface. It’s more a broad vs. narrow definition, where for me the User Interface is the controls the user is given and the Experience Interface is the totality of the environment and how it evolves during the interaction.

A number of factors is important here.

Story and Cinema

Our evolutionary hardwired way of sharing experiences is storytelling. According to Wikipedia “the term ‘storytelling’ can refer in a narrow sense specifically to oral storytelling and also in a looser sense to techniques used in other media to unfold or disclose the narrative of a story.” It predates writing, but rock-art (as supporting material) may have served as a form of storytelling for many ancient cultures.

So it’s not story reading, not story watching, but story telling. And (again via Wikipedia):

“Crucial elements of stories and storytelling include plot, characters and narrative point of view.”

Cinema, or motion picture, is a very compelling way of storytelling, and basically a big step up from the rock-art. It also uses some techniques that greatly enhance the conveying of a story, specifically: the establishing shotpanningtilting and zooming.

To clarify “An establishing shot in filmmaking and television production sets up, or establishes the context for a scene by showing the relationship between its important figures and objects. It is generally a long or extreme-long shot at the beginning of a scene indicating where, and sometimes when, the remainder of the scene takes place. (Wikipedia)”.

Panning is swiveling the camera horizontally from a fixed position. Tilting is the same, but rotating vertically. And finally, zooming brings the object closer (close-up) or further away (wide shot).

To actually craft a good visual story we can take some pointers from screenwriting. In the chart below you see the ‘3 Act Structure’ as defined by the late Syd Field.

3 Act Structure by Syd Field, author of Screenplay

3 Act Structure by Syd Field, author of Screenplay

The main elements are the plot points and working your way towards the resolution. The ‘action’ and ‘confrontation’ shouldn’t be taken literal in the sense of ‘physical’; the confrontation can also be emotional and the actions/plot points manifested as certain insights during the progression of the story.

Utilizing these storytelling elements and techniques have proven to be an effective way of influencing human experience.

Conversations

Maybe even more impactful than a story, and certainly essential to the dissemination of a story is the conversation about the story. The force of a story grows exponentially with the speed and ease in which it is shared (and no, this is not achieved simply by adding a ‘share’-button).

And with conversations there’s a lot of neuroscience at work.

Judith E. Glaser, in her book Conversational Intelligence states “Conversations have the power to change the brain — they stimulate the production of hormones and neurotransmitters, stimulate body systems and nerve pathways, and change our body’s chemistry, not just for a moment but perhaps for a lifetime.”

And “Conversations impact different parts of the brain in different ways, because different parts of the brain are listening for different things. By understanding the way conversations impact our listening we can determine how we listen — and how we listen determines how we interpret and make sense of our world.”

“Language plays a role in the brain’s capacity to expand perspectives and create a ‘feel-good’ experience” — Judith E. Glaser

The importance of this for every product is stressed by Ross Mayfield in his article Products Are Conversations. He states “Your customers want to talk with you […]. They want to be heard and want you to understand their needs. It’s your job to enable these conversations, and figure out how to have them at scale.”

I also like to borrow his quote:

“The single biggest problem in communication is the illusion that it has taken place”

Which he attributes to George Bernard Shaw, but according to Quote Investigator 🔍, it should be William H. Whyte 😉.

So the better conversation you have or incite, the better the experience, and the better your message gets across.

This is also what makes conversational interfaces (like chatbots and voice-assistents) so powerful.

Experience preparation

Like language and visuals there are other dramatic techniques you can use to influence an experience. For this I’d like to refer to Kile Ozier ‘s 5 tenets of Experience Creation (he can create experiences, he’s just that good):

N.B. The explanations contain my paraphrasing

  • Exploration of Assumption; what is the audience assuming when accessing the interface. And can you circumvent or overcome or rather leverage and enhance those assumptions.

  • Liberation of Preconception; preconception is a conversation(!) going on inside the head of the audience, i.c. the user, reassuring s/he knows what’s going to happen. If you can liberate them from this, you can give them a fresh experience and renewed excitement.

  • Comfortable Disorientation; feeling safe in not knowing what’s next. Effectively executed, this technique results in an immediate, deeper level of trust on the part of the audience, i.c. the user, and an intangible yet greater willingness to suspend disbelief.

  • Successive Revelation; too much, up front, can completely overload the audience early and virtually numb them to further sensation, empathy or inspiration; leaving them inured to subtlety and nuance as the Story or Experience unfolds. You should try to shape the arc of storytelling by balancing curiosity and revelation.

  • Subliminal Engagement; inviting the audience, i.c. the user, to participate in the creation of their own experience. Allow for the journey or journeys to be completed in the imaginations of audience members, i.c. users.

So if you truly want to create a digital (user) experience, you’d better be willing to put up a show 🎭 !

Application to web presences

The above mentioned fundamental elements and techniques with regards to (visual) storytelling, and experience preparation, are — in my opinion and perception — currently lacking from most digital experiences. Even the ones that are most dependent on story, like brand websites.

But there are some notable exceptions!

For example the Mercedes-Benz campaign site for their new, all electric, vehicle the EQC:

Animated GIF. See website for the full experience (n.b. on mobile the intro tilt doesn’t seem to work)

Animated GIF. See website for the full experience (n.b. on mobile the intro tilt doesn’t seem to work)

Let’s brake it down:

“Electric now has a Mercedes”. Now there’s a story headline! And there is a beautiful establishing shot (with tilt). The story unfolds. Reveal after reveal. There are pans and tilts (in intro and outro) and parallax scrolling (top layer scrolling faster than bottom layer to create depth)! All-in-all a visual feast, with some subliminal engagement: you control the scroll and can pan/tilt around in the establishing shot a bit.

What’s still lacking is conversation, or any meaningful interaction for that matter. Which is a shame, because it would have been a great opportunity for Mercedes-Benz to get a first impression of the user’s reaction to their new product.

On to another example: Apple’s iOS12 website, introducing their latest software update for the iPhone and iPad.

Animated GIF. See website for the full experience.

Animated GIF. See website for the full experience.

Again a break down: First the establishing shot is reminiscent of the queue for the ride at the Wizarding World of Harry Potter at Universal Studios in Orlando.

Harry Potter portrait wall.jpg

Talking Portraits and all. Some ‘Comfortable Disorientation’, to which Kile Ozier notes: “Theme parks strive for this all the time, often with what I call the Venice Effect; bringing guests through a queue that is often labyrinthine, usually feels a bit cramped — limited sightlines, low ceilings — to then be suddenly released into a space that seems vast by comparison.”

For a fluent version with sound see YouTube

For a fluent version with sound see YouTube

Of course Apple here has the benefit of the iPhones/iPads as ‘natural’ frames. There’s some ‘successive revelation’ in introducing the different features with auto-playing animations, but other than that there’s little more experience to be had.

Again the lack of interaction and conversation is a missed opportunity.

And to show that it is possible, see the Typeform blogpost on the rise the conversational interface:

Animated GIF. See website for the full and personal experience

Animated GIF. See website for the full and personal experience

I encourage you to give it a try yourself by checking out the blogpost and putting in your own responses. Even though the ‘conversation’ is preformatted, by making your response choices, you get the feeling you’re sharing your view and engage on a basic level.

I first saw this on Adrian Zumbrunnen ‘s personal website, which does allow open ended input. This, at least for me, immediately raises the bar for engagement, because what happens if he responds in person 😳? So it definitely triggers an emotion on my side, which is a good thing.

Chatbots of course make scaled conversations like these possible and can gather a great deal of customer insight. And the Typeform example shows the potential storytelling power and enhanced experience when it is seamlessly integrated in the total experience interface.

The ideal

So an ideal digital experience interface, to me, should contain all the above mentioned storytelling elements and utilize all the available techniques (with moderation of course).

What I envision is basically a merger between the before mentioned Mercedes-Benz EQC site and the Typeform blogpost;

The interface commences with setting the scene in a visually attractive and seductive way. Than the chatbot comes in as a voice-over, or narrator, and engages you by giving pointers as to how to further explore the interface, triggering different user controls and visual attractions; unfolding the story with you. It asks questions and gives options, actively soliciting your feedback.

To be clear the chatbot is not ‘on top of’ (which is often seen as ‘live chat’, and completely disengaged from the site content and story) but embedded, taking or talking you through the story, actively engaging you and asking for your feedback in the moment.

And more…

If we could have all this, there’s one more thing that would be the icing on the cake 🍰: Sound. Or better ‘sonic branding’ 🔊.

Of course if you add video or podcast to a webpresence, you have sound already. But I see it as a stand-alone feature, supporting the overall experience.

To clarify, sonic branding, or sound/audio branding, is “the strategic use of sound … in positively differentiating a product or service, enhancing recall, creating preference, building trust, and even increasing sales. Audio branding can tell you whether the brand is romantic and sensual, family-friendly and everyday, indulgent and luxurious, without ever hearing a word or seeing a picture. And it gives a brand an additional way to break through audiences’ shortened attention spans.” (Wikipedia)

And again I’m not thinking jingles, but embedding sounds that you associate with the topic or product. To give you an idea listen to👂 the NIKE Freestyle video based on an idea by Jimmy Smith:

Wouldn’t you feel more engaged if you visited a website selling athletic shoes and hearing this in the background?

I look forward to your feedback and hope to create some of these ideals with you.

Comment