DOI QR코드

DOI QR Code

Effectiveness Optimization for Metro-Style Graphical User Interfaces

Metro 스타일 GUI의 가시화 효율 최적화

  • 김강태 (성균관대학교 전자전기컴퓨터공학과) ;
  • 김기혁 (성균관대학교 전자전기컴퓨터공학과) ;
  • 이성길 (성균관대학교 소프트웨어학과)
  • Received : 2014.09.04
  • Accepted : 2014.10.13
  • Published : 2014.12.15

Abstract

Graphical user interfaces (GUI) in modern software deliver information visually, and a well-designed interface can provide information to the use in an organized and intuitive manner while poorly-designed interfaces can cause visual inconvenience and confusion. In order to effectively deliver information to the user, visual attention should be placed on a prominent location in the image. This paper introduces a method based on a human visual system (HVS) that can improve Metro-style GUIs by reducing a user's workload to visually find information. Our method is designed with spatial mapping and color mapping for buttons in the Metro-style GUI. Also we define a metric for Metro-style GUI effectiveness, including an optimization algorithm. The results show that our method improves the performance of visual search tasks in a Metro-style GUI.

최근의 소프트웨어는 인터페이스에 대한 사용자의 직관적인 이해를 돕기 위해, 시각적으로 정보를 표현하는 그래픽 사용자 인터페이스(Graphical User Interface)를 사용한다. 잘 디자인된 인터페이스는 사용자에게 정보를 효율적으로 전달하나, 그렇지 않은 경우는 보기에 불편하고 난해하다. 시각적 정보가 효율적으로 사람에게 전달되기 위해서는, 사용자의 시각적 관심이 이미지의 중요한 영역에 있도록 해야 한다. 이 논문은 사람의 시각체계 내 탐색(visual search)를 고려하여 Metro-Style GUI를 시각적으로 향상시키는 방법을 소개한다. 이 방법은 Metro-Style GUI 버튼의 공간적 매핑과 색 매핑의 두 단계로 구성되어 있다. 또한 Metro-Style GUI의 효용성을 정의하고, 이를 최적화하는 알고리즘을 함께 제안한다. 결과에서는 우리의 방법을 적용하여 Metro-Style의 GUI를 시각적으로 향상시킨 예시를 제시한다.

Keywords

Acknowledgement

Supported by : 한국연구재단

References

  1. K. T. Kim, Y. N. Jeong, and S. K. Lee, "Color Selection Optimization for Metro-style GUI," Proc. HCI Korea 2013, pp. 365-367, 2013. (in Korean)
  2. B. E. Trumbo, "A Theory for Coloring Bivariate Statistical Maps," Am. Statistician, Vol. 35, No. 4, pp. 220-226, 1981.
  3. A. M. Treisman and G. Gelade, "A Feature-Integration Theory of Attention," Cognitive Psychology, Vol. 12, No. 1, pp. 97-136, 1980. https://doi.org/10.1016/0010-0285(80)90005-5
  4. L. Itti, C. Koch, and E. Niebur, "A Model of Saliency-Based Visual Attention for Rapid Scene Analysis," IEEE Trans. on Pattern Analysis and Machine Intelligence, Vol. 20, No. 11, pp. 1254-1259, 1998. https://doi.org/10.1109/34.730558
  5. P. T. Quinlan and G. W. Humphreys, "Visual search for targets defined by combinations of color, shape, and size: An examination of the task constraints on feature and conjunction searches," Perception & Psychophysics, Vol. 41, No. 5, pp. 455-472, 1987. https://doi.org/10.3758/BF03203039
  6. C. G. Healey, "Choosing Effective Colours for Data Visualization," Proc. of the Visualization 1996, pp. 263-270, 1996.
  7. M. Tory and T. Moller, "Human Factors in Visualization Research," IEEE Trans. on Visualization and Computer Graphics, Vol. 10, No. 1, pp. 72-84, 2004. https://doi.org/10.1109/TVCG.2004.1260759
  8. S. Lee, M. Sips, and H.-P. Seidel, "Perceptually Driven Visibility Optimization for Categorical Data Visualization," IEEE Trans. on Visualization and Computer Graphics, Vol. 19, No. 10, pp. 1746-1757, 2013. https://doi.org/10.1109/TVCG.2012.315
  9. J. Schanda, Colorimetry: Understanding the CIE system, pp. 79, John Wiley & Sons, New Jersey, 2007.
  10. C. A. Brewer, "Color use guidelines for data representations," Proc. the Section on Statistical Graphics, American Statistical Association, pp. 55-60, 1999.
  11. C. A. Brewer, "Review of Colour Terms and Simultaneous Contrast Research for Cartography," Cartographica: The International Journal for Geographic Information and Geovisualization, Vol. 29, No. 3, pp. 20-30, 1992.
  12. C. A. Brewer, "Evaluation of a Model for Predicting Simultaneous Contrast on Color Maps," Professional Geographer, Vol. 49, No. 3, pp. 280-294, 1997. https://doi.org/10.1111/0033-0124.00077
  13. S. Hoober. (2013, Feburary 18). How Do Users Really Hold Mobile Devices? [online]. Available: http://www.uxmatter.com
  14. S. Perez. (2012, October 22). Flurry Examines App Loyalty: News & Communication Apps Top Charts, Personalization Apps See High Churn [online]. Available: http://www.techcrunch.com