Experience and service design
95 terms, explained one by one
Concepts for creating useful, understandable and accessible experiences. Includes customer journeys, service design, interfaces and usability testing.
A
- AffordanceAn affordance is a possibility for action that arises from the relationship between a person and an object or environment.
- Alternative coloursAlternative colours are, in Material Design 2, colours additional to a brand’s primary and secondary colours that allow different themes within one product or product family.
- AppleApple is a technology company that develops devices, operating systems and digital services. Its ecosystem connects hardware products with software and services used by individuals and organisations.
- Aspect ratioAspect ratio expresses the proportion between the width and height of an image, video or container, such as 16:9 or 1:1. It helps define composition and available space.
- Atomic designAtomic design is a methodology by Brad Frost that organises interfaces into atoms, molecules, organisms, templates and pages.
- AutocompleteAutocomplete is a feature that suggests or completes what someone is typing based on the first few characters, saved data or predictions.
B
- BackdropA backdrop, in interface design, is a layer behind the main content that displays context or controls related to what appears in front.
- Background colourBackground colour is the colour of the surface on which content is presented. It helps organise areas and establish contrast relationships with text, images and controls.
- BreakpointA breakpoint is a condition at which the presentation of a responsive interface changes.
C
- Card sortingCard sorting is a research method in which people group content to show how they understand its relationships.
- Cognitive walkthroughA cognitive walkthrough is an expert evaluation method that analyses whether a person could learn to complete tasks in an interface.
- ColumnsColumns are the vertical divisions of a layout grid in which the content of a screen or page is placed.
- Content designContent design decides what information a person needs, when they need it and how it should be presented to help them act.
- Conversion formA conversion form collects the data needed for a person to complete an action, such as requesting information or signing up for a service.
- Customer experienceCustomer experience, or CX, brings together the perceptions formed throughout the whole relationship between a person or organisation and a company.
- Customer journeyThe customer journey is the path a person takes in their relationship with an organisation to achieve a goal.
- Customer journey mapA customer journey map represents the path a person takes to achieve a goal in their relationship with an organisation.
D
- Dark patternsDark patterns are interface decisions that hinder an informed choice or push people to act against their own interests.
- Density-independent pixels (dp)Density-independent pixels (dp, pronounced “dips”) are density-independent units of measurement used in Android and Material Design so that elements have a similar physical size on any screen.
- Design systemA design system brings together principles, components, styles and documentation to create consistent products collaboratively.
- Design tokensDesign tokens represent design decisions through named values, such as colours, spacing or typography.
- DesignOpsDesignOps organises processes, tools and collaboration so that design teams can work more consistently.
- Digital accessibilityDigital accessibility aims to ensure that people, including those with disabilities, can perceive, understand and use digital products and content.
- Digital designDigital design is the discipline that creates visual communication and interfaces intended for screens and digital environments.
E
- EmoticonAn emoticon is a representation of a facial expression or emotion made with text characters, such as :-) or :-(.
- Empathy mapAn empathy map organises observations about what a person says, thinks, does and feels in a given context.
- Empty stateAn empty state is the situation in which an interface has no content to show yet or finds no results.
- Experience frictionFriction is an obstacle or effort that makes it harder to progress towards a goal within an experience.
F
- Fitts's lawFitts's law relates the time needed to reach a target to its distance and size.
- Fixed gridA fixed grid is a layout grid with fixed-width columns in which the side margins grow or shrink to absorb any extra space.
- Fluid gridA fluid grid is a layout grid whose columns widen or narrow in proportion to the screen size, so that content fills the available space.
- Forward navigationForward navigation takes a person to a destination or step that develops the current task, such as opening a detail view from a list or continuing a form.
G
- Graphic designGraphic design is the discipline that arranges images, typography, colour and form to communicate a message visually.
- Gulfs of execution and evaluationThe gulfs of execution and evaluation, or interaction gulfs, are the gaps between what a person wants to do with a system and what the system lets them do and tells them.
H
- Happy pathThe happy path is the expected sequence when a person completes a task without errors or interruptions.
- HEART metricsHEART is a framework for evaluating experiences through happiness, engagement, adoption, retention and task success.
- HeatmapA heatmap represents the intensity or distribution of a variable using colours.
- Heuristic evaluationA heuristic evaluation reviews an interface against usability principles to identify problems and prioritise improvements.
- Hick-Hyman lawThe Hick-Hyman law relates choice time to the number and uncertainty of the available alternatives.
- Human-centred designHuman-centred design develops solutions based on an understanding of people's needs, abilities and contexts.
I
- Immersive commerceImmersive commerce is the use of technologies such as augmented reality, virtual reality, 360° video or 3D in e-commerce so that people can explore products in a way closer to the physical experience.
- Inclusive designInclusive design recognises the diversity of abilities and contexts in order to reduce exclusion when creating products and services.
- Infinite scrollInfinite scroll loads more content as the person moves down a page or list.
- Information architectureInformation architecture organises content, labels and relationships so that people can find and understand what they need.
- Input elementThe HTML input element represents different form controls according to its type. It can collect text, dates, selections and other values, and perform specific functions such as submitting a form.
- Interaction designInteraction design defines how a person carries out actions and receives responses from a product or system.
J
L
- Lateral navigationLateral navigation allows movement between sections or destinations at the same level of a structure. It may use tabs, bars or other controls according to the space available.
- Layout gridA layout grid is a structure of columns, rows, margins and gutters that helps to organise visual content.
M
- macOSmacOS is the operating system for Mac computers. It provides functions for managing the device and an environment for running applications.
- MarginsMargins, in a layout grid, are the spaces between the content and the left and right edges of the screen or container.
- MicrocopyMicrocopy is the short text that guides actions and explains states within an experience.
- MicrointeractionA microinteraction is a contained system response that accompanies an action or communicates a change of state.
- Mobile firstMobile first is an approach that starts the design of a digital experience from conditions of limited screen space and attention.
- MockupA mockup is a visual representation of a proposal that shows how it will look before it is produced or developed.
- Moment of truthA moment of truth is an interaction that has a particularly significant influence on a person's perception of and relationship with an organisation.
- MOOCA MOOC is an online course designed for broad participation and a form of open access under its terms. It may combine materials, exercises and spaces for interaction.
N
O
- On coloursOn colours are colour roles for content placed on an associated surface, such as on-primary for content displayed on primary. The name expresses a relationship between roles.
- OnboardingOnboarding supports a person at the start of a relationship or while learning about a product, service or organisation.
P
- PaddingPadding is the internal space between the content and border of a CSS box. It separates text, images or controls from their surrounding edge.
- Persuasive design patternsPersuasive design patterns are design solutions that attempt to encourage an action through cues, information or incentives. They can help people complete a task or sustain a habit.
- Phygital experienceA phygital experience connects physical and digital interactions within a single journey.
- Pixel densityPixel density expresses the number of pixels within a physical length, usually in pixels per inch, or PPI. It relates resolution to the size of a screen or a reproduced image.
- Plug and playPlug and play is a system’s ability to recognise and configure a device automatically as soon as it is connected, without the person having to install or adjust anything manually.
- Primary colourThe primary colour is the colour assigned a leading role in an identity or interface system. It may signal actions, support recognition or highlight elements according to the design rules.
- Progressive disclosureProgressive disclosure presents information or controls when they are needed, avoiding showing all the complexity at once.
R
- ReadabilityReadability is how easily a text can be read and understood because of its vocabulary and sentence construction, regardless of typography.
- Responsive croppingResponsive cropping adjusts an image's framing to its display space. It seeks to preserve what matters when the screen format changes.
- Responsive designResponsive design adapts the presentation of an interface to the space and conditions of the device it is used on.
- Reverse navigationReverse navigation is moving backwards between screens, either chronologically, returning to what was seen before, or hierarchically, going up a level in the app’s structure.
S
- ScrimA scrim is a visual layer that reduces the prominence of the content beneath it or improves the contrast of an overlaid element. It may be uniform or use a gradient.
- Secondary colourA secondary colour complements the main roles in an identity or interface. It can help distinguish content or introduce variation within a coherent palette.
- Service blueprintA service blueprint represents how a service is delivered by connecting the user's actions with the organisation's people, processes and systems.
- Service designService design organises people, processes, channels and resources to deliver a useful and viable experience.
- SnackbarA snackbar is a brief message that appears temporarily at the bottom of the screen to report a process the app has carried out or is about to carry out.
- Surface colourSurface colour is, in a design system, the colour applied to components that hold content, such as cards, sheets, menus or dialogs.
- System Usability ScaleThe System Usability Scale, or SUS, is a ten-item questionnaire used to collect a rating of perceived usability.
T
- TaxonomyA taxonomy organises concepts or content through defined categories and relationships.
- TouchpointA touchpoint is a specific interaction between a person and an organisation, brand or service.
- Tree testingTree testing evaluates whether people can find information in a navigation structure presented without the visual design.
U
- UsabilityUsability describes how easily specific people achieve goals with effectiveness, efficiency and satisfaction in a context of use.
- Usability testingUsability testing observes how representative people carry out tasks with a product, service or prototype.
- User experienceUser experience, or UX, brings together the perceptions and responses that arise from using or anticipating the use of a product, system or service.
- User flowA user flow represents the actions and decisions needed to complete a task within a product or service.
- User interfaceThe user interface, or UI, is the set of elements a person interacts with to use a system.
- UX auditA UX audit reviews an experience to identify problems and opportunities related to user and business needs.
- UX writingUX writing is the practice of designing the text that helps people use a product or service.
V
- Vertical spacingVertical spacing is the separation that organises elements along the vertical axis of a composition. It helps group content, distinguish sections and establish a reading rhythm.
- Visual searchVisual search uses an image as input to find information or related items. It can recognise objects, compare shapes or retrieve images with similar characteristics.
- Voice searchVoice search uses speech as the input for a query. The system interprets that input and returns information through an interface that may combine voice and a screen.
- Von Restorff effectThe Von Restorff effect, or isolation effect, describes how an item that stands out within a group can be easier to remember under certain conditions.