Tap and Hold

Resn
Resn
Published in
6 min readMay 2, 2017

We love the internet, we love the creative playfield that is digital, we love what’s possible online, but we’re also keenly aware of the need to sell our clients products in order to make what we love.

Unbridled, balls-to-the-wall creativity and analytics driven e-commerce are unlikely bedfellows, they’re more like the premise to some 90’s cop buddy movie — It may be hilarious, but they just don’t get on with each other.

To put it simply: Some people wanna scroll and buy. Other people wanna to play and experience.

So then, how do we merge sales with marketing? What is the balance of story to make users aware and excited with the practicality of selling products efficiently? Practicality also in this mobile, handheld world we all now live in.

The answer: We don’t merge, we layer.

We eliminate any competition by hiding one, below the other — We then access this hidden content via a simple intuitive gestural mechanic.

Tap & Hold, or tap-to-view-more.

We have successfully applied this approach to a number of experiences, from interactive music videos to straight up e-comm sites with great success.

Accessing a deeper layer of ‘culture’ content also means the smaller visual real estate on handhelds is dealt with in a novel way.

Erik Högfeldt Co-Founder of social and mobile centric creative agency Highfield has his own perspective:

“Tap & Hold is such a natural behavior now and I think we’re just scratching the surface of what it can become. It feels naturally rewarding, especially in an ecom environment.

We believe there’s a growing opportunity to increase conversion by closing the behavioral gap between the social platforms brands advertise on and the e-commerce platforms brands want consumers to check out on.

Now it’s like meeting someone really interesting but once you’ve moved past introductions and they invite you over to their place, they’re less fun than you first thought. Tap and hold to play is definitely one of the techniques that can help shape more fun and consistent consumer journeys on mobile. ”

It is important to stress here, particularly when speaking of e-commerce, that the hidden culture or ‘story’ content does not have to be accessed. If a user does not engage they still have total access to point of sale and retail focus (the ultimate intention of any branded experience). Engaging with the hidden layer simply enriches the retail experience, it does not penalise those who don’t dive deeper in it rewards them.

Audio, or talking mobile-first, lack thereof is another challenge to be met with. It’s no mistake that Resn’s uses contextualised and positional visual feedback when users access the second layer — They need to feel responsible, cause and effect.

Resn is currently exploring iconography, one such way we are changing people’s online consuming habits whilst also creating a new visual dialogue between brands and their consumers.

The following mobile-centric examples show our evolution and expansion of the content layering concept with each experience exploring and building on the previous.

Our very own portfolio site was also the proving ground for this approach.

The challenge was simple: How do we show the world our personality, our humour, and our interactive chops while not scaring potential clients away?

Our solution was to ‘hide’ a number of playful, unpredictable, psychedelic and down right weird interactive toys behind a calm, ‘premium’ surface.

Access to the crazy world was via a simple gestural mechanic, you guessed it — Click & Hold.

Removing your finger and your back on the surface, calm, premium aka ‘Resn Nights’.

view project «

A handheld interactive music video which fused the Korean Hip-Hop of Keith Ape to the sales mission of the new water resistant Chuck II’s.

Users passively watching the video could mix things up at any time by accessing 1 of 23 randomly contextualised animated gifs, creating their own unique experience every time.

The gifs were a combination of equal parts, product focussed content and neon soaked culture content.

view project «

Housed on adidas.com the key creative concept of the Originals ZX Flux 2016 campaign was to create a sense of ‘Limitless Possibilities’.

A CTA to Click & Hold* via a button unleashed a dazzling display of graphic shapes, urban textures, colours and animations reflecting ‘Limitless Possibilities’, releasing at any time brings the user back to the product focused ecomm experience.

*Copy was intended for the desktop version.

view project «

Our second Tap & Hold enabled interactive music video was created as part of the “Did you mean MailChimp” campaign.

In what could be a world’s first interactive metaphor, users could “lift the veil” of the traditional music video format to reveal a behind-the-scenes perspective that runs in parallel to the main video.

The Tap and Hold transition utilizes a veil-like shader effect that manipulates the videos in real-time.

view project «

Our latest release and another collaboration with adidas is also our most exciting and engaging e-comm experience to date.

It is the culmination of all the above elements with the exciting addition of the contextualisation of the content being delivered to the user.

The Climazone features 3 video vignettes which depending on where a user is in the experience will play a specific video anchored in a specific part of the site.

view project «

This is the next logical, and very exciting step for us enriching the experience based on a single customer’s wants, interests and needs based on machine learning… Wow!

We are entering the Renaissance of the dot com site, technology and the unprecedented flexibility of brand online platforms has empowered us to bring the ‘experience’ to said platforms.

No longer do we need to rely on microsites to scratch the creative itch and tell the story of the brand — we get to do it all in the same place.

Resn is a creative agency with a digital obsession. Our singular vision is to infect minds with gooey interactive experiences that amaze and stupefy.

Since 2004, Resn has worked at the frontier of interactive development and design. Our highly-skilled team has the expertise to take on complex technical challenges and fulfill creative dreams. From early insights and strategy to premium design and development, we collaborate with our clients at every stage, to deliver valuable engagement with their brand. We call this the Resn Effect.

Resn was recently awarded the prestigious title of Agency of the Year for 2016 by both Awwwards and CSS Design Awards.

--

--