Data Mapping: Where Will I Live Next???

(Project Mapping Exercise - click to view.)

Project Narrative:
For this class assignment, I had to create an information map that tells a story using visual design and data sets. I began my process by thinking in the traditional sense of maps; geographical spaces in which information is displayed about various locations on the map. After further probing into the concept of data visualization, I realized that the content chosen can not merely show data, but rather serve a purpose of helping the viewer draw conclusions and make decisions.

Since I plan to move in a few years, I decided to do a comparison of potential cities I would like to relocate to. The cities I chose are Portland, Oregon, Chapel Hill, North Carolina, Charlotte North Carolina, Atlanta, Georgia and Jacksonville, Florida.

At first glance, the project sounded as if it would be a cost of living analysis. A comparison of cost of living based on my current salary was not as interesting or engaging as doing a comparison of factors that I feel are important when considering relocating.

The factors I decided on are People: Ethnic and Gender Identity, Food: Organic/ Alternative Markets, Transportation: Public Transit Systems, Housing: Home Prices, and Education: Tuition.

Here is a breakdown of relevance and importance of each factor.
People: Ethnicity and Gender Identity – Having grown up in the South; being surrounded by people of color; it is a natural desire to live in a city that ethnically diverse. In addition to ethnicity, it is also important to reside in a city that is open and gay friendly.
I originally had three specific ethnic groups identified: African American, White and Latino. I was able to find US Census data on African American and White populations in the cities I targeted, but was not able to find concise numbers on the percentage of Latino in these cities. Therefore, my data set only includes African American and White identified people. It was interesting that I found several articles discussing the growth of the Latino population, but no concrete numbers.

For gender identity, I am referring to the presence of same-sex couples, in particular female to female. Having experienced a spectrum of societal responses from the closed mouth religious dogma of south, to the out and proud rhetoric of the west coast, finding a city in which people are afforded the opportunities to be their whole selves is extremely important.

Food: Organic/ Alternative Markets – Being a health conscious individual, I prefer to shop in grocery stores and markets that offer a wide selection of organic, whole grain, healthy foods. Whole Foods Market and Trader Joes are two of the largest and most popular chain stores within that offer this shopping experience. Therefore I choose to collect data on these two stores.

Transportation: Public Transit Systems –An affordable and accessible public transit system is another priority for choosing my next city to live in. I have focused on the train system versus the bus system because realistically I would not ride the bus that often because they take too long.

Housing: Home Prices – House prices are important in helping to determine if I will be spending more money on a mortgage than I desire.

Education: Tuition – The cost of an education and taking classes is relevant because I identify as a life learner. Having reasonable tuition prices will dictate the feasibility of me to continue to take classes.

Conclusion - Researching and analyzing the data for this assignment provided me with statistical data that will influence my decision on where to live next. Not only does it provide factual analytical data, but also shows a trend of items that are important to me that I did not know existed in some places and in places where I thought items would exist, they do not. This enlightenment paints a different picture of the cities I have researched; in particular Atlanta coming out on the high end of my radar, with Jacksonville falling on the low end.

Using Maps to Tell Stories

Draft
http://student-iat.ubalt.edu/students/ingram/data_visualization/cost_of_living_draft.htm

Building Process Flows for Business Processes

For this assignment, I diagrammed the activities to process a financial aid grant application.

During the first iteration, I only included 2 actors and unlabeled. But after feedback from the class, I added 2 additional actions and realistic job role labels. I also added more description in the title to make it clear that this is a financial aid grant application versus another type of grant application. Other aesthetic improvements include removing the gray border lines that separated the job roles; in place of the lines I have added pastel colors to make more natural borders.

Rough draft version (click on image for larger view):



Final version (click on image for larger view):

Internet Access Between 1998 and 2000: A Comparison of Demographic Data

Project Overview:
The idea of the “digital divide” has appealed to me since the late 1990s when computer manufacturers freely distributed computer equipment and telecommunications corporations started wiring public schools. The “digital divide” is the concept that of the” haves” and “have nots” in reference to access to computer technology; with a particular focus on comparing people based on ethnicity, income, education and location. Research during this era revealed that low income people, people from rural areas and non white people did not have access to computers and the internet as readily as higher income people, people from suburban areas and white people.

I decided to create my analytical data representation for internet access based on ethnicity, income, education and location between the years 1998 and 2000. My goal is to show a connections between income, education, location and ethnicity as it relates to internet access.

Process:
I began with the idea of looking at trends in broadband access using the demo graphical information from above. The more research I did on analytical data displays, I realized in order to tell a more compelling story, I needed to not only look at trends among demographics but also compare spans of time. Early research on internet access focused on dial-up not broadband. In an effort preserve the integrity of my analysis, I choose to use a set of data that provided a one to one match.

During my brainstorming activity it became clear to me that since I had four variables I wanted the data display to be as clean as possible; therefore I used graphics instead of words to portray the data. My sketches show the progression from using lines and symbols to full blown graphics.

(Click image for larger view)

Brainstorm sketches.

The Data:
This table lists the data used in my graph.
(Click image for larger view)


I used Tuft’s fundamental principles of design to prepare and display my data (Reference A).

Fundamental Principles of Analytical Design:
1) Comparisons: show comparisons, contrasts and differences between data. For my data set, I am comparing internet access of certain groups of people. The contrast and differences are evidenced in the gaps between populations based on demo graphical information.

2) Causality, Mechanism, Structure and Explanation: show the cause and effect. Based on the data I have provided, these relationships can be made:

• people with higher income levels have greater access than people with lower income
• college graduates have greater access than non college graduates

It has been reported that on average college graduates earn more money than non college graduates. Therefore, the conclusion could be drawn that the higher income people are college graduates, in which the cause is they graduated from college and the effect being they earn more income and therefore larger numbers of this group have internet access.

3) Multivariate Analysis: show more than 1 or 2 variables. My data set contains four variables: income, location, education and ethnicity. Here are the data set definitions:

• Income - greater than $75K a year, lower than $35K a year
• Location - Urban, central city and rural
• Education - college graduate, high school graduate, and no high school degree
• Ethnicity - Caucasian, Latin, and African American

4) Integration of Evidence: completely integrate words, numbers, images and diagrams. The integration principle has been demonstrated by using a graph structure to display the data. I have used graphical illustrations, combined with words and numbers to communicate the data.

5) Documentation: thoroughly describe the evidence. I used a data set compiled by the NTIA and ESA. This information is clearly displayed on the diagram.

6) Content: provide content of quality, relevance and integrity. The content provided can be used to track the trends in internet access between 1998 and 2000.

(Click image for larger view)


Conclusion:
The major trends in internet access between 1998 and 2000 are:

• In 1998 there was a huge difference in access based on income. In 2000 this gap has been narrowed.
• Location is still a major factor in access. Rural and central city populations continue to lag behind urban populations. Research has show that in some rural areas the internet has not been available.
  
• The gaps between education levels are significantly higher in 2000 than 1998. By 2000 the more educated people have larger numbers with access to the internet.
• The gaps between ethnicity did not change much between 1998 and 2000. Non white people had major lags in internet access.

Have intentionally not drawn cross relational conclusions on the data sets. For example, stating that there is a connection between leaving in a rural area and being low income or having no high school education and being low income, etc. I do not feel as if I have enough information to draw these types of conclusions.

Reference:
A) Tufte, R. Edward. Beautiful Evidence. Cheshire: Graphic press, 2006.

Constructing Icons: An Examination of Icon Design

Project Overview
For this class assignment, I created a fictitious scenario in which I have been hired by a web conferencing software company to create a desktop application icon. This icon will display on the end user’s desktop once the application is installed. The icon will also be used on their website and in marketing collateral about the product.

The icon must represent meeting via the web using audio, video and application sharing. The target audiences include corporate and educational sectors.

History of Icons
To begin my project, I conducted research on the history of icons in an effort to understand the origins of icons and their original function in society. In Uday Gajendar's article titled "Learning to Love Pixels", he mentions the origins of icons dating back to the Byzantine Empire in the 6th century (reference A). These types of icons were used to portray Biblical stories to a mainly illerate population. The format of these icons were paintings on wood tablets. A key concept in the historical research is icons were used to communicate information using images rather than letters and words.

After understanding the history, I then collected information on design guidelines and principles of icon design creation.

Icon Design Guidelines and Principles
I have broken down the process into these main categories in which the design principles are incorporated.

Phase 1: Brainstorm
During this phase, I started with a brainstorming activity in which I identified metaphors to illustrate the meaning of the icon and interface function behind it (reference B).

My braistorming consisted of thinking of patterns and behaviors used during web conferencing meetings. Images/ metaphors that came to mind included telephone headsets, computer monitors/ screens, wifi connections, and collaboration of multiple parties.

As with all my visual design projects, I used tools like Google, existing software companies, and istockphotos.com to search for visual images of the metaphors listed above. The existing companies were WebEx, GotoMeeting and Adobe Connect Pro. The company icons for the applications did not reflect the metaphors I defined. WebEx using a green and blue circle without any line art. GotoMeeting uses a design that looks like a flower with several petals. In actuality, it is a group of networked circles. Adobe’s Connect Pro icon is an abstract drawing of wavey lines.

Design ideas from brainstorm activity:
I came up with nine design options, but narrowed my choices down to three. The final design was conceived using a combination of ideas from these three options.

Phase 2: Define Style and Tools
During this phase, the icon style and development tools are defined. The Operating Systems' (OS) manufacturers have specific guidelines to refer to when designing OS dependent graphics and icons. For this project I am designing a custom styled icon; therefore I have more flexiblity in my design parameters.

Soft Facade, an icon development firm, suggests following these four rules when designing custom icons (reference B):

• Design icons that will ideally fit the interface environment where they will be used. This means you should not create cartoonish icons for enterprise application and vice versa.
• Choose appropriate colors and create basic swatches and gradients, this will save time over the course of the project.
• Use consistent lighting, shadows, and perspective.
• Sketch down the shape of basic elements to define the unique style.
  

For my icon style, I used blue as a background color, with red and brown to highlight my main image. I used round corners and shading to give my icon a modern look.

The tools used during the design phase were pencils and ink pens to complete thumbnail sketches of my ideas. It is recommended to use a vector editor to create the final icon. I used Adobe Fireworks to manipulate my graphic images and Adobe Illustrator to compile all my design elements. There are separate software tools available to create the .ico file extension.

Phase 3: Design
The design phase is where all the pieces come together. Here is the suggested process for design:

1. Determine size. Size parameters are large 512x512 to small 16x16 icons. My final icon for the desktop will be 48 pixels by 48 pixels.
2. Sketch ideas based on themes/metaphors identified in the brainstorming phase.
3. Choose the top two designs to build upon.
4. Transfer pencil/ paper sketches to the computer. Draw concept in sa vector graphics program. Make large and small versions.

Conclusion
Designing an icon requires the same thought processes required for designing other visual communication devices. The major difference is you have a smaller amount of space to work with. Which means your icon must capture the meaning using a minimum amount of lines.

Final Design - Large View
The icon represents a person with a phone headset, meeting with several people using the computer and the web.


References:
A. Learning to Love Pixels, http://www.boxesandarrows.com/view/learning_to_love_the_pixel_exploring_the_craft_of_icon_design

B. Icon Design: Basic principles explained, http://www.softfacade.com/blog/icon_design_basic_principles_explained

Additional Resource:
7 Principles of Effective Icon Design
http://psd.tutsplus.com/articles/7-principles-of-effective-icon-design/