UI/UX Terminology

Call to Action (CTA)

For designers and content creators, the CTA is the word or phrase that stimulates users to interact with a product in the way it is designed for. CTA elements are the interactive controls such as buttons, tabs, or links that enable users to perform the expected action.

User Scenarios

Hypothetical circumstances used to frame and prompt the user to follow or pursue a particular task path.

F shaped pattern

Users often read Web pages in an F-shaped pattern: two horizontal stripes, followed by a vertical stripe. In a few seconds, their eyes will move at amazing speed across your website's words in a one-of-a-kind pattern.

User Interface (UI) / Graphical User Interface (GUI)

What the user sees. This can be a set of commands or menus through which a user communicates with a program. It is also the space where interactions between humans and machines occurs.

80/20 rule

20% of the functionality and features in any environment will be responsible for 80% of the actions taken within that environment. This is Pareto principle as applied to any website, web app or software environment.

User Experience (UX)

A broad term that includes several disciplines that study the effect of design on the ease of use and level of satisfaction with a product, site or system.

Flat Design

A design philosophy based on simplicity and functionality. There are no techniques used to convey depth: no gradients, shadows, textures, and highlights that give a realistic view of the object. Basically, flat design refers to the basics of graphics — bright colors, simple forms, buttons, and icons.

Fishbone Diagram

A diagram designed to identify cause-and-effect relationships between factors in a given situation. In short, it consists of a "head", which states a problem, and bones along the spine that represent factors and categories of factors.

Mindmap

A diagram used to visually organize information. A mindmap is hierarchical and shows the relationships among the parts of the whole. It is often created around a single concept to which associated images, words and parts of words are added. Major ideas are connected directly to the central concept, and other ideas branch out from those.

Sketching

A drawing which designers use to propose, explore, refine and communicate ideas. As a UX designer, you too can use sketching as your first line of attack to crack a design problem.

Focus Group

A focus group is a pointed discussion with a group of participants led by a moderator. Questions are designed to gather feedback about users, products, concepts, prototypes, tasks, and strategies.

Clickstream Analysis

A form of Web analytics. Clickstream analysis is the tracking and analysis of visits to websites. This analysis reports user behavior such as routing, stickiness, where users come from and where they go from the site.

Fitt's Law

A mathematical model that predicts how long it will take to point at a target based on the target's size and proximity. The further away and smaller it is, the longer it will take for users to interact with it.

Golden Ratio

A mathematical ratio with origins in ancient Greece, also known as the Greek letter Phi. It is found in nature, and has made its way into graphic and print design as people deem it to be the most visually appealing layout to the human eye. The Golden Ratio approximately equals 1.618. We find it when we divide a line into two parts so that the full length divided by the long part is equal to the long part divided by the short part.

Mockup

A medium or highly detailed static representation of the design. A good mockup demonstrates the information structure, content and basic functionality in static form. Moreover, mockups make it easy to perceive the idea of the final product, and the process of mockup creation is less time-consuming compared to prototypes.

Diary Study

A research method that involves providing participants with the materials and structure to record daily events, tasks and perceptions around a given subject in order to gain insight into their behavior and needs over time.

Wireframe

A simplified sketch of the important information on a page. Also known as page architecture, page schematic, or a blueprint. Basically, it's a skeleton of the design and should contain all the important elements of the final product.

Grid

A system of horizontal and vertical lines providing a structural basis for page layout and design. It communicates order, economy and consistency. The grid provides a common structure and flexibility for organizing content.

5 Second Test

A technique that involves showing users a single content page for a quick 5 seconds to gather their initial impressions. Users make important judgments in the first moments when they visit a page. It gives the team insight into essential information about the page.

60-30-10 Rule

A timeless decorating rule that can help you put a color scheme together easily. To put it short, the 60% + 30% + 10% proportion is meant to give balance to the colors used in any space.

Customer Journey Map (CJM)

A tool companies use to see what their customers truly want. A customer journey map tells the story from initial contact through to engagement and the long-term relationship. It may focus on a particular part of the story, or give an overview of the entire user experience. It talks about the user's feelings, motivations and questions for each of these touch points.

Dots Per Inch (DPI)

A way to measure the density of a print or video image. The number of differently colored dots that can fit into a one-inch space provides information about the resolution of an image. If an image is not of adequately high quality, it may not be able to be resized or printed without a loss of resolution.

User Centered Design (UCD)

An approach to designing a product or service (user interface design), in which the end user is in the center of the process.

Scalable Vector Graphics

An imaging application and language written in XML. The SVG interface offers a solution to the problem of sharing many sophisticated Web-based images and animations.

Brand Book

An official corporate document that explains the brand's identity and presents brand standards. Besides the design aspect, brand books may include a company overview and communication guidelines as well.

Breadcrumbs

Breadcrumbs are a navigation element that allows users to orient themselves within a Web site or move to one of the intermediate pages. It is usually placed near the top of the page (generally, right under the browser's address bar). Actually, it allows users to find their way to the homepage.

Heat Maps

Color-based representations of areas of interest/focus points; generally associated with eye-tracking software.

Corporate Identity Guideline

Defines how your company's brand, image and messaging are delivered to the public and particularly to your key audiences. The corporate identity guideline positions the company, no matter how big or small. The rules for consistent typography, color use, and logo placement are all laid out in the corporate identity manual.

Onboarding

Designing a welcoming experience for new users by easing them into it. The design of the onboarding process for your site is usually limited to a first-time use scenario.

User Experience Design (UXD)

Designing software products and systems to be useful to a set of end users. It is a broad concept applied during the design process. UX design covers the technical use of a product or service and its essential physical interface.

A/B Testing

Determining which of two alternatives is preferred by the target audience.

Landing Page

It is the Web page a given user goes to after clicking a link, also known as the Target or Destination page.

User Engagement

It represents the purposeful choices a user makes with website content. Engagement is how people get value from the site.

Minimum Viable Product (MVP)

MVP is a product with enough features to meet the needs of early customers. This strategy provides feedback for future product development.

Context of Use Analysis

Observing users' behavior often helps create a website that supports their day-to-day activities. Context of use analysis studies personas, user flows, wireframes, the content map, the site map, and the content strategy.

Prototype

Often confused with a wireframe, a prototype is a medium or a highly detailed representation of the final product. It simulates user interaction with the interface and allows the user to rate the content and interface and test the primary options for communication with the app. Though, prototype may not look exactly like the final product, but it definitely should not be sketched in shades of gray. In addition, interactions must be modeled in a way that closely mimic the final product.

Gestalt Principles

People do not visually perceive items in isolation, but as part of a larger whole. These principles account for human tendencies towards similarity, proximity, continuity, and closure.

Responsive Web Design (RWD)

RWD provides an optimal viewing experience across platforms and devices. The content and layout of a website should efficiently adapt to the sizes and technical abilities of the device it is opened on.

End Users

Refers to those people who use a website or those who are participants or subjects of research studies.

Eye Tracking

Specialized hardware and software that tracks users' point of vision on an interface. Namely, it tracks where users focus their visual attention while viewing an interface.

Persona

The creation of a representative user based on available data and user interviews. Though the personal details of the persona may be fictional, the information used to create the user type is not.

Color Contrast

The difference between two colors. Black and white create the highest contrast possible. Colors can contrast in hue, value and saturation. You usually want a high contrast between text and its background color. But too high contrast between design elements might give an unsettled and messy impression. Effective use of contrast is the essential ingredient that makes the content accessible to every viewer.

Customer Experience

The feelings of a customer generated by his or her interactions with a supplier's employees, systems, channels or products.

Card Sorting Method

The goal of card sorting is to understand how a typical user views a given set of items. Designers write items on individual paper cards, and then ask users to group together similar cards. Card sorting helps to create websites that are easy to navigate.

Acessibility

The measure of a web page's usability by persons with one or more disabilities.

Web Analytics

The measurement, collection, and analysis of the internet to understand and optimize web usage.

Information Architecture (IA)

The organizing of information, including site hierarchies, web content, labeling schemes and navigation. IA makes it easy for people to find, understand and manage information.

Conversion Rate

The percentage of visitors that complete a targeted transaction online.

Interaction Design (IXD)

The study of how a user interacts with a page, application or product. IXD facilitates the actions we want to take with any given system.

3-Click Rule

The theory that users will abandon a website if they are unable to complete their task within 3 mouse clicks.

Micro-copy

The ubiquitous text that turns up in tiny chunks on a webpage or in an application when you need it. It can be the label on a field, a quick set of instructions on what button to push, etc. It's the tiny text on which much of the product's UX hinges. Micro-copy provides those just-in-time clear instructions.

White or Negative Space

The use of blank (unmarked) space on a page to promote content and navigation. To be precise, when the products or pages have enough white space, it helps them feel uncluttered, elevates them, and makes them feel special. And it makes people want to take a closer look.

Color Wheel

This circle shows the relationships between primary colors, secondary colors and tertiary colors. Artists and designers use red, yellow, and blue primaries arranged at three equally spaced points around their color wheel.

Vertical Rhythm

This concept originated from print typography. Vertical Rhythm keeps the vertical spaces between elements on a page consistent with each other. This is often done with the help of a baseline - a common denominator used to create the consistent spaces.

Data-Driven

This means using all the available data: analytics, A/B tests, customer service logs and social media sentiment to develop a better understanding of UX. There are common misconceptions that user experience is purely an art, but there is a lot more involved. Understanding how to collect and process data is one of the key tasks you have to face as a UX designer.