Making contact

The contact page redesign

The redesign journey continues. Today I tackled the contact page. To many people a contact form seems simple but not only is there more happening behind the scenes than people realise but designing a form with good usability is not easy.

Sure, a simple form is easy. Name, email and/or number, message send. But what if you need a more complex form or a long form?

No one likes completing forms but sometimes we need them. How do you make a long form easier to use? Well keep reading and you’ll find out.

This is also a great place to add basic contact information like phone number, email address and social pages.

The contact page redesign with conditional logic form.
The contact page redesign with conditional logic form.

It’s All About The Details

Looking on the right first, basic contact details. I added icons that when clicked or tapped perform an action. The phone icon will start a call when on a mobile phone or other device that can make calls. The email icon will try to open your mail app or service. The WhatsApp icon opens a chat in the mobile app or on desktop, starts the WhatsApp Web interface.

Even though I provide the details on the screen I still want to make it as easy as possible for people to contact me. So no need for copy/paste. Magic.

Then we have the social media icons to follow on the various platforms.

Then we come to our form. At first it’s a basic form right? Wrong. I used a magical thing called conditional logic. Basically if this happens then this should happen. It’s how I set the form to only show certain things based on choices.

So if someone just has a simple query then this is it for them.

redesigned form page 1 general
redesign contact page project

Choose “General” and a send button appears, click it and away goes the form. But choose “Project” and you get a button that takes you to the first page of the creative brief. What’s great about this is that I’m not forcing extra stuff on someone who doesn’t need fill in the extra fields. And because the buttons only appear on the choice I’ve eliminated the confusion.

The Creative Brief

Redesigned form design brief

The creative brief is the best way for us to get all the information we need to figure out more about what you need. This allows us to work out a quote and tells us most of what we need to know. It can take some time to fill in but it saves time and miscommunication.
To make it a bit easier I’ve broken it up into pages. Smaller bite sized chunks and as long as you come back to the same browser and you haven’t cleared the cache or cookies your information will be where you left it.

design brief options

It’s Only Logical

Here’s a smaller example of conditional logic. If you don’t have a logo then there’s no need to give you the extra field. The link field only appears when you choose the option that you do have a logo or brand. All of this is an effort to make the process of form filling less tedious.

Skipping the 3rd page because it’s just a boring form page, page 4 ends with another choice. If it’s a new site you need you get the send button and away she goes. You’re done.

But site redesigns have a few extra questions. To get those on a new build will only confuse the issue. Instead we put that on another page.

And there you have the new form experience at LiveFuse. I tried to make the basic form as simple as possible and allowing the option for a more in depth form if it’s needed. I also realised that creative briefs can be long and tedious so I’ve worked on making that an easier experience too. I hope I’ve succeeded.

Follow Us

Leave a Comment

Check This Out

launch promo overlay

Launch Promotion

To kick off the launch of LiveFuse Web Studio we’ve got a great WordPress promotion. · Up to 3 basic pages or sections built on a top, premium theme. The same theme that we use for our own site. It’s clean, fast, reliable, lightweight and SEO friendly. Trusted by over 100,000 WordPress sites. Every WordPress

Read More »
social media

You Gotta Be Social

Love it or hate it. There’s no escaping social media. It’s become a part of life. It’s where we follow the brands we like. Where we check out new ones to see if other’s have had a good or bad experience. Social proof is a huge part of how people choose brands and services. It

Read More »
Bio-Sil WIP

What We’ve Been Up To

We apologise for being so quiet on the updates recently.  When you’re a small operation you tend to get so focused on your client projects that you neglect your own. So we thought we’d take minute to update you. We’re busy with 2 projects at the moment. Both of them eCommerce sites built on WooCommerce.

Read More »

Talk to us! We'd love to hear from you

We work remotely from Johannesburg. Drop us a message using the form.

You can reach us using:
Call | WhatsApp | Telegram | Email

Leaving so soon...

but we're just getting to know you.

Still deciding if LiveFuse is right for you?

We’d love to work with you on your next website or help you with an existing one.

Send us a message and we’ll get back to you to discuss your needs.

We use cookies to ensure the best user experience. Our privacy policy can be viewed here.

Secured By miniOrange