Friday, June 22, 2007

Design Principle 1. Placement

by Ryan Goodman

1. Placement: The underlying theme to placement is a consciousness to arrange individual or groups of components on a page to dictate a visual order of magnitude; not just to fill whitespace. If you have read other design books or articles, they always state that the most important screen real estate is at the top left and center of the page. I use the diagram below to explain a natural path that your eye will follow for any page that your view. Notice how the first two points on the page are the upper left and center, followed by the lower left and right, then up to the top right corner. Knowing this can help you in placing elements that are most important (navigation, top priority information, measures).

Regardless if you looking at print or digital media, your eye will follow this natural path in a split second before you even begin digesting what information is on the page. From there, it is other design practices like contrast that will pull your eyes in the direction the designer intended.

A commonality in dashboard design that I often see is a large logo at the upper left hand corner of the page. Try to fight the urge to do this.. Unless it is a marketing exercise and you want your company name front and center, which in many cases is still not the most important information you want to convey to your users. Your logo will fit best in the lower left corner of the page.

Next week we will talk about Proximity and how you can create visual connections by placing components on the screen to draw visual connections.

Friday, June 1, 2007

2008 Presidential Election Data Visualization Idea

by Ryan Goodman

I know this is a break from my typical content and my series for my 5 dashboard design principles... I will get back to them next week.

Here is an idea I have been playing with. If someone knows of something similar that already exists, let me know. It is one of those ideas that would be extremely useful if deployed by a creditable organization.

Problem
Scenario: Like every other American, you are eagerly awaiting the 2008 presidential election to cast your vote for someone who at a minimum, is articulate enough to communicate to the public without sounding like an idiot. A huge % of the American population feels some, or all of the pain points listed below as they try to ramp with correct information to make an informed decision for their next president:

  1. Some do not know the difference between candidates other than how they are presented in the media (TV, Internet, etc.)
  2. Some know the difference but are inundated with so much skewed or incorrect information from other's personal opinions and interests (TV, Print, Online, other people).
  3. Many feel a missing ability to breakdown of all candidates based on specific issues, with an ability to stand them up side by side.
  4. Most don't have the time or energy to dig and read through all of the information available (even if it is summarized).

So maybe there is something out there already…I have not found it. What we have here, is a wide target audience (American over 18) who all have a common interest, with no existing tool to fill this gap that I have presented. So here is what I propose….

Solution
An online application that enables anyone to identify their best choice for the 2008 election based on their own personal beliefs on specific issues (Economic, Social or Political). The idea is to enable someone to align themselves to a candidate who's stance is similar based on issues using the application to do the heavy lifting. The proposed application would streamline the process for making an informed decisions through a seamless, easy to use interface with unbiased, correct information.

Application Description/User Experience

1. User Input
Upon entering the application, the user would enter some basic information.
-Demographics: Age, Sex, Location, Political Affiliation (basic)
-Additional Information (optional): Job, Income, Family, etc..

2. Issue Identification: Social, Economic, Political, etc
The user would then navigate through a comprehensive list of Social, Economic, and Political issues. The user would then indicate the importance/weight of that issue and their stance. An important aspect of the application is flexibility to identify issues that are relevant, but also provide a means for education on all issues.

3. System Output
Based on the user input, the application will provide realtime feedback by providing a matching list of candidates based on similarities to the user defined issues. There are 2 ways that the system will identify matches which the user can toggle between.
1. Factual: A list of candidates who hold the same opinions or plans for issues the user defines.
2. Subjective: A list of candidates who other people in the same demographic select as their best choice.

Next Steps in User Experience

Once you have your initial input complete, you can do several things

  • Modify your criteria slightly, and see in real time how that effects the recommendations
  • Drill into individual candidates for background information, details on specific issues, plans, history, current news, etc
  • Make a decision to save you top candidates and/or choose your candidate if you would vote today.
  • Navigate to additional analysis in how you compare to the rest of the country:

Additional Analysis: The potential analysis that can be drawn from this system is a dream come true!
  • General demographics vs Specific Issues (importance and stance)
  • Changes over time across all analytics
  • Candidate Poll information