Supporting the design of custom static node-ling graph visualization

Abstract

Graph visualizations for communication appear in a variety of contexts that range from scientific/ academic to journalistic and even artistic. Unlike graph visualizations for exploration and analysis, these images are used to tell a story that is already known rather than to look for a story within the data. Although graph drawing and diagram editing software can be used to produce them, visualizations made this way do not always meet the visual requirements imposed by their context of use. Graphics authoring software can be used to make the necessary improvements, but not all modifications are possible and the process of editing these images may be very time-consuming and labor-intensive. In this work, we present an investigation of static node-link visualizations for communication and how to better support their creation. We began with a deconstruction of these images, breaking them down into their basic elements and analyzing how they are created. From this, we derived a set of requirements that tools aimed at supporting their creation should meet. To verify if taking all of this into account would improve the workflow and bring more flexibility and power to the users, we created our own prototype, which we named GraphCoiffure. With a special emphasis on helping users on creating visualizations for publication, GraphCoiffure was designed as a standalone application that would serve as an intermediary step between graph drawing and editing software and graphics editors. It combines interactive graph layout manipulation tools with CSS-like styling possibilities to let users create and edit static node-link visualizations for communication. We illustrate the use of GraphCoiffure with four use-case scenarios: the adaptation of a visualization’s layout to make it work on a given page, the reproduction of a visualization’s style and its application on another graph, and the creation of two visualizations from scratch. To obtain feedback on GraphCoiffure, we conducted an informal evaluation by interviewing three potential expert users, who found that it could be useful for their work.

Visualizações de grafos para comunicação aparecem numa variedade de contextos que vão do acadêmico-científico até o jornalístico e até mesmo artístico. Diferente de visualizações de grafos para exploração e análise de dados, essas imagens são usadas para “contar uma história” que já se conhece ao invés da “procura de uma nova história” nos dados. Apesar de ser possível usar software para desenho de grafos e edição de diagramas para produzí-las, visualizações feitas dessa forma nem sempre preenchem os requisitos visuais impostos pelos seus contextos de uso. Programas de edição de imagens podem ser usados para fazer as melhorias necessárias, mas nem todas as modificações são possíveis e o processo de editar essas imagens pode exigir muito tempo e esforço. Neste trabalho, apresentamos uma investigação de visualizações nodo-aresta estáticas para comunicação e de como facilitar sua criação. A partir de uma desconstrução dessas imagens, identificando seus elementos essenciais, e analisando como são criadas, derivamos um conjunto de requisitos que ferramentas para a criação dessas visualizações devem preencher. Para verificar o efeito da metodologia na melhora do fluxo de trabalho de designers, com mais poder e flexibilidade, foi concebido e implementado um protótipo chamado GraphCoiffure. Com um foco especial em auxiliar usuários na criação de visualizações para publicação, Graph- Coiffure foi projetado como uma aplicação standalone que seria usada como um passo intermediário entre programas de desenho e edição de grafos e editores gráficos. Ele combina ferramentas para manipulação interativa de layouts com estilização similar a CSS para permitir que usuários criem e editem visualizações nodo-aresta estáticas. Ilustramos o funcionamento de GraphCoiffure com quatro casos de uso: a adaptação do layout de uma visualização para fazê-la funcionar em uma dada página, a reprodução do estilo de uma visualização e sua aplicação em outro grafo, e a criação integral de duas novas visualizações. Para obter feedback sobre GraphCoiffure, conduzimos uma avaliação informal através de entrevistas com três potenciais usuários, que disseram achar que GraphCoiffure beneficiaria seu trabalho.