paint-brush
How to make visually engaging web formsby@diony
825 reads
825 reads

How to make visually engaging web forms

by Diony McPhersonSeptember 24th, 2017
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Beautiful web forms and landing pages are vital to getting a response from your audience. This is especially true for industries where the product is a visual — photographers, designers, creatives, architects, or for industries that rely on visual results like fitness, health, real estate etc. Imagine a bot trying to sell a photographer’s portfolio with scripted text and a few tiny thumbnail images? Nope. Successful design studios like <a href="http://www.ultranoir.com/en/#!/contact/">Ultanoir</a> have a stunning contact form that reinforces their brand and quality of work (see&nbsp;below).

People Mentioned

Mention Thumbnail

Companies Mentioned

Mention Thumbnail
Mention Thumbnail
featured image - How to make visually engaging web forms
Diony McPherson HackerNoon profile picture

Chatbots are all the rage right now. A great bot can raise sales or conversion rates dramatically for products that need personalized, one-to-one, sales pitches and engagement. But here’s the problem — when it comes to winning customers, chatbots can’t compete with visual engagement.

Beautiful web forms and landing pages are vital to getting a response from your audience. This is especially true for industries where the product is a visual — photographers, designers, creatives, architects, or for industries that rely on visual results like fitness, health, real estate etc. Imagine a bot trying to sell a photographer’s portfolio with scripted text and a few tiny thumbnail images? Nope. Successful design studios like Ultanoir have a stunning contact form that reinforces their brand and quality of work (see below).

This is story is brought to you by Hacker Noon’s weekly sponsor, Paperform. Create beautiful forms. For Hacker Noon readers, 10% off all plans forever.

Understanding why visually engaging web forms are an important tool for web marketing will help you create conversion and data capture magic. So to make life easy, we’ve boiled it down to three key factors that explain why visuals are a big deal, and three things you can do in response to ensure you’re putting your best foot forward.

Emotions are the primary influencer in decision making

Our decisions are driven by emotion. You might be thinking, “Not me, I always buy stuff based on sound reasoning!”, but even if you think you’re applying logic to your purchases, chances are you’re kidding yourself.

There’s loads of research to support this, especially when it comes to marketing. Even if you’ve set out to purchase something you need for very practical reasons, you’ll end up making your final decision based on how the product pitch makes you feel. Research by McCombs has shown that consumers will purchase based on emotion and then manipulate their logic to justify their decision.

In fact, Antonio Damasio’s research shows that not only are we driven to decisions by emotions, but that without it our ability to make decisions is stunted. Take that, brain!

`

When you’re selling something, be it an idea or a thing, you won’t get much movement without emotionally provoking your audience. If you want someone to complete a web form or purchase your product, they have to be moved to do so.

Images evoke lasting emotions in seconds

A picture doesn’t just say a thousands words, the right picture can make you feel all the feels, and fast. MIT neuroscientistsdiscovered that the brain can identify images seen for as little as 13 milliseconds, and that our brain instantly strives to make sense of those images.

And it’s not just in the moment either — a picture can sit unconsciously in our mind and influence our decisions into the future. CrowdRiff calls this ‘visual decision making’, and it’s potential is insanely powerful when harnessed. It happens to us everyday. One minute your fave designer is pinning a sleek danish designed coffee table on their trending board, and before you know it you’re trawling the interwebs for the best price for one of these bad boys. But why waffle on, when this infographic by says it all:

Here’s how powerful images are — you know the stat that says “90% of information sent to the brain is visual”? Yeah, there’s actually next to no research that specifically supports this, but I bet the infographic had you convinced (don’t worry, the other stats hold up).

Visuals are the fastest and most effective way we can move anyone to action. If you want someone to complete your form, you can’t afford not to visually engage.

The right images for the right response

If your products are visually engaging, it makes no sense to let an automated conversation describe in many words what an image can inspire in a second. What have we learned so far? Emotions are the primary influencer in decision making, and images evoke emotions super fast.

But what kind of an emotional response should you be looking to get? Well, don’t think that just slapping any old graph or photo will increase your sales. A study by SMITH has shown there are eight distinctive emotions that drive purchase decisions:

Images and visual layouts that play on these emotions will get a response.

So, how do you wield visuals to get that conversion, sale, or data?

The 3 core things you can do to ensure that your product sells itself

1. Think about the overarching narrative of your brand

Specifically, determine what you are trying to achieve with your web form as part of that narrative. Ask: what is your brand story, and how does this web form fit into that broader narrative? It’s this story that people are buying into, the emotional high they receive, rather than the product in isolation.

Perhaps the greatest example of sale through brand is Apple. It’s overarching story is one of imagination, design and innovation. It’s sub stories take these themes and make them personal. They are not really selling imaginative, well-designed, and innovative tech — they are selling you envisaging yourself as imaginative, being designer savvy, and innovative. It’s a narrative about how you will transform. It’s the feels.

I’ve had a few friends burned by the Apple Watch, and yet I still can’t help but scroll through this and wonder whether or not it will change my life. Case in point.

2. Knowing which emotions drive your audience will help you choose your images.

Determine what types of buyer emotion you want to tap into for your form (avoid having more than three, as you’ll cloud your message). You can’t appeal to all eight modes in one hit (if you can, please get in touch… seriously), but you can appeal to multiple. Certain emotions naturally group together, and certain products tend toward particular emotions. SMITH’s report has you covered when it comes to figuring this out. When you have, select visuals and copy that play on these emotions.

Again, Apple are a great example of this. Their brand is about imagination, design and innovation, but its visuals are geared toward those who have to be first, want to have fun, and feel special. They are king at creating and choosing visuals that tap into and magnify these emotions.

3. Plan the visual layout of the form, alongside your copy and questions, to be a journey that culminates in action.

This is what we call a ‘landing form’ at Paperform. It’s a form/landing page hybrid — it serves as the primary page for products, services, or actions, but captures information more complex than a basic landing page. Use your visuals to create momentum — spur your users on with emotive visuals of your brand and product, all the while capturing data. Here’s a simple example of an effective landing form:

Subscription Sign-up Form (Design)

While this is particularly good for those industries that rely heavily on visuals, like creatives, real estate etc., it will have an impact for even the most data heavy of forms: that teacher evaluation survey definitely needs you to inspire kids (God knows they need a push), the job application that you want to attract the brightest and best, and even that tradie quote which has to instill a reassuring sense of trust from the first glimpse.

Apple is a great, shining example of their brand done well. Your brand will almost definitely be different. Above all, be human and genuine in the narrative that you create. At Paperform we provide a tool that creates easy, beautiful, super-customisable landing forms and product pages, but our story and brand is really about inspiring people from all walks of life to create what they thought they couldn’t on their own. It’s a story of independence and empowerment.

So, what’s your story? How is your form part of that story? Who are you telling the story to? What visuals will move people to buy-in?

<a href="https://medium.com/media/f3f0d067023a2a84ae97ddf72954902c/href">https://medium.com/media/f3f0d067023a2a84ae97ddf72954902c/href</a>

Some further reading & some great resources

The advice here is top level — you’re now probably ready to drill down into the nitty-gritty. Listed below is marketing psych info, and some tools & tips to help you get creating.

Originally posted on Bluewire Media Blog on June 8 2017.

This is story is brought to you by Hacker Noon’s weekly sponsor, Paperform. Create beautiful forms. For Hacker Noon readers, 10% all plans forever. Learn more about becoming Hacker Noon’s Weekly Sponsor (spoiler alert — this form is powered by Paperform).