Weave Graphic Design

Introduction

In reaction to feedback from our users, the CT Data Collaborative has been working on the graphic design of Weave tools.

In prep for that, we identified the parameters we have been tweaking to develop a clean and modern look and feel in the tools.
He figured out how things work by changing many aspects of the session state to see what they did (one resource that we should develop together with UML is a dictionary or guide to what each session state parameter does).

Sunlight Foundation Guidelines

The Sunlight Foundation recently published guidelines for the design of data visualizations based on their work

https://sunlightfoundation.com/blog/2014/03/12/datavizguide/

Session State Parameters used to date

Here are some of the parameters we have found to adjust the look and feel -- PLEASE ADD MORE FROM YOUR EXPERIENCE

This Bar Chart setting can be controlled from the tool's control panel
  • barSpacing – Changes the spaces between the bars
This Bar Chart setting does not have a GUI editor:
  • lineStyle > SolidLineStyle – Change the opacity of the line around the bars/turns off bar borders
These Data Table properties can be configured using the tool's control panel:
  • showColors - bin/color rows in the data table
  • backgroundColor1 & backgroundColor2 - Change the alternating lines of the data table – This website has decimal color values http://www.mathsisfun.com/hexadecimal-decimal-colors.html
  • showControls – show export, clear, edit, move button in data table
  • showFilters - show filters on the top of table
Common axis settings which can be configured via the tool control panels:
  • axis rotation, spacing, alpha and weight on axis and sub-axis lines.
  • You can add a "%" sign at the end of a percentage value in two ways. You could edit the tick label function in the axis settings (http://i.imgur.com/ew1sKgO.png) or you could set a string formatter in the admin console (http://info.oicweave.org/news/22)

Additional session state parameters we would like to have

Parameters we would like to gain control over to customize but have not figured out yet or are not yet available. PLEASE ADD YOUR IDEAS HERE. Once we have a few, we will add to REDMINE as a feature request

  • Changing specific fonts for each tool or area of a tool (title, x-axis, y-axis, table headings, etc.) individually - You can currently set three global font settings in Window/Preferences: title font, visualization font, axis title font. Is this sufficient?
  • Copy/paste tools, specifically annotations - we have to create a new annotation for each new text box, re-set all settings. Very time consuming.
  • Could already be possible (as seen in Utah) - the ability to unlink tools so they can be updated by different attribute selector tools or change values when a year is changed.
  • Controlling the height and color of bar chart column headers – Not always able to see the titles
  • Might a chart’s border be colored independently from its gridlines? It currently looks like the gridlines are rendered in front of the border. If you wanted, say, a solid black border with grey gridlines, I’m not aware of way you could do that currently (the grey would show up like tick marks on the border) (T.Harrigan, ProvPlan)
  • Can the vertical and horizontal gridlines be assigned colors and thicknesses independently? There are cases where a user might only want the horizontal gridlines to appear, or perhaps only the vertical gridlines (i.e., thickness of "0" and/or color matches background)

Examples of different designs in Weave

Please add links to your work in Weave and commentary.

Connecticut

(to be added soon)
  • Link:
  • Commentary:

{{comments}} {{comment_form}}