{Image Quality by Design}

Table of Content

Why Image Quality is Important

Reader gets the story quickly

Our first priority is to service our readers. Make it fast and joyful to get it. Quality Art delivers just that! Getting it makes the reader happy. Only happy readers are the foundation of our community! They want to spread the word, contribute or buy products!

Images that work on every Display

True User Story: We experienced a situation where an entire set of images worked on one display and completely failed to tell the story on another. Designing images that tell the story on all displays is very important! Imagine to be the owner of an online shop and 1/3 of your customer’s don’t get it, because on their displays the images fail to tell the story of the product. You would loose 1/3 of your sales.

For more details: see → Consistent Color ???. We have adjusted our workflow to prevent a repetition of this nightmare. We now included tests in the “The Image Quality Preflight Check List” to assure newly designed images do not suffer from this quality impairment.

Image Quality, Style, Trust & Funding

Consistent style screams quality! If you can manage Image Quality you have learned the entire skill set to create a set of images with a consistent style. Once your images are in a consistent style your reader will instantly recognize it as your style and as a result she will intuitively trust you more.

know that you mastered the skill set required to manage quality. In turn a person who manages quality is automatically bestowed with trust regarding your designs, your products, and more.

How a personal style invokes trust: In order that you were able to produce an image set with your consistent style you needed to master image quality management. Once you reached this level, it is likely that the same quality management skills have been applied to the content of your site and to the development and manufacturing of your products. Hence your earned trust credits.

Trust is a lubricant that accelerates any relationship interactions. It is as simple and as powerful as that!

Thought Experiment on Trust: If you are in doubt follow me on this little thought experiment. Begin by make a journey into your own experiences. You will imagine working with two people. One you do not trust and one that you do. Lets begin with a person you trust the least. Who is slimy, tricked, and lied to you repeatedly. You getting the picture? Yuk! Imagine you do a project where both of you share an interest. Would you loose time in double checking his/her contribution? How fast is progress? How much would you enjoy it? Would you seek out to work with this person? Now repeat the same thought experiment with a person you trust deeply: Ask yourself the same questions: How much would you enjoy working together. How fast is progress? Would you seek out working with a trusted person?

Trust leads to funding: We love to help our readers. Our core team loves it so much we made it our full time job. We also need to buy rice (potatoes) and pay rent. We earn the funding by selling products designed to solve our reader’s problems. The reader’s trust credits that we earned through our consistent quality expressed through our own consistent style is what makes him consider buying our products. And that is how trust leads to funding!

Understanding Image Quality

Can Image Quality be measured?

If you believe that it can, skip this paragraph. If you are in doubt then follow this little thought experiment that will convince you: Explore your habits of consuming Art, like Movies, Music, Photos, etc… Most people have favorite Artists, such as favorite Directors, Musicians, Photographers, Painters, etc … You may anticipate a new release of your favorite Artist and after it arrives you will usually like it. You may also know artists which you consistently do not like. As such you are intuitively using quality criteria to measure quality of Art in a consistent way. In V²Flow.Art we do the same. Except we formalize perception of quality, by breaking quality down into a list of quality criteria, which each have sub-criteria. We give these criteria names and values to make communication and documentation easy and consistent.

Why is measuring Image Quality important?

Measuring Image Quality is at the heart of what we do in V²Flow.Art. Without out it creativity on demand and quality on demand will not work. Creating Art would not be predictable. Time schedules in production would have no meaning. By giving quality criteria names and values it becomes possible to describe the target quality and style in the ArtBrief.md ???. Now the Artist knows what to create. And it becomes much more objective to measure if an Image works.

Divide and conquer Image Quality

Image Quality is such a big topic. So we divide and conquer it. Firstly Image Quality can be measured on two levels: 1) Crafted Image Quality and 2) Perceived Image Quality.

Crafted Image quality is easier to measure: Lets explain this by using adjustment of the Black and White Point as an example. Load an Image in an Image processor and show levels. You instantly can see if the black point and white point are properly set! Now you have a tool and numbers to make numerical rating on this Image Quality Criteria. We compiled a “List of Crafted Image Quality Criteria” which guides the Artist during the Image creation process to ensure that the Crafted Image Quality is on the up and up. Although this is no guarantee that the final image will pass the Perceived Image Quality Test, it still will greatly increase your chances that it does.

Perceived Image Quality is more difficult to measure: But at the same time this is the most important benchmark. After all, if our readers do not like our images then they serve no purpose. At the end of this Article we show a “Perceived Image Quality Preflight Check List” as an attempt to bring order and somewhat metrics into measuring Perceived Image Quality.

Dividing Crafted and Perceived Image quality further: Both lists are divided into many more aspects, many of which even have sub aspects. This helps to finally reach a level comprised of a list of agreeable basic criteria. Each of which is easy to measure. At the very least we will agree on how to name it and how to measure it. For more details refer to the two respective lists.

Workflow to create Quality Images

Overview

  1. Specify the Image needed in ArtBrief.md
  2. Create the Image using Our Image Workflows following the specs in ArtBrief.md . Constantly monitor Crafted Image Quality Criteria and keep fixing issues that you find.
  3. When done, run yourself the Perceived Image Quality Preflight. Fix all issues that you find yourself. Expect that as the artist you became somewhat blind to some shortcomings. The next step addresses that problem:
  4. Find viewers who did not know this Image project. Let them run the Perceived Image Quality Preflight. Record all issues and fix them. Repeat until passed.

Our Image Workflows

Crafted Image Quality Criteria

Clear Story

Transparency

Background

Object Shadow

Materials

Tonality

Tonal Contrast

Local Contrast

Color Balance

Saturation

Edge Aliasing

Pixelation

Posterization

Noise

Small file size

Acuity

Compression Artifacts

Optimizing Workflow Order

If you were to perform the same image processing operations, but in a different order, you would see different results. We have optimized the order of steps to achieve best possible image quality. Why so would be another very long Article, which for now we have no time to write. I hope we have earned your trust by now so we can save the time to proof that point.

Preflight explained

Where does it come from

The Preflight term originated in aviation. It refers to the checking procedure prior to take off. The pilot will take the Preflight checklist and checks off item by item. Using a written checklist with tick boxes ensures that no check is forgotten. Since introduction of the written Preflight checklist significantly less airplanes are falling out of the sky. Due to its simplicity paired with high impact this method of using a written checklist prior to release is now common in engineering and design.

How it works

  • It is just a list of questions: Nothing fancy. You see the question. Write down the result.
  • Questions are grouped into headings of a topic: To make everything more manageable we grouped questions into topics, represented by the blue heading.
  • Give rating to the heading: First answer all questions pertaining to one heading. Then read the answers again and condense the result into a rating of 0…10.
  • Hover on Headings for Tool Tips: A little help in the tool tip. Maybe all you need to know?
  • Click Headings for Help: If you need more information simply click the heading to read more instructions on how to create the rating.
  • Each ArtBrief.md contains this Preflight: This serves several purpose:
    • Once you completed the image you can quickly test it’s perceived quality
    • Once the test is done others can see the test result for reference

Two Roles

This test is best performed with two people who have different roles to perform. It is possible to perform this test with one person only, but still you need to be aware to simulate two people corresponding to two roles.

Test Procedure

Overview: The test is performed by the interviewer who is familiar with both the image project and the test procedure. Instead the viewer does not need to know the test procedure and it is mandatory he does not know the image project.

4 Stage Test:

  • Stage 1: Prepare the Interview:
    • If not done already, create a web page that places the Image into context. In general an Image is designed to be used in a web page. That means it works together with background, a heading for the Image and most of time a copy[^copy] too.
  • Stage 2: The Interviewer uses the Preflight Check List as a Guide to ask questions to the Viewer and subsequently as a form to write down the answers.
  • Stage 3: The Interviewer analyzes the answers and compiles them into a rating that is written down to the right side of the heading of each Section
  • Stage 4: Make decision if the test is passed or fail. There is no exact rating system. Assigning numbers is more for the purpose to help you to make a pass or fail decision.
    If passed this Image project is closed. If failed you need to go back image design. Use the notes in the Preflight Check List to guide you what improvements need to be made. When done perform another Preflight check. It may be most informative to do the first Preflight check with the same Viewer to see if his concerns are addressed. But once done you need to perform it with at least one more Viewer who was not involved with this Image project. This is very important to avoid the pitfall that the first viewer is satisfied with the image but only because he draws on the knowledge of previous discussions about it. Since this will not be possible for anyone in the final audience you must perform the final test with a person who has not been previously involved with the Image.

Group all images of one page into one test sitting

For efficiency reasons it is best to test all images of one page in one test sitting.

Perceived Image Quality Preflight

Check Result  
Messages    
Viewer gets what messages?    
Identical as per ArtBrief.md?    
Obvious or required thinking?    
Eye is drawn to story point?    
Contemporary    
Free of outdated HW or SW?    
Free of outdated design elements?    
Grounding    
Shadow looks natural?    
No halo around subject?    
Image bkg works with doc bkg?    
Material    
Key Materials easy recognizable?    
Materials look natural?    
Rugged    
Highlight detail on too bright OK?    
Shadow detail on too dark OK?    
Colors    
Colors appear natural?    
Colors emphasize message?    
sRGB profile assigned?    
Crispness    
Correct White & Black Point?    
Details in shadows & highlights?    
Right amount of sharpness (USM)?    
Story points are high contrast?    
Artifacts    
Free of Edge Aliasing?    
Free of Pixelation?    
Free of Posterization?    
Free of noise ?    
Free of compression artifacts?    
Image size within spec ?    

Help: Perceived Image Quality Preflight

Rating of Message Quality

Purpose

The purpose of every image is to tell a story. Often in concert with a heading and a text. With this test we make sure that the image indeed delivers the story, especially to viewers who see the image for the first time.

Viewer gets what messages?

Full Question: What messages does the image give you?

Identical as per ArtBrief.md?

Obvious or required thinking?

Eye is drawn to story point?

Compiling the rating

Rating of Contemporary Quality

  • Rate free the image is of anything that hints outdated

Rating of Grounding Quality

Rating of Material Quality

Rating of rugged Display Rendering

Rating of Colors

Rating of Crispness

Rating of Artifacts