The more real something looks and feels, the more likely it is that you’ll receive actionable feedback to validate your design or inform your next iteration.
Fidelity is the degree of exactness to which a model reproduces the real thing. 
How much fidelity is enough?
The greater the fidelity, the more likely it is that someone will understand your design intent. The more real something looks and feels, the more likely it is that you’ll receive <a href="http://uxmag.com/topics/user-reported-feedback" target="_blank">actionable feedback</a> to validate your design or inform your next iteration. Theoretically, one could gradually increase the fidelity of a model until it’s indistinguishable from the actual product. However, that’s not a practical approach in most situations.
In the field of UX, the term low fidelity is often applied to site maps, screen flow diagrams, <a href="http://uxmag.com/topics/wireframes" target="_blank">wireframes</a>, and paper <a href="http://uxmag.com/topics/prototypes" target="_blank">prototypes</a>. 
These models help designers explore and gather feedback about how information within a digital product might be structured and how that product might respond to interactions from users and the system at large. While some aspects of a product’s form may begin to take shape with low-fidelity models, it is not their primary intent.
The term high fidelity is more commonly used in conjunction with UX models that articulate a product’s form or aesthetics. Screen layouts, style guides, and other <a href="http://uxmag.com/topics/visual-design" target="_blank">visual design</a> specification documents fit into this bucket. This suggests that low-fidelity deliverables address the product’s function while high-fidelity deliverables focus on form.
However, many of the UX deliverables outlined above can actually be executed at various levels of fidelity.
Let’s use wireframes to illustrate the point. 
Loose, hand-sketched wireframes can quickly but completely capture page-level content hierarchy and navigational elements. Many people would call this low fidelity. 
By contrast, wireframes with pixel precision and brand-appropriate elements such as color and typography may communicate the visual layout of information. Most people would call these high fidelity.
But what if these high-fidelity wireframes lack any definition around what content—text or images—should be included on the page? And what if it’s not clear where a particular page exists inside of the website’s overall structure or how users will navigate to other pages?
This doesn’t sound like a model that accurately reproduces the final product, so it can’t be high fidelity, can it?
Read my full article in <a href="http://uxmag.com/articles/deconstructing-fidelity" target="_blank">UX Magazine</a>.

Design

Interaction Design

Fidelity is the degree of exactness to which a model reproduces the real thing. 
How much fidelity is enough? 
The greater the fidelity, the more likely it is that someone will understand your design intent. The more real something looks and feels, the more likely it is that you’ll receive <a href="http://uxmag.com/topics/user-reported-feedback" target="_blank">actionable feedback</a> to validate your design or inform your next iteration.

We can help you build seamless experiences with digital strategy and design.

Sector Page: Digital (Text Only)

Theoretically, one could gradually increase the fidelity of a model until it’s indistinguishable from the actual product. However, that’s not a practical approach in most situations.

In the field of UX, the term low fidelity is often applied to site maps, screen flow diagrams, <a href="http://uxmag.com/topics/wireframes" target="_blank">wireframes</a>, and paper <a href="http://uxmag.com/topics/prototypes" target="_blank">prototypes</a>.&nbsp;
These models help designers explore and gather feedback about how information within a digital product might be structured and how that product might respond to interactions from users and the system at large. While some aspects of a product’s form may begin to take shape with low-fidelity models, it is not their primary intent.

The term high fidelity is more commonly used in conjunction with UX models that articulate a product’s form or aesthetics. Screen layouts, style guides, and other <a href="http://uxmag.com/topics/visual-design" target="_blank">visual design</a> specification documents fit into this bucket. This suggests that low-fidelity deliverables address the product’s function while high-fidelity deliverables focus on form.
However, many of the UX deliverables outlined above can actually be executed at various levels of fidelity.
 Let’s use wireframes to illustrate the point.&nbsp;
Loose, hand-sketched wireframes can quickly but completely capture page-level content hierarchy and navigational elements. Many people would call this low fidelity.&nbsp;

By contrast, wireframes with pixel precision and brand-appropriate elements such as color and typography may communicate the visual layout of information. Most people would call these high fidelity. 
But what if these high-fidelity wireframes lack any definition around what content—text or images—should be included on the page? And what if it’s not clear where a particular page exists inside of the website’s overall structure or how users will navigate to other pages? 
This doesn’t sound like a model that accurately reproduces the final product, so it can’t be high fidelity, can it?
<h2>Fidelity Comes in Different Types</h2>
Many people think of aesthetics alone when describing the fidelity of an object. Humans are highly visual creatures, so this isn’t surprising. In <a href="https://www.slideshare.net/slideshow/hacking-ux-25091564/25091564" target="_blank" rel="noopener noreferrer">Hacking UX,” Austin Govella</a> suggests a better framework for fidelity.&nbsp;
Instead of a single spectrum that is often confused with aesthetic precision, let’s consider the following four types of fidelity:
<h3>Contextual</h3>
Contextual fidelity measures how closely a model simulates the scenario of actual product use. To illustrate, let’s consider two hypothetical products that share some key user interface attributes, such as physical dimensions, resolution, and touch screen technology. Product A is an iPad app used by auto insurance agents to estimate the cost of repairing a vehicle damaged in an accident. Product B is a medical device with an embedded display used by anesthesiologists to quickly prepare patients for an emergency surgical procedure. The settings and circumstances are very different and define the products’ respective contexts. Ignoring these factors would be equivalent to designing in a vacuum.
Throughout the design process, consider whether your models demonstrate an appropriate level of contextual fidelity. Are you presenting an iOS app on a 60-inch television when an iPad would be more realistic? Is the embedded medical device interface presented on posters in a hotel conference room or on paper adhered to a physical device model in a simulated emergency room environment? You won’t always have the opportunity to demonstrate high contextual fidelity, but assessing it can help you better understand the setting and circumstances of product use.

The acceleration of tech, and especially the mobile revolution, has deeply impacted both the consumer and medical device industries. Our experience designing for both gives us a unique perspective on where the two are cross-pollinating.

Don't Miss: 3 UX Trends Reshaping Medical Device Design

<h3>Content</h3>
Content fidelity is how accurately the information included in a model matches the final product. Many designers use placeholder content in their early-stage UX deliverables. I’ve done this myself. However, I question whether there is any value in doing so. How will you determine if users comprehend what’s being communicated in a design without representative content? What happens when a user selects that button labeled Lorem ipsum? Do you really need five images on that page or would fewer suffice? A better approach would be to use whatever draft copy and visual assets you can get your hands on. If this sample content doesn’t exist, ask someone to provide it or create it yourself. It can always be changed later.
<h3>Behavioral</h3>
Behavioral fidelity is how closely a model reproduces the functionality of the final product. Much of a digital product’s behavior is ultimately expressed via software, making it somewhat challenging for designers to articulate how a product might behave. However, it can be partially achieved using tools like screen flows, annotated wireframes, user stories, and clickable prototypes.
If you work with a software development team, this represents a great opportunity to include them in the design process. If you don’t work with a development team, there are many free or cheap tools available to turn your sketches or static images into a limited-functionality prototype. And don’t forget that the form of an interface element can also contribute to a user’s perception of how it will behave. If the user can interact with an element, be sure to communicate its desired sensory characteristics. Using established design patterns, where available, can quickly increase behavioral fidelity and ensure a shared understanding of behavior.
<h3>Visual</h3>
Visual fidelity measures how closely a model’s form mirrors the final product. When working in low visual fidelity, one might quickly explore potential visual design approaches using tools like mood boards and style tiles. If visual design is someone else’s gig, ask them to apply some degree of visual styling to early prototypes. This will help you test how aesthetics impact usability, brand recognition, and overall user satisfaction. As the need for new information or functionality arises, try to maintain visual consistency at whatever level of fidelity is appropriate.
Whatever you do, don’t wait until the end of a UX project to apply the product’s form. Instead, make a plan to gradually increase visual fidelity as you go and accept that it will evolve with time and iteration, just like every other aspect of the product. 
Try using the four types of fidelity on your next UX project. I suspect it will help you assess how much detail is needed and where it’s needed. It may also inform a more methodical approach to increasing fidelity through design iteration that ultimately improves others’ understanding of your design intent. 
This article was originally published in <a href="http://uxmag.com/articles/deconstructing-fidelity" target="_blank">UX Magazine</a>.

The Interaction Design team at Delve offers services that can improve your existing user experience or guide your team through a process to realize innovative digital products and services.

Services Page: Interaction Design

Learn more about&nbsp;<a href="https://www.delve.com/digital" target="_blank">Delve Digital Product Design & Strategy Development</a>&nbsp;services.

SEO Text: Digital Products Sector

Newsletter Signup: Digital-Physical Product Development (icon visual)

12-Article-Soliva-Fidelity-H1

The more real something looks and feels, the more likely it is that you’ll receive actionable feedback to validate your design or inform your next iteration.

Contact Us | General (Let's build something together)

Digital

Home

Insights

Deconstructing Fidelity

Breadcrumbs

A full-service product design and strategic innovation consultancy.

Delve

The more real something looks and feels, the more likely it is that you’ll receive actionable feedback to validate your design or inform your next iteration.

The more real something looks and feels, the more likely it is that you’ll receive actionable feedback to validate your design or inform your next…

description

generator

kSwNn6qD4B-4HloWnWMUBWQNpBx2_mPi3nMqgsh6ato

google-site-verification

feels, likely, you’ll, receive, actionable, feedback, validate, design, looks, inform, real, iteration

keywords

https://cms.delve.com/assets/images/_1200x630_crop_center-center_82_none/12-Article-Soliva-Fidelity-H1.jpg?mtime=1598898026

https://linkedin.com/company/delvedesign/

https://www.delve.com/insights/deconstructing-fidelity

referrer

robots

twitter:card

twitter:creator

twitter:description

https://cms.delve.com/assets/images/_800x418_crop_center-center_82_none/12-Article-Soliva-Fidelity-H1.jpg?mtime=1598898026

twitter:image

twitter:image:alt

twitter:image:height

twitter:image:width

twitter:site

twitter:title

{"title":{"title":"Deconstructing Fidelity | Delve"}}

Learn the Not-So-Basics

Privacy Policy

FCOI Policy

Services

Case Studies

Testimonials

What We Do

About Us

Our People

Join Our Team

Careers

Newsroom

Who We Are

Boston

Madison

Philadelphia

San Francisco

Our Studios

Partner with Delve

Contact Us

Contact

Vamsee Pamula, Founder &amp; President, Baebies

Read informative articles from Delve's team of experts. Discover innovative strategies and insights about product design, engineering, and development.

Delve Insights: Product Innovation & Development Blog

innovation, product, design, advice, development

https://cms.delve.com/assets/images/_1200x630_crop_center-center_82_none/Delve_titlecard.png?mtime=1654035558

https://cms.delve.com/assets/images/_800x418_crop_center-center_82_none/Delve_titlecard.png?mtime=1654035558

Deconstructing Fidelity

Deconstructing Fidelity

Related Insights