Data driven webpage color design

This paper presents a design framework for automatic webpage coloring regarding several fundamental design objectives: proper visual contrasts, multi-color compatibility and semantic associations. The objective functions are formulated with data-driven probabilistic models: the Color Contrast model concerning visual saliencies is trained on 52,000 basic components parsed from 500 popular webpages. Color Compatibility and Semantics are modeled from a dataset of manually tagged and rated color schemes from Adobe Kuler. To incorporate the multi-objectives in optimization, the framework adopts a lexicographic strategy, which determines the best choices by optimizing the objectives one by one in a user specified sequence. We demonstrate the effectiveness of the models and the flexibility of the framework in two typical web color design scenarios: fine tuning a colored page and recoloring a page with a specified palette. Independent perception experiments verify that the system-generated designs are preferable to those generated by nonprofessionals. The first attempt to automate webpage coloring through a data driven approach.We addressed the three fundamental design objectives of webpage coloring.We introduced novel probabilistic models capturing color contrasts and semantics.The models coordinated with the lexicographic strategy prove effective in demos.User tests verify the system-generated designs are more preferable.