Join 40,000+ sales and marketing pros who receive our 4x a week insights, tips, and best practices.
Thank you! You have been subscribed.

Free Guide: The Ultimate Inbound Marketing Strategy Playbook 2022

Download the Playbook
Fill out the form to get your playbook
Thank you! You have been subscribed.
The Ultimate Inbound Marketing Strategy Playbook 2022

Free Guide:

The Ultimate Inbound Marketing Strategy Playbook 2022
Read the Playbook
The Ultimate Inbound Marketing Strategy Playbook 2022
Free Inbound Marketing Playbook
View The Ultimate Inbound Marketing Strategy Playbook 2022
The Ultimate Inbound Marketing Strategy Playbook 2022

Free Guide:

Take your inbound strategy to the next level

  • Master the 7 principles of highly effective inbound marketing
  • Dramatically improve your inbound sales
  • Get more buy-in at your company

User Experience Design: 4 Essential Elements & Awesome Resources to Save

By Britt Schwartz

Britt Schwartz also recommends this free guide: The Ultimate Inbound Marketing Strategy Playbook 2022.

User Experience Design: 4 Essential Elements & Awesome Resources to Save

When it comes to user experience design (UXD), my main source of inspiration, Steve Jobs said it best, “Design is not just what it looks like and feels like. Design is how it works.”

As marketers, we design user experiences every single day, whether we’re aware of it or not. Each time a prospect visits your landing pages, uses your site navigation, and even fills out a form, they’re interacting with your UX design.

Free Guide: The Ultimate Inbound Marketing Strategy Playbook 2022

Now, you may not be a professional graphic designer or UX/UI designer and that’s okay, but it’s vital that you’re aware you are design experiences for your site visitors and they could be awful ones.

Don’t fret, you don’t need to go to school for four years to understand the fundamentals of good user experience design and apply it to your marketing.

Here, I’ve broken down the four most important elements of user experience design (from the lens of a marketing strategist). Use these elements in every new change you make to your website to ensure that you’re creating the experiences you intend to for your visitors.

They’ll thank you for it by returning to your site and actually engaging with it, but first, let's answer the obvious:

What is User Experience Design?

User experience design is the strategic combination of best practices in usability, function, accessibility, and overall ease of, when designing and developing a product.

In other words, it is the strategic planning of how people interact with a product and putting particular pieces in place to make it happen as easily, naturally, and even fun, as possible. 

For the case of this blog, your product is your website. 

4 Elements of User Experience Design

1. Strategy

Being a strategist by trade, it’s only natural my first recommendation is to think about the strategy of the page/site you’re creating.

Strategy is never something that can be glossed over, skipped, or paired down just to get to the “real” work quicker. It can be frustrating to feel like progress isn’t being made or to not have a tangible design to show for the efforts of your work, but skipping this phase carries risks you should never be willing to take. A well-designed or built website is not your end goal in user experience design: your end-goal is achieving the business goals you’ve outlined with your stakeholders.

So, what exactly does strategy mean in this case?

The strategy phase for user experience design consists primarily of answering these three questions:

1) Who Is This For?

If I had a nickel for every time I had to convince a company their website wasn’t about them -- I’d have a lot of nickels.

Yes, your website showcases who you are, what you do, why you do it, and that you’re the best at it - but none of that really matters unless you first create an experience designed for your buyer personas.

Everything we, as digital marketers, do should directly tie back to those we are ultimately serving - our personas. This includes our user experience design.

Understanding who is coming to the site/page and what they are trying to accomplish will direct every decision to you have to make.

Don’t build personas and leave them in Google Drive. Build personas so rich that you could picture them as a real person and then filter everything you create through their point of view.

2) What Is The Purpose of This?  

Once you understand WHO this page/site is for, you’ll need to understand why this piece will exist?

Does this page exist to provide information? If so, what information?

Each page on your site, including landing pages, should always start with a purpose. Deciding on the purpose of this page early on will guide you as you work through the following elements of user experience design.

3) What Should the Visitor Do?

You now know who this page is for and why it exists, now determine the what. What action do you want your visitor to take when visiting this page?

Never leave your visitor unclear about what you want them to do next. Consider the logical next-steps that would help your persona complete their goals.

There are a lot of ways that you can denote the actions and provide that direction and you don’t have to figure that out now, but you do need to understand where this page fits in the journey and what comes next.

2. Foundational Requirements

When you’ve answered all the strategy questions and you understand the who, why, and what, it’s time to scope out what will be on the page.

User experience design combines the look, feel, content, graphics, and development requirements and creates a complete solution. Scoping is the second step to creating that solution.

There are a few different requirements to flesh out during the scoping phase:

Content Requirements

In order to fulfill the purpose of your page, you need to determine the content requirements of the page. Don’t read content as written copy.

Written page copy is one type of content that will most likely be present on the page, but don’t neglect imagery and video.

You don’t have to write the copy or have the videos shot during this phase, but having a shopping list of what will be needed in order to complete this page is vital.

With your content requirements in hand, you can plan how and when the content will be created and what it should say.

Functional Requirements

If the content is the story, the functional requirements are how we tell the story. A few things to consider are:

  • Will your images need to slide or be in a lightbox?
  • Will parallax be a feature you’d like to use?
  • If using video, how will that work?
  • Should your page include hover elements?

Similarly to your content requirements - having a list of what you need the page to do in terms of function before moving on.

3. Skeleton

While each element of user experience design is important, the structure phase is, in my opinion, the most important.

Structuring your page combines the strategy, content, and functions elements and begins to layout what this will actually look like.

Wireframing is an essential step in laying the structure of your page and being able to visualize how it all comes together.

Your wireframe should NOT be a design, fully-fleshed out with colors and functions, instead really focus on how you’re presenting the information to your personas to help them reach their goals.

A few things to consider when wireframing your page:

4. Surface

If the structure phase of user experience design is the most important, then the surface elements are my favorite!

This is where your graphic designer really gets to shine their talents in combining the strategy, purpose, requirements, desired actions with design best practices to create the visual representation of the page.

Your branding, color choices, and imagery selection should all be directed toward solving for these points:

  • How your visitor will move around (navigate) your page/site.
  • What visual elements should be represented (graphic, photography, etc.)
  • How interactive elements will be communicated visually to the user
  • How the information will best be consumed and understood

The final result of your surface elements will be a completed design of your page. You should be able to speak to every element present, answer why it’s there, what action it should drive for your visitor, and ultimately who this is for.

Non-Designer User Experience Design Resources

Successful user experience design doesn’t require that you get all the elements right for every single person who will visit your site. It means that you’ve considered the intention of each page, who it serves, and applied best practices to the structure and design of your site.

As a non-designer, I use a lot of resources to help me understand what should and should not be on the pages that we build. A few of my favorites are listed below!

Hotjar: HotJar is a great tool for testing how your finished product performs in the real world. With heat mapping, scrolling and click data, and the ability to launch surveys, I use HotJar to review how new or changed pages resonate with our visitors.

HubSpot: HubSpot has a lot of great articles about creating user experiences and the best practices to follow. This is one of my favorite articles in applying UXD to landing pages.

User Testing: Who better to tell you if the page you’re working on will connect with your persona than your actual persona? allows you to crowd source feedback from an audience matched with your persona criteria. Submit your page and/or site and listen to the feedback that you’re hearing and implement improvements to your user experience based on what you learn.

The Ultimate Inbound Marketing Strategy Playbook 2022

Free Guide:

The Ultimate Inbound Marketing Strategy Playbook 2022
Read the Playbook
The Ultimate Inbound Marketing Strategy Playbook 2022

Free Guide:

The Ultimate Inbound Marketing Strategy Playbook 2022

Take your inbound strategy to the next level

  • Master the 7 principles of highly effective inbound marketing
  • Dramatically improve your inbound sales
  • Get more buy-in at your company


User Experience
Published on August 17, 2017

Recent Articles

23 of the Best Examples of Business Blog Design
May 30, 2022 • 13 min read
Inclusive UX: What it is and 11 smart examples from brands leading the way
April 13, 2021 • 7 min read
The 17 Best Internet Easter Eggs You’ve Got To See
April 4, 2021 • 5 min read
12 blog layout best practices to remember in 2021
March 11, 2021 • 13 min read
31 best parallax website examples to inspire you in 2021
January 19, 2021 • 10 min read
12 Essential Tips for Improving Your Web Design in 2022
December 23, 2020 • 16 min read
7 graphic design trends that will dominate 2021 [Infographic]
November 28, 2020 • 5 min read
Expert tips on designing for color blindness — from a color-blind designer [Infographic]
October 11, 2020 • 2 min read
How brands are adapting their customer experiences to COVID-19
September 19, 2020 • 3 min read
55 key design and UX stats to guide your next website redesign (Infographic)
September 12, 2020 • 2 min read
The best website font size, and how it affects UX and conversions
September 4, 2020 • 11 min read
How dark mode impacts UX and web design (+ examples)
August 25, 2020 • 6 min read
Google’s Lookout app now capable of scanning long documents and food labels
August 14, 2020 • 3 min read
How does the rise of dark mode impact your email marketing templates? (+ examples)
August 13, 2020 • 6 min read
Like a Leo: 30th anniversary of ADA highlights website accessibility importance
July 31, 2020 • 3 min read
21+ best 404 error page examples (+ must-know best practices)
July 21, 2020 • 13 min read
What Netflix can teach us about font psychology and branding [Infographic]
July 18, 2020 • 4 min read
How to use Gestalt Principles for a more powerful business website [Infographic]
June 20, 2020 • 3 min read
Redefining user experience in wake of COVID-19 Ft. Bob Berry of ItsTheUsers (Inbound Success, Ep. 143)
May 18, 2020 • 28 min read
Website accessibility: Is your company at risk for an ADA-compliance lawsuit?
May 4, 2020 • 15 min read
How to improve your high-converting forms in 2020 [Infographic]
March 28, 2020 • 2 min read
HubSpot and GDPR: Common problems and how to fix them
February 27, 2020 • 9 min read
Designer and developer love: 6 tips for better collaboration [Infographic]
February 16, 2020 • 2 min read
How we aligned our design and development team and improved efficiency
February 4, 2020 • 6 min read
How one of the hardest times of my life was made worse by poor UX/CX
February 3, 2020 • 12 min read