UX or User Experience takes web design a step further. In addition to asking, “how aesthetically pleasing can I make this site look?”, UX designers focus on a user’s interactive experience on a webpage. A customer’s online experience can be impacted by countless factors like page loading time, readability, interactivity, usability, and so much more. But each of these factors make up a single brand impression, and often times, you only have one shot at making a good one.
Today, you need more than quick page speed and high res pictures to grab a user’s attention. You must incorporate interactive, thoughtful elements to keep customers coming back for more. To give you some inspiration, here are 6 of our favorite brands using innovative, yet simple UX design.
Adding interactive elements to your webpage can both delight and direct users to learn more about your services or make a purchase. Charity: water does an amazing job at incorporating subtle, yet impactful interactive features from start to finish. With clickable content and attention-grabbing graphics, Charity: water tells a memorable story that tugs at your heartstrings and has you reaching for your wallet.
What Charity: water does well:
- Bright call-to-action buttons throughout the site attract users to not only donate but also become more involved with the organization. The pops of color direct your eyes down the page and lead you to digestible pieces of content.
- In addition to their clickable homepage content, you can see subtle, moving graphics throughout the site. These small, yet impactful elements help reiterate the cause you’re donating to while adding a little fun.
- Embedded video content is sprinkled throughout this entire site. Did you know embedding video on a page can increase conversions by 80% or more? That’s because video is easy to digest and sticks with you. In fact, viewers retain about 90% of a message when watching a video compared to just 10% when reading text on a page.
Our favorite task management system, Asana, left a lasting brand impression on us with their scrolling graphics. As you make your way down the page, you become integrated with the software itself and can see Asana premium features first-hand. It’s like you’re already using the software!
- As you scroll, your eyes are drawn to a clear call-to-action with bright purple buttons. These CTAs are present at the top and bottom of the page.
- The dancing on-page elements are so much fun and make you pause. The graphics show parts of the actual Asana dashboard and provide a visual of the product itself – not just a concept spelled out in a large chunk of text.
- Large, easy to read text allows readers to consume information quickly and it’s perfectly accompanied by interactive graphics.
Have you ever wondered why there are so many Airbnbs to choose from? Maybe it’s because their host landing page is so user-friendly! This page may not feature moving graphics, but its bright photos and irresistible form fills tempt me to become a host… and I don’t even own a house!
- 69% of website visitors won’t submit a form if too much information is required. Airbnb’s short, interactive form shows an instant estimate of how much you could be making as a host. This provides an immediate answer to the user’s question and prompts for more information to transform the user into a lead.
- Warm, inviting photos of real hosts make this webpage personal and provide an insider’s look at listing with Airbnb.
- People want short, accurate answers to their questions. Throughout the page, you’ll notice that all of the text blocks are no longer than one or two sentences. Small, digestible blocks of content with links to longer form content prove to be successful time and time again.
MailChimp is one of the leading email marketing applications in the world, but they try to keep it simple when it comes to user experience. Instead of excentric animations, they utilize contrasting colors to their advantage. By splashing their bright brand colors and large fonts against a white background, your eyes are directed to all the right places.
- Icons are a great way to draw attention to certain services or aspects of your brand. Images also tend to stick and resonate with people more than text.
- We love the bright, cheerful photo that portrays actual MailChimp customers. It also accentuates the customer’s testimonial to the right of the image.
- MailChimp toots its own horn with well-known customer logos near the bottom of the page. These logos help establish brand credibility and caliber. We’re here for this humble brag.
Did you know that a company’s About Us page is the second most visited page on a website? Wistia’s yearbook is unlike anything we’ve seen! As you scroll over each employee’s picture, it comes to life and shows a bit of their unique personality. And if you switch to Drum Machine Mode, you can make your own beat at you click through each employee. How neat is that?
What makes this About Us page so great:
- Wistia is a video hosting site. In addition to adding video to their homepage, they carry the theme of animation throughout their site. This is the definition of leaving a great, consistent brand impression.
- It’s simple, yet effective. There’s no need for bright colors or flashy animations. Everyone’s personality is memorable enough. Don’t forget to press “Partytime” in the bottom right corner!
- Instead of an email address, employees can choose to list their social media handles. This allows for independence and self-promotion as well as humanizing the team members.
- Did you catch Lenny Lavigne on row 8? 10 points to Wistia.
What’s the first thing you notice when you visit CallRail’s homepage? Is it their chatbot or eye-catching call-to-action button? Maybe it’s the simple photo with a bit of color at the bottom that keeps you scrolling to uncover the entire graphic? There are so many things we love about this simple, customer-friendly homepage!
- There’s a phone number listen in the top left corner, but the chatbot is the star of the show. Chatbots are becoming a staple for online businesses because it prompts users to immediately engage. Instead of walking into a store, customers can talk with a representative in real time, online.
- If users aren’t ready to chat, their eye is most likely drawn an offer to start a free 14-day trial or keep scrolling to view the rest of the colorful graphic under the photo.
- Like Airbnb & MailChimp, CallRail also uses icons to catch your eye. These icons are also accompanied by short snippets of text with links helpful pages with long-form copy.
Before Designing, Ask Yourself These Questions
We hope these beautiful websites have sparked some inspiration for your next website revamp. But before you launch your new creation, ask yourself a few things:
- Are my new UX features slowing down my website or affecting my site’s health? If so, what plugins or systems can I put in place to offset this?
- Is my new website easy to use on mobile? Example: Is my chatbot pop up in the way of my menu button? Does the customer have to zoom in to click a button?
- Is my CTA direct and easy to find around multiple sections of a single webpage?
- How much information do I really need on this form?
- Am I using too much text or is my font too small?
- If I was a site user, would my site leave a lasting, positive brand impression?
Annie is one of our Account Strategists here at Xponent21. She works with our clients to formulate the perfect digital marketing strategy for their business and maintain a strong digital presence.
If you’re interested in redesigning your website but don’t have the tools or resources, we can help! Xponent21 specializes in creating user experiences that delight and deliver. You can take a look at our previous work or set up an appointment to discuss your vision. Let us help you create an online experience to showcase your brand and build a lasting customer base!