Seeing Through the Overlap: The Impact of Color and Opacity on Depth Order Perception in Visualization

Research Background and Problem

• What problems or challenges did the authors identify?
  Translucent visualizations often use color and transparency to represent data hierarchy and overlapping regions. However, current research on how to choose colors and transparency to enhance depth order perception presents conflicting results and neglects the interaction between color and transparency. This lack of clear design guidance makes it difficult for practitioners to select appropriate parameter combinations.

• Why is this problem important?
  Depth order perception is a critical factor in understanding multi-layered data and complex data structures. Errors in depth order perception in data visualization can lead to inaccurate information transmission, impacting data insights and decision-making.

• Research Motivation and Related Work
  This study aims to systematically explore the effects of color and transparency on depth order perception in translucent visualizations, addressing the lack of research on the interaction between color and transparency. Previous related work has provided preliminary suggestions in scientific data visualization and abstract data visualization, but these are contradictory and limited in scope. This study seeks to predict perceptual performance and provide quantitative guidance for design practices.

Solution

• What methods or solutions did the authors propose?
  The authors designed a systematic experiment, including online experiments and various data analysis methods, to test the effects of color, transparency, and their interaction on depth order perception. Specific elements include:

  1. Experiments on combinations of 8 colors, 3 transparency levels, different layers, and arrangements.
  2. Derivation of 12 features to construct predictive models quantifying the relationship between design parameters and perceptual accuracy.
  3. Provision of design tools and practical guidelines to help designers select appropriate colors and transparency.

• What are the innovative aspects of this solution?

  1. Comprehensive experimental design: Testing a wide range of color and transparency combinations, covering the design space of multi-layer translucent visualizations.
  2. Predictive model creation: Using machine learning methods (random forests, decision trees, etc.) to construct models for quantitative evaluation and prediction of design effects.
  3. Interaction analysis: Systematically revealing the interactive effects of color and transparency on depth perception, resolving conflicts in previous research.
  4. Practical guidance tools: Developing a small design assistance tool allowing users to input parameters and predict perceptual performance.

• What are the implementation steps and key technologies used?

  1. Experimental design: Generating experimental data with 1008 stimulus combinations, processing overlapping regions using transparency algorithms (α-blending).
  2. Experiment execution: Recruiting 192 participants for online experiments, recording the accuracy of selecting foreground data.
  3. Data analysis: Conducting hypothesis testing (Kruskal-Wallis H test) and constructing and evaluating machine learning models (random forests, decision trees, etc.).
  4. Tool development: Creating an interface tool based on the best model results to predict users' depth order perception performance.

Research Outcomes

• What specific outcomes were achieved?

  1. Identified that color and transparency significantly affect depth order perception, with low transparency and high transparency having different effects on various layers.
  2. Proposed design guidelines: Blue is recommended for foreground layers, while pink or yellow is suggested for background layers. Foreground layers should have higher transparency, and background layers should have lower transparency.
  3. Developed a random forest model achieving 80.72% prediction accuracy and an F1 score of 87.75%.

• What advantages does it have compared to existing solutions?

  1. Comprehensive consideration of the interaction between color and transparency, providing more holistic insights for design practices.
  2. Quantitative tools enabling designers to evaluate perceptual accuracy rather than relying on experience or inconsistent recommendations.
  3. Broader research scope, including improved prediction performance under complex design conditions.

• What are the experimental or evaluation results?

  1. Statistical analysis: Color and transparency significantly affect depth perception, with blue performing best in the foreground and pink and yellow performing better in the background.
  2. Predictive model: The random forest model achieved excellent perceptual prediction performance using features such as foreground transparency and color distance.
  3. Design tool: Users can input foreground and background colors and transparency to predict perceptual accuracy.

• Limitations and Future Directions

  1. Simplified experimental design: Only studied two overlapping layers; future work could extend to complex multi-layer scenarios.
  2. Methodological limitations: Used the α-blending algorithm, which may not fully reflect the complexity of actual visual presentations. Advanced transparency processing methods are recommended for exploration.
  3. Additional visual variables: Did not include factors such as shape and size, which may influence depth perception. Future research could expand the design space.
  4. Task scope limitations: Focused primarily on depth order perception; future studies could explore other tasks such as identifying overlapping regions.

The study provides a systematic framework for translucent visualization design and develops practical tools to guide the selection of color and transparency. Through comprehensive experiments and predictive model analysis, it addresses gaps in current research while proposing directions for future studies.