Journal » Entry

Visualization and Interaction Concepts

While working on the prototype environment, I took one step back to collect all the pieces that are currently flying around and bring them into visual form. Some of the sketches simply represent visualization ideas for specific dimensions of the financial data set. Others illustrate functional concepts e.g. how the user explores, analyzes and manipulates the data and the visualization.

Visualization

sketch_balance_aligned
sketch_balance
Two different layout versions to show the earning and spending in conjunction with the overall balance.

sketch_categories
A simple representation of the earning and spending categories as parts of a whole. During implementation labeling has been very difficult and the overall visualization doesn't provide much information that can be analyzed. Further concepts could be to nest the categories and then make the subcategories accessible through drilling down.

sketch_categories_timebased
Another visualization of the categories but this one shows the categories over time. This tells a much more interesting story as it allows the user to examine how his behavior has changed over time instead of just looking at the status quo (although this may be of importance for certain use cases).

sketch_comparison
A very simple and easy to understand comparison with different benchmarks like anonymized peer groups or a historic view on the personal average.

sketch_projection
A concept to show uncertainty and variance in the model applied to the projected timeline.

Interaction

sketch_manipulation
This concept could be part of an interface to manipulate a financial model: Directly interacting with the spending categories connects the mental model of the saving goal with the actual spending objects and therefore makes the required changes in behavior more tangible to the user.

sketch_goal
This concept allows the user to setup a financial goal on his projected timeline. The visualization shows the additional saving to achieve the financial goal. Positioning the goal should be as direct as possible e.g. by simple dropping it on the timeline and reposition it with the immediate response from the other visual elements (the calculated delta).

sketch_modelling
This concept allows to quickly evaluate the impact of events and the relation between longterm outcome and time stamp of the event.

sketch_scenario
This is both a visualization and an interaction concept for adding a spending plan and evaluating the longterm impact of such a decision. Changes to the date of spending and the amount should be as fluid as possible to allow playful experimentation.