Seeing Isn’t Believing: How Visual Illusions Distort Color Selection

Seeing Isn’t Believing: How Visual Illusions Distort Color Selection Sari Kobayashi, Satoshi Nakamura Meiji University 1

Have you ever had an experience like this? https://nurie-park.com/nurie/2515

• https://nurie-park.com/nurie/2515

Visual Illusions Caused by Color Selection Interfaces

Differences in Color Impressions Across Color Selection Interfaces When visual illusions occur during color selection, they lead to ・Unintended changes in the impression of the design ・Require users to make additional adjustments Designing interfaces with an understanding of visual illusions is important. 4

Purpose Examine how color selection illusions arise under different interface conditions Effect of Background Brightness on Color Selection Effect of Display Size on Color Selection 5

Purpose Examine how color selection illusions arise under different interface conditions Effect of Background Brightness on Color Selection Effect of Display Size on Color Selection 6

Experiment 1 :Effect of Background Brightness Perceived brightness of a color changes depending on the brightness of the area surrounding it. A color surrounded by a dark area is perceived as brighter. A color surrounded by a bright area is perceived as darker. 7

Experiment 1 :Effect of Background Brightness How the selected color changed when the surrounding color varied？ Task： Match a target color Target The area surrounding the selected Color has a different background color from that of the target. Participants： 20 Trials： 180（ for each person） Selected Color Surrounding Color 8

Experiment 1 :Effect of Background Brightness Brightness13 Brightness25 Brightness38 Brightness63 Brightness75 Brightness88 9

Result: Differences from the Target Brightness Dark surrounding colors → Darker than targets Bright surrounding colors → Brighter than targets When the surrounding color of an object differs from the palette’s background, a brightness illusion occurs. 10

Investigations Effect of Achromatic Background Brightness on Color Selection Effect of Display Size on Color Selection 11

Experiment 2: Effect of Display Size How the color selected changed when its display size varied Task： Match a target color ？ Target The selected color changed in size. Participants ： 20 Trials ： 440 （ for each person ） Selected Color Surrounding Color 12

Experiment 2: Effect of Display Size 5 Size Conditions 30px 90px 150px 210px 270px 300px 13

Result: Differences from the Target Brightness Inaccuracy was largest for the smallest size condition and smallest for the largest size condition. Low Accuracy（ BAD） High Accuracy（ GOOD） The smaller the displayed area of the selected color, the greater the differences . 14

Discussion on Color Selection Interfaces and Visual Illusions When the surrounding color of an object differs from the palette’s background, a brightness illusion occurs. The smaller the displayed area of the selected color, the greater the difference s. What kind of impact does it have on actual color-selection interfaces? 15

What kind of impact does it have on actual color-selection interfaces? Using bright or dark background colors in color selection interfaces can lead to users unintentionally selecting colors. Dark Mode The dark background causes users to choose colors darker than intended. https://nurie-park.com/nurie/2515 16

• https://nurie-park.com/nurie/2515

What kind of impact does it have on actual color-selection interfaces? Smaller display areas for colors may hinder accurate color selection. Color tiles should not be displayed too small in the interface design. 17

The color selection interface that takes visual illusions into account Transparent Background To preview how the selected color will look directly on the canvas. Large Color Tile Limit the number of color hues displayed at one time. color-category tiles Implemented within PowerPoint 18

Conclusion We hope… Color selection interfaces designed with visual illusions in mind will help users choose colors more accurately and confidently. 19

Summary Background Visual illusions caused by color selection interfaces make color selection difficult. Purpose Examine how color selection illusions arise under different interface conditions. Method Modify how colors are displayed in the interface. Results The interface’s background and small color display area may hinder color selection. Latest study A color selection interface that takes visual illusions into account was implemented in PowerPoint. 20