User Interactions and Flows

An affordance is what an individual expects can be done with an object given its properties and their own abilities. Designers should be aware of how people might perceive the potential uses of an object, based on past experience and convention, and design accordingly.

Skeuomorphism is a digital design style that imitates physical designs to reference a familiar pattern. As digital designers, we can build off physical design patterns that people already know to create the most intuitive designs possible.

Flat design is a digital design style that typically uses two-dimensional design elements and bright colors. This style of design can be cheaper, but can struggle with clear affordances. As digital literacy has increased and people have become more familiar with digital design, it has become more possible to use flat design while creating an intuitive user experience.

Design patterns are standardized solutions to common design problems. Designers should always consider the user needs and business goals of a product to choose the best design pattern. Design patterns tend to be more flexible than design components, and can include specific modules, flows, or behaviors.

Pattern libraries are repositories of reusable design patterns which focus on layouts that could include multiple components and focus on content structure. Pattern libraries can refer to both public listings cataloging design patterns from across the web, and internal pattern libraries used within a specific company’s design system.

Dark patterns are tricky or deceptive design patterns used in websites and apps that make users do things that they didn’t intend to. While dark design patterns may lead to short-term business gains, they ultimately diminish trust over time and do a disservice to the people using our designs.

Design systems are repositories of reusable components and patterns that can be used across a team or organization to ensure consistency across all design output. They often contain a style guide, a component library, and a pattern library.

Design components are specific examples of elements that might exist within a given context. For example, a button designed in accordance with the style guide for a specific website section would qualify as a component.

Style guides are often focused on visual design and branding, such as approved colors, logo treatments, and typefaces. Some style guides may include further guidance on written content, UX copy, or interaction design.

Component libraries are repositories of reusable design components that designers can easily copy into new designs. For example, if a designer needs to add a button to an input form, they could copy a component from the component library.