Paper Topic: Visualizing Energy

For my capstone, I aim to create a website that helps dorm residents become more aware of and reduce their use of electricity. To do so I plan to hold an energy-saving contest and then display real-time data from electric meters on the site. My inspiration comes from a project done at Oberlin College:

energy dashboard 2energy dashboard 1

For me, the most difficult design challenge is in how to represent energy–something invisible, abstract and taken for granted–in such a way that makes visible, tangible, and meaningful.  For my paper, I want to look at the Oberlin site, and analyze the paradigmatic choices for representing the data. For example what meaning is communicated by the use of: a horizontal bar chart, colors ranging from green to red, a dashboard interface metaphor, the ability to change the units of measurement, etc? What different design choices could have been made in these cases and how would that have changed the meaning?

I hoping that this exercise will produce some actionable design concepts to make my capstone project more effective. I would appreciate any comments or suggestions for improvement.


  1. Dave Roedl

    The overall goal of my design as I am defining it is to motivate the students to change their behavior, while also educating them about the bigger reasons to do so.

    To be more specific, I think there are three communicative goals of the web interface: a) show a comparison of the performance of all the dorms in order to motivate the students to compete b) allow the user to correlate the data to their individual behavior and c) appreciate the value,cost, consequences or otherwise significance of energy. With this in mind I aim to deconstruct the Oberlin interface in order to expose its strengths and weaknesses and then use those insights to generate my own design.

    So far, I have identified three different cultural forms that are brought together into this application:
    1) data graphics – the central visuals are a bar chart on the first page and a line graph on the second
    2) vehicle dashboard gauges – a visual metaphor of a speedometer and odometer is used to represent quantities of energy
    3) Icon-based menus from HCI – the primary user interaction is to click on different icons in order to change the unit of measurement

    Each of these paradigms suggests different connotations and ways of interpreting that will shape the users understanding of what energy is and how they should react to the data. I plan to criticize how these different paradigms interact in the interface and the relative emphasis given to each by the layout of the page, or ordering of parts.

    To dig deeper, I also want to analyze the paradigmatic choices made within each of these smaller pieces. For example, what is signified about the dorms by the horizontal orientation of the bar chart and the use of colors in coding each bar? Or what is said about the meaning of ‘sulphor dioxide’ by the icon that represents it?

    Although I have chosen to look at only two screens for this paper, I am finding that there are a lot of different things to talk about.

  2. jeffreybardzell

    the most difficult design challenge is in how to represent energy–something invisible, abstract and taken for granted–in such a way that makes visible, tangible, and meaningful.

    I really like this idea as a general goal. And I also like how you have chosen in particular to look at the Oberlin solution, and I think that will work.

    One thing I found interesting was that in your list of cultural precursors, all were broadly speaking in the domain of interaction design. So that made me wonder if you were casting your precursor nets widely enough. That in turn made me wonder, well, what other examples are there out there of interfaces that make abstractions visible, tangible, and meaningful, besides computer-based visualizations?

    Now I’m going to list some outrageous examples, not because I am seriously recommending that you build your paper around them, but rather because I hope they illustrate a way to think more broadly about your topic. How does a medieval church render tangible ideas and ideals about God and the upright human? How does a subway map render tangible an underground train network? How does a sonnet render tangible love? How does a TV or magazine ad render tangible a reality made more ideal by a given product?

    It seems to me, thinking off the top of my head, that in all cases the intangible is rendered in a coherent and stylized way, which simplifies, clarifies, and even idealizes that intangible.

  3. Dave Roedl

    Thanks Jeff, these examples are inspirational and even mind-boggling (in a good way). They are helping me to think more out of the box about this problem.

    One thing I’m worrying about though as I’m interpreting my particular is that I haven’t chosen one unifying theory or framework to ground my criticism. None of the concepts from class really pop-out as being the most relevant theory to this problem. As a result I’m sort of picking and choosing a large assortment of ideas from semiotics, Manovich, film theory and elsewhere. Some interesting ideas are occurring, but I’m worried this is gonna turn into a tangled mess with no coherent argument. Is this a dangerous strategy?

    A different idea I had is to ground my criticism in Tufte’s principles of information design, since the core of the interface is a quantitative representation. While Tufte makes prescriptive claims of a modernist analytic bent, which may not be the most useful in all cases, I’m thinking it might be interesting to put Tufte into a dialogue with this particular interface. In other words, use Tufte to critique the clarity of the Oberlin site and use the Oberlin site to question Tufte’s assumptions of what data graphics should be all about.

    Any one out there, let me know what you think of this ;D

  4. Dave Roedl

    Ok, scratch that. I’ve decided now to return to the basic design challenge stated above: how to make energy both visible and valuable. I will discuss this issue in detail, relating to it to two design goals. The short-term goal is to change behavior for a temporary period in order to reduce costs and emissions for the campus. The long term goal is to educate and change the students overall conceptualization and awareness of energy flows, in order to bring about a more sustainable culture.

    I am going to frame these design challenges in terms of representation: how to represent the real phenomena of energy consumption on a two-dimensional computer screen. I will be drawing primarily on Manovich’s discussion of the oppositions inherent in new media representation. Using this to critique the Oberlin design, I will show how particular representation strategies (remediated from various cultural forms) create tensions in which some design goals are emphasized at the expense of others.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s