[논문 리뷰] InfoColorizer: Interactive Recommendation of Color Palettes for Infographics

Lin-Ping Yuan, Ziqi Zhou외 4명|arXiv (Cornell University)|2021. 02. 03.

Color perception and design참고 문헌 66인용 수 9

한 줄 요약

InfoColorizer는 사용자 선호도와 요소의 공간적 레이아웃을 통합하는 딥러닝을 활용해 인포그래픽용 색상 팔레트를 추천하는 데이터 기반의 상호작용형 도구입니다. 조건부 변동 자동에코더(VAEAC)를 활용해 다양한 맥락 인지 팔레트를 생성함으로써 수동 또는 사전 정의된 접근 방식에 비해 설계 노력은 크게 감소시키고 미학적 품질과 가독성은 향상시킵니다.

ABSTRACT

When designing infographics, general users usually struggle with getting desired color palettes using existing infographic authoring tools, which sometimes sacrifice customizability, require design expertise, or neglect the influence of elements' spatial arrangement. We propose a data-driven method that provides flexibility by considering users' preferences, lowers the expertise barrier via automation, and tailors suggested palettes to the spatial layout of elements. We build a recommendation engine by utilizing deep learning techniques to characterize good color design practices from data, and further develop InfoColorizer, a tool that allows users to obtain color palettes for their infographics in an interactive and dynamic manner. To validate our method, we conducted a comprehensive four-part evaluation, including case studies, a controlled user study, a survey study, and an interview study. The results indicate that InfoColorizer can provide compelling palette recommendations with adequate flexibility, allowing users to effectively obtain high-quality color design for input infographics with low effort.

연구 동기 및 목표

• 디자인 전문 지식이 부족하고 기존 제작 도구의 제약을 겪는 비전문가 사용자를 위한 인포그래픽 색상 팔레트 설계 과제를 해결하기 위해.
• 사용자 선호도를 명시함으로써 색상 팔레트 생성을 자동화하면서도 사용자 유연성을 유지함으로써 설계 장벽을 낮추기 위해.
• 학습 과정에 인포그래픽 요소의 공간적 레이아웃 정보를 통합하여 팔레트 추천 품질을 향상시키기 위해.
• 통제된 사용자 테스트와 전문가 인터뷰를 포함한 다수의 연구를 통해 시스템의 효과성을 평가하기 위해.
• 사용자 입력에 기반한 반복적 설계 보완을 지원하는 상호작용적이고 동적인 팔레트 생성을 가능하게 하기 위해.

제안 방법

• 시스템은 인포그래픽의 개념적 모델을 사용해 요소의 위치와 관계를 포함한 구조적 및 공간적 특징을 추출합니다.
• 디자이너가 만든 인포그래픽 대규모 데이터셋을 기반으로 VAEAC(임의 조건부 변동 자동에코더) 기반의 딥러닝 생성 모델을 훈련시켜 색상 설계 관행을 학습합니다.
• 사용자 선호도(예: 정확한 또는 모호한 색상 제약)는 VAEAC 모델의 조건부 입력으로 사용되어 맞춤형 팔레트를 생성합니다.
• 잠재 표현에 공간적 레이아웃 특징을 통합하여 추천 팔레트가 시각적 계층구조와 대비 요구사항을 존중하도록 보장합니다.
• 도구는 상호작용 편집을 지원하여 사용자가 레이아웃을 수정하고 실시간으로 팔레트 추천을 받을 수 있습니다.
• 사용성과 효과성을 검증하기 위해 사례 연구, 통제된 사용자 연구, 설문 조사 및 전문가 인터뷰의 조합을 사용하여 시스템을 평가합니다.

Figure 1: InfoColorizer consists of a recommendation engine and a visual interface. The recommendation engine is constructed by first extracting structure and color information from inforgraphics and then training a deep learning model, VAEAC, to characterize good color design practices. The visual

실험 결과

연구 질문

• RQ1 비전문가 인포그래픽 제작자를 위해 상호작용적이고 데이터 기반의 시스템이 설계의 미학적 품질과 가독성 측면에서 효과적으로 색상 팔레트를 추천할 수 있는가?
• RQ2 공간적 레이아웃 정보를 통합할 경우 팔레트 추천의 품질과 관련성은 어느 정도 향상되는가?
• RQ3 사용자 효율성, 창의성 지원 및 인식된 품질 측면에서 InfoColorizer는 수동 팔레트 생성 및 사전 정의된 팔레트에 비해 어떻게 비교되는가?
• RQ4 최소한의 디자인 경험을 가진 사용자가 낮은 정신적 및 기술적 노력으로 높은 품질의 인포그래픽을 생성할 수 있는가?
• RQ5 전문 디자이너들은 시스템의 기능이 실제 디자인 워크플로우를 지원하는 데 어떻게 평가하는가?

주요 결과

• 24명의 초보자 대상 통제된 사용자 연구에서 InfoColorizer를 사용한 참가자들은 온라인 자원을 활용한 수동 팔레트 생성을 시도한 참가자들보다 작업을 더 빨리 완료했고 창의성 지원도 더 높게 평가했습니다.
• 102명의 사용자 대상 설문 조사에서 InfoColorizer가 추천한 팔레트는 무작위로 생성된 팔레트와 기본 수준의 팔레트에 비해 미학적 품질과 가독성 측면에서 유의미하게 높은 점수를 받았지만, 예술가가 수작업으로 만든 팔레트에 비해 略로 낮았습니다.
• 전문가 인터뷰 결과, 디자이너들은 InfoColorizer의 기능이 신선하고 효과적이라고 평가했으며, 몇 번의 조작만으로도 매력적인 인포그래픽을 제작할 수 있음을 확인했습니다.
• 사례 연구를 통해 InfoColorizer가 와이어프레임 채우기나 다양한 색상 스킴을 결합하는 등 다양한 작업을 성공적으로 지원했으며 맥락 인지 추천 기능을 제공함을 입증했습니다.
• VAEAC의 사용으로 다양한 유저 선호도를 수용하면서도 설계의 일관성을 유지하는 다채롭고 관련성 있는 팔레트 생성이 가능했습니다.
• 평가 결과, 모델에 공간적 레이아웃 특징을 통합함으로써 팔레트의 관련성, 특히 대비와 시각적 계층구조 확보 측면에서 향상됨을 확인했습니다.

Figure 2: (a) Artistic elements, graphical data elements, visual groups, and visual information flow (VIF) & backbone in an infographic. (b) The conceptual tree model. Some branches are omitted for simplicity.