Expresso: Building Responsive Interfaces with Keyframes
| Autor: | Walter S. Laseck, Steve Onev, Sang Won Lee, Rebecca Krosnick |
|---|---|
| Rok vydání: | 2018 |
| Předmět: |
Viewport
Computer science business.industry 05 social sciences WYSIWYG 020207 software engineering Cascading Style Sheets 02 engineering and technology Visualization Responsive web design Human–computer interaction Web page 0202 electrical engineering electronic engineering information engineering Task analysis 0501 psychology and cognitive sciences User interface business computer 050107 human factors computer.programming_language |
| Zdroj: | VL/HCC |
| DOI: | 10.1109/vlhcc.2018.8506516 |
| Popis: | Web developers use responsive web design to create user interfaces that can adapt to many form factors. To define responsive pages, developers must use Cascading Style Sheets (CSs) or libraries and tools built on top of it. CSS provides high customizability, but requires significant experience. As a result, non-programmers and novice programmers generally lack a means of easily building custom responsive web pages. In this paper, we present a new approach that allows users to create custom responsive user interfaces without writing program code. We demonstrate the feasibility and effectiveness of the approach through a new system we built, named Expresso. With Expresso, users define “keyframes” - examples of how their VI should look for particular viewport sizes - by simply directly manipulating elements in a WYSIWYG editor. Expresso uses these keyframes to infer rules about the responsive behavior of elements, and automatically renders the appropriate css for a given viewport size. To allow users to create the desired appearance of their page at all viewport sizes, Expresso lets users define either a “smooth” or “jump” transition between adjacent keyframes. We conduct a user study and show that participants are able to effectively use Expresso to build realistic responsive interfaces. |
| Databáze: | OpenAIRE |
| Externí odkaz: |
|