Art is subjective. Experience Design decisions must be founded on psychology or a philosophic basis. Despite using creativity to solve a challenge, this article tows the line between sensationalizing a design for the means of selling it, and calming down excited designers to meet the needs of their audience.

Ultimately, different types of people like different types of experiences and want to see the world become more aligned with their values.

My department’s purpose is to create the highest fidelity visual representation possible that is supported by well presented documentation. This article can be a source for continued improvement toward the perfect interactive design hand-off. Follow along as I detail all of the stages from concept to the final deliverable, and define terms for alignment on key vocabulary.

After completing this article you will have a clear understanding of the different levels of design fidelity and you’ll be able to communicate interaction design work with your team and the client.

Levels of Fidelity

It is crucial to the success of an Interaction Design project that everyone on the design team agree on what the word “fidelity” means to the extent that they can identify what level of fidelity a design belongs to. With stationary graphics the concept of fidelity is black and white and relates to how much like the final version it is, as if it were simply a color by number. But since interactions require time to experience them, any level of fidelity must include time as a component. That said, before we can definitively classify our levels of fidelity, we first need to align on the levers and components that are used to describe how much interactivity a concept should have. In other words, what are the “dimensions” of interactivity.

Dimensions of Interactivity

Not all digital experiences need to be highly interactive. It is case by case, and knowing how far an interaction design idea should be pushed into the realm of “highly interactive” requires knowing how to measure an audience’s aptitude for cognitive stimulation.

Here are the dimensions that contribute to the proper determination of the right amount of interactivity.

Perception of latency

In computing, the word “latency” describes the delay before a transfer of data begins following an instruction for its transfer. If the delay is long, the perception is that it is less responsive to us, and that is to say it has a high latency. High = Bad, Low = Good

Individuals tend to perceive the Web as having low latency when they maintain a dense social network. This suggests that a person's perception of a communication medium's latency is shaped by the social groups they interact with regularly.
An individual's perception of the web's fluidity stems from their prior knowledge and experiences, shaped by the social structures they have engaged with.

Need for Cognition (NFC)

An individual’s Need for Cognition score reflects their tendency to “engage in and enjoy thinking”(Cacioppo & Petty, 1982, p. 116). Individuals with high NFC have been found to be prone to processing information intensively, and have been shown to be more open to engaging experiences. While those with low NFC tend to focus on the peripheral aspects of messages. More about the NFC Scale here.

Immersion

Immersion refers to the extent to which an experience creates the illusion that the user is interacting with the environment around them. At one extreme the mappings can be completely arbitrary like waving your hand to adjust the volume. At the other end of the spectrum, mapping may be completely natural like turning a steering wheel on an arcade video game to make the “virtual car” turn. Familiarity reinforces trust.

Perceived Responsiveness and NFC are discovered through customer interviews and desk research. Immersion is derived from the first two.

Categories of Fidelity

The term “fidelity” in our case is the quality to which a topic is represented. There are 3 levels of fidelity for each of these categories that make up an interaction design project: concept, interactions, copy writing, visual design, responsiveness, and hand-off deliverables. Here are the breakdowns for what each level of fidelity are for those categories

Concept

Low fidelity concepts answers the question “What if…”
Medium fidelity concepts describe a vision for what someone can do.
High fidelity concepts are compelling stories connected to a fully annotated user journey.

Interactions

Low fidelity interactions are descriptions of intended feedback loops.
Medium fidelity interactions is a video that illustrates the type of interactions that are intended.
High fidelity interactions are videos with proper easing curves & documentation of all the interactions.

Copy Writing

Low fidelity copy writing is lorem ipsum or rough description placeholder text.
Medium fidelity copy writing is a content document with text lengths defined.
High fidelity copy writing is the final copy ready to be reviewed by the legal department.

Visual Design

Low fidelity visual design uses geometric shapes to represent elements on the screen and lines to represent text.
Medium fidelity visual design uses brand colors, low/medium fidelity copy writing in place.
High fidelity visual design is Pixel perfect visuals of all screens with high fidelity copy writing.

Responsiveness

Low fidelity responsiveness includes a statement articulating the goal for what the purpose is at each breakpoint
Medium fidelity responsiveness includes an mp4 that illustrates what happens when screen size changes. This could also be a Rive file.
High fidelity responsiveness is high fidelity visual design for each breakpoint and documentation for developers

Handoff

Low fidelity handoffs include flat designs of key pages with no animation, hover states, or formal documentation on responsiveness.
Medium fidelity handoffs include high fidelity visual design, but everything else in medium fidelity.
High fidelity handoffs include high fidelity states of all categories.

Definitions for Levels of Fidelity

Every project should take each category through the fidelity chain to the extent that it satisfies what the highest agreed upon fidelity is. The official recommendation for using the terms Low, Medium, and High to describe design fidelity is as follows.

Low Fidelity

Early concept media used to point the idea in the general direction. Start conversations about goals of the interactions, and gauge the importance of each category of fidelity.

Medium Fidelity

As the project advances medium fidelity content clearly illustrates what the interaction is going to feel like to use, but the decorations are minimal.

High Fidelity

Everyone is on the same page about what has been created, the concept, design, copy, and interactions, have all been approved and what’s left is the decoration of the pixel perfect illustrations

Higher than High Fidelity

The final deliverable is one step above High Fidelity. Not only is the design approved. but a package is compiled of all of the relevant documentation. The packaging and delivery of this final package has it’s own level of fidelity - A deliverable can be as simple as .ZIP of all the files, or as complex as an interactive demo website hosted on a password protected site I control. This step is the last touch point with the client before payment - and good customer support goes a long way in creating loyal customers who want to start another project.

Decide on Fidelity in the Scope Document

When budgeting, consider the team’s skills and whether they have experience delivering the required level of fidelity. Adjust expectations based on the agreed price. If the client needs higher fidelity sooner, they can pay to prioritize a senior designer for support.

Selling Interactivity to Clients

User testing belongs at every level of fidelity and the assumptions about complexity of the navigation should be tested often to maintain validity of the design decisions and maintain high confidence. Response rate to survey inquiries increases when there’s a monetary incentive. $5 will increase survey response rate by 50%, but the more affluent your audience is, the more their time will cost. I’ve seen good action $25-$50 per half hour of discussion, or per 10 multiple choice questions.

Questions like, “Would you buy this product after looking at this website...” are not enough. Watch for moments of confusion denoted by time scanning the page, reading the content. Are they enjoying the discovery process, or are they slowing down? Use the score card below to rate a user’s attitude during the test.

From Concept to Final Interaction: Designing with Fidelity in Mind

Incorporating the Need for Cognition (NFC) Scale and user behavior evaluations into the design process ensures that decisions are user-centered and evidence-based. Here's how to integrate these tools effectively:

1. Assessing Users' Need for Cognition (NFC)

The NFC Scale measures an individual's propensity to engage in and enjoy effortful cognitive activities. Understanding users' NFC levels can guide the complexity and depth of design elements. For instance, users with high NFC may appreciate intricate functionalities, while those with low NFC might prefer straightforward interactions.

centerofinquiry.org

2. Structuring User Behavior Evaluations

During usability testing, evaluate user responses at key stages:

Before the Test Begins: Gauge initial excitement and engagement levels.
After Providing Instructions: Assess clarity and any emerging confusion.
During the First Task: Monitor frustration and difficulty as users engage with the design.
Before the Final Task: Re-evaluate engagement and any persisting challenges.
After the Final Task: Collect overall feedback on their experience.

Use a scale from -5 to +5 to measure:

Excitement
Confusion
Frustration
Engagement
Difficulty

This structured approach provides quantitative data to inform design decisions.

3. Aligning Design Fidelity with User Insights

By analyzing NFC scores alongside behavioral data, tailor the design's fidelity to user needs:

Low NFC & High Difficulty/Frustration: Opt for low-fidelity prototypes to simplify interactions and reduce cognitive load.
High NFC & High Engagement/Excitement: Develop high-fidelity prototypes that offer detailed and challenging interactions.

This ensures the design aligns with user preferences and cognitive styles.

4. Collaborating with UX Designers

Share these insights with UX designers to inform the iterative design process. Regular collaboration ensures that user feedback is integrated, leading to a final product that resonates with the target audience.

By systematically applying the NFC Scale and structured user behavior evaluations, design teams can create user experiences that are both intuitive and engaging, grounded in empirical user data.

Interactive Experience Design