Portfolio Day- Extra Credit

HI SCOTT 🙂 Thank you for a great class… I hope you enjoy your summer! See you around,


IMG_2825 IMG_2824 (2)


Week 10 Peer Critique

This week I represented Project 2: Seattle Supersonics Resubmission and progress and casestudy for Project 3: Seattle Supersonics Part II (finances/call-to-action). For P2  in our critique we established that there should be a better section divide between the players section and change layouts to be more similar. Gavin suggested thinking about how a basketball court lines might be used to integrate into a  better use for separating sections and information rather then dotted circles. Alik and other classmates thought I should use baselines and the use of white space would be enough to distinguish these section divides.

Feedback for P3 to make sure I have legible sources so its a clear and convincing for organizations and target audiences to believe. Alik suggested that this section has a better flow of information and tells a story, by rearranging some of the current information I have. Gavin asked about a call to action and also suggested a different approach to this section by having something like “if I bought a ticket to one of these games, where does my ticket money go?” and breakdown where the money spent on a ticket would go and how it would impact these different areas. Scott said there can by a fictional call-to-action and have something that brings readers to conclude after reading my infographic.

I think for P2 I will be re-looking the colors used for the ring charts in players, the divides between sections with alignments and use of different color for the lighter yellow used by exploring colors used in previous jerseys or even shades of grey. For p3 I would like to include a fictional call-to-action since there is no existing one, and maybe think about having a share button, or email button. I would also like to do more research to see if there is more information I can find in order to support a better call-to-action.

Unit 9 Reading

In This Chart Is a Lonely Hunter: The Narrative Eros of the Infographic Larsen discusses infographics and the development of visualizations with supporting theories from designers/inventors. Allan Pavio has a dual-coding theory,  Douglas Nelson explains the pictorial-superiority effect, James Gleick describes how the first invention of the semaphore, telegraph, telephone, and the first digital computer all posed a dilemma for ease of data delivery. Claude Shannon invented “the bit” in the 1950s to describe the most basic unit of information. Edward Tufte was considered to be “the Godfather of information design” by many in 1983 for publishing The Visual Display of Quantitative Information. Since this time much has changed in the field of data visualization especially with web-based data sets. The reading also explores multiple examples of successful visual story-telling and visualization, my favorite being “Rising and Receding” by Nicholas Felton.

Profile 8: Truth and Beauty Operator Cairo introduces Mortiz Stefaner, an interface designer who works on data visualization, information aethetics and user design. He’s a designer known for displaying dual  natures within his projects as they are informative and precise but also enjoyable to the eyes and brain. Stefaner mentions how having a background in cognitive science has greatly influenced his work. He explains that by learning about methodology, formal systems, formal knowledge representation, data mining statistics and language he has learned how the human language works. Leaning how the human language works is a key role for understanding visualization and informational graphics because they are a separate language itself. His advice for students getting started in visualization is to be able to work with data directly and also recommends getting used to producing 10 to 20 different solutions to each challenge by using a sketching process.

Links related to reading:

This first image relates to the blog reading because it falls under what the author talks about having a sense of visual appeal but still representing a meaningful and understandable form of data visualization.



This second image is an example of a detailed sketch in relation to data visualization. This relates to the reading regarding Mortiz Stefaner and his advice to design students about having sketches as a part of your design process to gain a better grasp of what will work for you from the beginning.



P3: Project Statement

Seattle SuperSonics- Business & Revenue (part II)


The Seattle SuperSonics also known as the Sonics are an American professional basketball team based in Seattle, Washington. They played in the Pacific and Northwest Divisions of the National Basketball Association (NBA) from 1967-2008. When the 2007-2008 season ended the team relocated to Oklahoma City, Oklahoma and currently plays as the Oklahoma City Thunder. Since then there have been numerous discussions about bringing the Seattle SuperSonics back to Seattle Washington to play in the KeyArena as a part of the NBA again. My client for this project is SB Nation’s- Sonics Rising, which is a community designed to bring quality basketball content including arena and local news related to basketball efforts and a forum to discuss that content. Sonics Rising is a community formed to celebrate the 41-year heritage of the Seattle SuperSonics

Target Audience

SB Nation’s audience consistently ranks as the most affluent and influential in the sports category and potential investors. Main audience consists of males and females ranging from young adults to middle-aged who are Sonics fans that like to keep up to date with news regarding bringing the team back to Seattle.


The second part of my data visualization will be used for Sonics Rising website to display the business and financial aspect of the team following my intro and history recap visualization. The second part of my project will display how many fans were a part of the SuperSonics community in the past and how it financially impacted Seattle in a positive way.


One of the main obstacles I face with this part of the project are that the costs outweigh the potential gain of a returning team. As well as the initial cost being an investment because the financial earnings would be something to come in the future and not right away.

Key Benefits

The main benefit of my data visualization is to highlight the financial benefits that an NBA team has in the Seattle community. Our cities financial income gain towards having a returning team by looking at past data in regards to this.

 Support Statements/Reasons Why

My key benefits outweigh the obstacles because this is an investment that Seattle can potentially make which will benefit our community in many positive ways in terms of finance, job opportunity, etc.


The main tone for this design will be authoritative and subjective. It’s authoritative because it’s a potential business plan/decision and subjective because the purpose of my visualization is to influence viewers of the benefits and positive impact that having a returning team would have.


The main media use for my data visualization will be web-based for the Sonics Rising webpage and community. If the team makes an official return then my media could extend to more print as a way of getting fans involved and informed.

Creative Considerations

This project could extend with regards to where this potential return of a team happens or not. For this project it will be designed in English only, but if used in other media it could be produced in multiple languages because the NBA is diverse and represents and aids to different cultures and languages.


Screen shot 2015-06-02 at 6.14.53 AM       Screen shot 2015-06-02 at 6.15.08 AM





Unit 8 Reading

In The Rise of Interactive Graphics by Cairo he discusses the production of interactive visualizations and motion graphics over a period of time. The early lessons of interaction design is not only limited to the digital world. There are several factors to consider as guidelines for designing successful infographics: visibility, feedback, constraints, consistency. Then he talks about structuring interactive and animated infographics using several techniques for navigation and browsing information graphics: Scroll and pan, zoom, open and close, sort and rearrange, and search and filter. Lastly this chapter introduces the different kinds of interactions and breaks them down to: instruction, conversation, manipulation, and exploration and how we can plan for these different types of infographics.

In profile 7: Quantitative Humanism Cairo introduces Hans Rosling who is a professor of International Health at the Karolinska Institute in Sweden. He is the head of Gapminder which produces software that helps visualize publicly available data and has a goal to raise awareness of world health issues using statistics and animations. He tells us that Gapminder consists of three types of people, the statistician, the engineer and the designer and when they are all working together they compile better results. They have an advantage because they speak different languages and come from different cultures which in the end brings a better variation to the table.

Image in relation to reading:

This image relates to the reading because it is a Gapminder mapping of The Wealth and Health of Nations in 2012.


Example of Excellent Data Visualization:

I really liked this data visualization, it’s interactive on the link provided below and has a similar aspect to our reading about the gapminder mapping.



Unit 7 Reading

In Profile 6: Visualization in Academics, Cairo discusses an interview with Geoff McGhee who is an interactive data visualization and multimedia story-teller at the Bill Lane Center for the American West, a research institute at Stanford University. In Cairo’s interview with McGhee, he mentions how he is a unique designer in the sense that he has a “unique position to bridge that gap” he’s worked in that not all designers typically work in. McGhee stresses the importance to understanding wed graphics and the intensity of time and labor within it. Online graphics are labor-intensive because they are databases in an essence and not just a summary of data. McGhee’s career change into academia was due to him feeling a need to learn more about what’s going on with information graphics and visualization because when he was working in media he was aware of the many innovations to be learned. Some of these being new tools, new techniques, new practices, and so forth.

I found it interesting and also inspirational that he was a professional journalist who was interested in computer science, data and visualization and made that jump into a different career path but was able to use that to his benefit, which makes him this unique designer. Simply because, I myself would like to major in the Graphic Design field, however I have a separate passion and goal to work in the Medical Field one day and would like to back to school for something entirely different but would still like to correlate the two fields to my advantage. The field I want to go into but am still thinking about is radiology, which is separate from the design field but does deal with images and visualizations in a different sense. So I really did enjoy reading about his career story and how bringing people together with different skill sets could be beneficial.

Image in relation to reading:

This is an interactive piece that was designed by Geoff McGhee, Lauren Sommer and Maria J. Santos which depicts the Bay Area and it’s long history in preserving open lands. It relates to our reading because its one of many designs Geoff created while working with two other designers and displays some of his skills as a multi-media designer (with interactive design).

Screen shot 2015-05-21 at 9.46.48 PMhttp://west.stanford.edu/node/1309

Example of excellent data visualization:



Unit 6 Reading

In Chapter seven Images in the Head, Cairo discusses the brains process and interpretation of images through memory and its relation to designing great infographics. He explains how visual perception runs through our brain in two opposite but convergent ways. Bottom-up processing is the first pathway, which starts in the retina and runs to the brain, while top-down processing retrieves contents from our memory and  brings them into visual processing.  When the information is obtained it it then processed and stored in our iconic memory, which is a very short-term storage for visual information. The role of iconic memory in perception and cognition if to keep a coherent picture that can later be interpreted with your brain. Then he discusses the use of realism where a realistic picture is used in visual representation. However, it is noted that realism is not always the best choice for visualization because of iconic component imagery. This explains the brains ability to identify more abstract images that are simple and interpret them in a shorter period of time due to less detail and distraction.

In profile five Germanic  Precision, Cairo talks about Jan Schwochow whos is an executive creative director of the infographics agency called Golden Section Graphics. Cairo interviews him about his work experience in the field and notes him as being a serious and precise designer. Schwochow hold strong belief that “the whole point of infographics regardless of if they are statistical charts, maps, or explanation diagrams, is to be accurate“. In this chapter there are many projects which Shwochow and his team designed and he mentions how many times they work with multiple clients at one time. The process work includes research, writing the copy, designing the layout as well as creating the illustrations and 3D model work. He also mentions how his team consists of various workers whom all specialize in something different (programmer, animator, mapping software, geographic information systems, ect).

Image in relation to reading:

This infographic can relate to the reading because its minimal details works to beneficially inform the audience without unneeded extra details. It uses simple shapes and colors that allow us to identify a house and navigate through the infographic effortlessly.



Example of excellent data visualization: