Simon Says

Hi

Here's what I have so far. So it's basically a wheel 'o states. The big orange tab can be dragged to each slot and from there you will be able to see which state ranks highest or lowest in these four categories (icons subject to modification). Currently we're on suicides, so all the states are magnetized to the suicide guy. If you were to switch it to pets, they'd all move 90 degrees to the pets. Note also that the circle is orange. Dragging the tab to another category will change all circles to that categories color.

So what if you want to start comparing things? Well when it's done you will be able to click anywhere on the outer edge (a + will show up on mouseover) and you'll be able to add another tab. This tab will then have to be placed on one of the other three categories. The states will then magnetize between the mean of the locations of the two states. So for example if you picked suicides and parks, the states would all hang out between 12 and 3 o'clock. The color of the circles would become a combination of the two category colors. Dragging a tab off the circle will remove it

So I spoke to Stacie and there's a couple of things that will change once I get some time.
1) Icons need work
2) Type is too small
3) Not too clear right now, which is the highest and lowest percentage
4) Category colors need to look more indented so they look like you can drop tabs on them.

What I'd love some feedback on is this concept of moving the states around between the mean of multiple categories. If you were to pick pets and suicides, would the information on the edges mean something to you (near 12 and 3). Would you want it to? How would you highlite that?

What if you picked suicides and weather, would everyone be ok with the circles splitting between 12 and 6?

I also want it so that these icons aren't floating like they are right now, any ideas would be appreciated.

Thanks!

Burn Your Calories

I made an swf. file as my rough digital sketch, but couldn't figure out a way to convert it to a format that I can upload on this blog, so here are some screenshots from it. (No comments yet on type, colors, and layout kind of issues. They aren't refined at all.)

It is going to be an interactive piece that allows users to select a type of exercise and food to compare at the beginning and also asks them to input their weight to filter the information (I believe showing all the calories burned by people with different weights would be unnecessary.)


After exercise and food type is selected, the movie shows the animated images of the exercise scene with the time bar sliding to the left and the red calorie circles getting bigger and added. For the food, I'm thinking of making it gradually disappear over time and at the end of exercise, at which point the user click on STOP button, showing the number of calories burned.




Further issues to consider include...
1. Adding a button to the first screen or some other ways to enable the users to select other types of exercise and foods at any point + to change the weight.
2. Exercise intensity: displaying the options (light/moderate/vigorous or different speeds) the users can choose from.
3. Ways to compare different types of exercise: showing more than one type at the same time (e.g. rowing moderately vs. running at 8mph)
4. Exercise summary: showing the number of calories in total after the user finish interacting with it. Or at any point, have a space on the side that stores all the info the user has been looking at.)

This is it for now. Your feedback will be much appreciated!

my Book

Topic: Map out natural disasters that have occurred over the past century. Also showing the death toll from each of the natural disasters.

So for my product I am thinking of creating a book of these natural disasters. The very last page would be the map of the globe. And each page in the book would be a grid made of string/wire. The grid would be the longitude and latitudes of the map. A page would represent the decade's number of natural disasters. The natural disasters would be represented by dots or pictograms or symbols. This is my initial idea and I'm still thinking through if this will be the most effective way of displaying the information. I'm still having trouble deciding how those dots will be represented in terms of the actual form and how that form will not only show the natural disaster, but the number of deaths.
Perhaps the dots will be a height or a particular kind of intensity.
More to come.... I'm going to test out this idea by mapping out a few decades.
please lend me your advice.

Squares and Circles

So I came up with two ways of how this thing is going to work. I worked digitally for one and on whiteboard for the other. I think once I have this nailed down, I will go back and revisit my representations of actual states.

The first one is the digital representation, it's a rough design and in no way final. I've been thinking about splitting the output into tiers and then distinguishing between those tiers. I think I need to think about this programatically, just to help me figure it out. So anyway, the math goes something like (%of suicides + % of other) / (#of other variables), that then gets put in a matrix and sorted by value. From there you can split it up into top 20% and so forth. While there's math going on in the background, I just want this to be least to most for my visualizations, which is why the lines aren't labeled yet. What I'm wondering about is whether having 5 rows of data, each with things going from big to small is going to be confusing. Maybe each circle needs to be in relation to all other circles, and not just the circles in their row. I also wanted it to be clear that the data being shown is a combination of sucide numbers plus something else. The representation and organization of data is something that needs to be resolved and I'd love feedback on that.


I'm actually much more excited about my second idea, it's a more integrated solution. I think the logic behind it is the same, but the representation will be different. The idea of most to least still persists, but it's more like a bulls eye. What I started thinking about here is building controls onto the actual visualization. This is something google analytics does very well where the lines between the data and controls are blurred. The hand means you could actually rotate the circle to move between the data types. Each data type would be color coded and moving the wheel would change the color of the background to correlate to them. The circle would snap to one of the 5 data points. The whiteboard example is currently on all, hence the thick orange background. This approach is different to the first one because you can only view suicide + one other variable, or all, not combinations. I think I'm ok with that, but would be interested to hear what other people think. I think what I like about this is it lends itself to different types of representations for the data types, I can see them morphing as you move from set to set. I'm wondering if the inner circles could be controls for other things or if that would be too complex.

Burn your calories in 30 minutes

Ok, so what I've come up with so far isn't much in detail, because I was having a hard time deciding on the amount of info to show. But anyway, here's what I'm thinking for now.

- Exercise type: jogging, rowing, weightlifting, stretching
- Duration: is set as 30 minutes
- Calories
- Weight: 130 / 150 / 170 lbs.
- Speed for jogging and rowing / Intensity for weightlifting and stretching
- and Foods with equivalent calories

4 types of exercise will be my main Categories and I won't need much of other things in LATCH. Instead the most effective way to help the audience understand the info will be by comparison among types of exercise and those with food.

As for ways to represent each variables,
- Exercise type: photographs or movies
- Duration: time bar or clock-looking circle
- Calories: bar or circle (different sizes)
- Weight: simple body figure
- Speed for jogging and rowing: actual speed in movies or flipping photographs at slow or fast speed / Intensity for weightlifting and stretching: not sure yet about this
- and Foods with equivalent calories: illustrarions (simple line drawing)


(This is NOT what I'm going to use, but just my first attempt.)

And I'm trying to storyboarding now, which will be like as follow.
- Intro: title with images (moving or static) of ALL types of exercise popping up randomly
- Main: zooming in on one image to show details of the exercise, calories and food and zooming out back to the first scene, repeating this 4 times for each type of exercise
- Ending: Back to the first scene, but with images of food overlapping

I'll be filming and/or photographing my friend at the gym over the weekend and also am working on figuring out the main part. More posting will follow!

the sketches

natural disaster sketches

The visual representations I was looking into were those that represent the 7 different types of disasters:

• Biological - epidemic and locusts
  
• Climatological - extreme temperature
  
• Geophysical - volcanoes, earthquakes
  
• Hydrological - flood, mass movement water
  
• Meteorological - storms
  
• Technological - industrial, transport, misc accidents

Below is a quick sketch of some ideas: