calvin_yeung_project3


 * Project 3: Barclay's English Premier League Visualization**

//Final & Process Work is in Drop Box//

http://soccernet.espn.go.com/stats/attendance?league=eng.1&cc=5901 http://en.wikipedia.org/wiki/Premier_league http://www.processing.org/learning/index.html
 * Sources**

For this project, I wanted to focus on the attendance records of the 20 teams in the Barclay's English Premier League. Initially, the data that I was going to use only consisted of the average attendance of each team on their home pitch, and the specific attendance record of individual games. The teams would be visually represented by circles, whose size was determined according to the average attendance at their games. Lines would connect teams together, and another circle would be generated on top of the home team's circle, comparing the attendance number of that particular game between the two teams to the average attendance (the good thing about the Premier League for this project is that each team only plays the other 19 teams twice, one at home and one away, thereby making it easier to follow and graph). This concept would be organized by date, as the user would theoretically be able to go to a date, and see the teams playing, then click on them to see the comparison.
 * VIsion & Rationale**

This initial organization method presented me with a few problems: one was the possible lack of games on some dates, although I could've adjusted the data to better suit my needs. However, the second problem was the lack of structure in the placement of the circles on the screen. At first, I had the circles moving around freely on top of a soccer field to present some movement into the visualization, but then it lacked purpose and would probably be confusing to the user. The idea I came up with later and ended up using was to use other data to implement some sort of structure to the placement of the circles. Due to the focus on attendance records at home for each team, I chose the current standings of the teams in the league, which is based in points, and the number of home wins for each team. I would then use the two data sets to create a graph, which would assist me in knowing where to place each team. This way, there was more data that could clarify exactly the position of each team in the league, their popularity according to attendance records, and a probable correlation between the number of points and the number of home wins equating to a higher attendance average. After I graphed the data, this proved to be largely the case except for a few exceptions such as Newcastle and Sunderland, who are mediocre teams but manage to draw a large crowd regularly; also Chelsea, who is one of the top teams in the league but their attendance is substantially lower than other top tier teams (I later checked and found out that Stanford Bridge, their home stadium, only holds a maximum of around 44,500 people; in their case, the size restriction of the stadium limited their attendance). Regardless, I now had a structure to my information.

Continuing from this concept, I now had no need to organize according to dates, as all the teams in the league would be visually represented. I decided that the visualization would run on two modes, Normal Mode and Comparison Mode. In Normal Mode, all the teams would visible, and basic relevant information such as home stadium, average attendance current standing/points and home wins would be shown when the user rolled over the circles with the cursor. The user would be able to click on two teams to compare, then after clicking on the second team, the visualization would transition into Comparison Mode. In this transition, a line connects the two circles, then the screen turns black and only the two selected teams are highlighted. Comparison Mode is complete when a second circle is overlaid on top of the home team's circle, indicating the attendance of the specific game between the two teams; this would allow the user to see the difference between the average and the specific game. If the user rolls over the circles with his cursor, additional information about the game and the teams involved with show up, such as the score, exact attendance, number of home wins at that time, and so forth. The visualization resets and goes back to Normal Mode when the user clicks on the background.

I feel that this visualization, although pretty simplistic in its concept and visualization, was effective in communicating lots of information to the user without being overwhelming. I think that due to the concept of the user selecting what he or she wants to view (by clicking on the circles), it retains its clarity and also creates different stages in its operation that the user can understand and thus adjust to (Normal Mode and Comparison Mode). The graph structure works in staying in the back and not getting in the way of the main focus, while providing information and also an interesting composition. The most challenge I had with this project was refining my ideas and going through the process and combining and filtering them into something that I thought could work in simple terms, yet very effectively. Once I had my concept down, I was able to go through the creation stage without too much trouble. With this project, I have noticed an improvement in my method of idea generating, and I think that by implementing movement and interaction into something that is usually static, such as informational design, is a very interesting concept and definitely worth investigating.