August 22, 2018 / Luke Prosser

Explaining Commonly Used UX Design Terms

A glossary for understanding the web design process at Ackmann & Dickenson

At Ackmann & Dickenson, we work with clients across a variety of industries on user experience design — or UX design. Whether coming to us with a formal design request for proposal or looking for fresh perspective on their current interface, we follow a thoughtful and diligent path and process.

In talking with prospective clients, we explain our approach, including the steps in the design and the philosophy on creating a user interface. However, while working through different UX design projects, we have found that industry-specific terms sometimes lead to an ambiguous understanding for someone outside of the industry. When someone asks, “What is UX?”, that’s when I know I need take a step back and break down some common UX terms. While these terms may make perfect sense to someone operating in the design world each day, it’s completely understandable that they may not be second nature to clients.

If you have ever found yourself googling, “What is UX?” or wondering why someone is throwing “MVP” around when not talking sports, then this post should come in handy. Below, we’ve outlined common UX terms and phrases to help clients build familiarization.

Analysis

Likely, this word is already familiar. However to start off this list of UX terms, I want to explain what analysis means in the context of design. Before any project, starting with analysis is key to success. A quality analysis includes researching competitors, keywords and existing data, followed by formulating a hypothesis of how to solve the existing website problems.  If the analysis phase is skipped and we go straight to design kickoff, we may end up back-pedaling, wasting valuable time. Ultimately, if analysis isn’t performed effectively, this step will have to be repeated later in the design process.

Information Architecture (IA)

Information architecture refers to the structure and steps for how information is presented on a website. Information architecture has a direct impact on how users navigate the site. Considering what constitutes a quality user experience plays a major role in determining the information architecture. At A&D, we discuss information architecture fairly early on in the process, after we have built an understanding of a client’s business and goals.

ackmann-dickenson-site-map
Example of a site map for building and informing the information architecture.

 

Two common terms used in the process of defining information architecture include site mapping and card sorting. Card sorting is a technique used to determine the information architecture; with card sorting we’re crafting a category tree, complete with major and sub-categories nested into one another. A sitemap refers to the hierarchical list of pages and links that inform both users and search engines on how a website should be navigated.

Prototyping

One early phase of the design process is prototyping, in which we create lightweight versions of a website. Creating prototypes allows us to jump in and gather various levels of input and feedback as soon as possible. Clients will likely see a few prototypes throughout their web design process.

When prototyping, we present high-fidelity wireframes; this term is also useful to understand. High-fidelity wireframes include color, branding and other visual elements, removing as much ambiguity as possible without creating the completely detailed, near-final product — example included below. In contrast to low-fidelity wireframes, which can include gray boxes and placeholders, high-fidelity wireframes are a better medium through which clients can provide feedback. High-fidelity wireframes have a level of creative representation, so clients can provide feedback on aesthetics before we go too far down the wrong path, preventing us from potentially missing the mark and wasting precious time.

ackmann-dickenson-example-prototype
Example of a high-fidelity wire frame, used in providing an early understanding of what the interface will look like for clients.

Minimum Viable Product

A minimum viable product, or MVP, is the simplest core feature set of any product or website design that allows it to be deployed. The most popular definition is: “The smallest thing you can build that delivers customer value (and as a bonus captures some of the value back).” In the web design process, we try to strike a balance between a high-fidelity prototype and a good MVP, so we can learn and adapt most quickly.

Related Reading: Learn how Evereve created a minimum viable product to start testing key functionality in their redesign.

Usability Testing

At A&D, we take building user-friendly websites seriously, ensuring sites are easy to navigate for everyone. Creating something user-friendly starts with usability testing, in which we carefully consider how someone interacts with a site. An example of usability testing is asking someone to navigate from the homepage to the login page; if this action isn’t intuitive for them, we take notice. This testing and consideration helps in deciding where design tweaks need made, ensuring websites are intuitive and user-friendly.

Agile UX

Agile UX is a term used when first explaining our design process to clients. Basically, the guiding principle of agile UX is asking, “How can we get there and who do we need in the room to get there as fast as possible?” From there, we identify the small steps in between those end states. Agile UX allows us to quickly identify and correct problem areas, rather than waiting for a grand reveal of a final product that may have issues that could have been avoided.

Module

When building a client’s website, we aim to build a structure; we provide all the pieces needed for a client to walk away and build another website with a similar aesthetic. These pieces are called modules; examples include elements like a photo carousel, button or contact form. The system of modules are strategically aligned with a specific business’s needs, providing all the pieces to build another website. For example, in this PHS West example below, the stylized buttons, header images and content blocks are all modules that could be adapted to create a new landing page for their website.

ackmann-dickenson-module-example
Example of a modular approach to creating visual elements on a website.

 

As a firm, we understand you may want to take things in-house after your initial request for proposal and the project is done. However, as partners, we want to ensure you’re set up for success. These modules make up a larger system, so if you need to go and create something new or hire a designer of your own, all the pieces to create and make updates as you need are there. Our goal is producing module systems to set you up for future success.

Mobile-First Design

With insights from Google, we know over half of overall website traffic comes from mobile. When referencing the UX design phrase mobile-first design, we simply are emphasizing the creation of a user interface that adapts well and accommodates users who may be browsing on their mobile phone. Technically speaking, this approach relies on a 12-column grid so no matter the medium you view from, whether a desktop, a tablet or a phone, the layout of the site responds accordingly, leading to a better all-around user experience.

Mobile-first is also an approach used in design. Simply put, it stresses the importance of placing priority on structure and alignment within a page layout. This approach is used to ensure intentionality around enticing the user to take action. For example, in mobile-first design, we might restructure a page to put a call to action in a more natural spot guiding a user down a designated path, even if this restructuring impacts the original layout of the page.

When considering mobile-first design, the term accessibility often gets used. Is the layout accessible to a user no matter the means by which they view the design? At the end of the day, if the website isn’t generally ‘accessible’ then it won’t leave the user with as positive of an impression.

Heuristics (or Heuristic Evaluation)

Our final UX term in the design process that may cause confusion is heuristics. Heuristics, or heuristic evaluation, is comparing the user interface that’s been created against general usability principles. Basically, going into a website redesign process, we work to understand the client’s audience and goals. This will inform the larger process, but also help in forming these principles for performing a heuristic evaluation.

For example, consider a green button on a lighter green background. While this may look visually appealing, the combination of green on green may cause confusion for users — which would be concerning for us. We would then consider changing that button color to ensure the interaction was more natural for the user.

When understanding what heuristics refers to, it may be helpful to understand the differences and similarities in interactive design and visual design. Interactive design is slightly less concerned about aesthetics and more focused on understanding data and interactions users have on the website. However, when considering a visual design perspective, the goal is more focused around making a site visually appealing. Both perspectives are critical to ensuring a beautiful, usable end product. However the interactive design perspective will ensure the visual decisions were user-friendly in a heuristic evaluation.

Related Reading: Usability & Design for Healthcare Technology

Putting the terms into practice

The design process is not linear. Creating an inspiring, engaging new website or interface calls for careful consideration and feedback. In working with clients, whether they come with a request for proposal outlining an entirely new site or simply need a few landing pages for ads, we take a thoughtful and diligent approach to the process. Understanding the process and industry-specific terms can ensure that feedback and consideration throughout creation moves along as expected.

If you are interested in learning more about Ackmann & Dickenson’s capabilities or submitting a request for proposal of your own, please reach out. My name is Luke, and I lead the design team here. I’d love to talk to you and learn more.