InfoVis:Wiki - User contributions [en]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Prototyp

2005-12-20T21:42:47Z

UE-InfoVis0506 0225061:

== Short Task Description ==

What we had to do in our project was to visualize data from MP3 music files. We use the so called ID3 Tags to get all the interesting attributes like: song title, album title, genre, year and so on. For getting all this information out of the songs, we decided to use iTunes, because this software saves all the songs on the computer in one file. It's a xml file that holds all the informations for each song.

There is also other data saved with each song when using iTunes. Namely the date when the song was added to the library, the date when it was last played and a rating given by the user between 0 and 5 stars. As we are doing Information Visualization a main task was to give the tool an explorative touch, so that the user can find and explore his music using totally new ways which have not been implemented in common tools on the market.

== Implementation Description ==

The prototype that we implemented of course doesn't has all the functionality we described in our concept but we tried to make clear what we wanted to achieve. The program consists of a main window and three other windows. In the main window there are two axis, one showing years and the other showing genres. The boxes on the crossings stand for the songs that were published in the given year and fall into the given genre.

The size of the box indicates the number of songs within and the color (more or less saturated in red) accounts for the rating. The better the rating, the higher the saturation. If you klick on such a box, more details of these songs are shown in the other windows. In the lower right window you can see a statistic view about how the selected songs are rated. In the lower left window the matching artists and albums are listed. In this prototype no pictures but only a list of artists and albums are shown unlike on the concept screenshot. The upper right window is also just faked and without functionality.

== Used Libraries ==

* mytunes
mytunes is a Java Package that makes it possible to get all the data from the iTunes Library xml file to the Java Sandbox. It makes the working with the xml file a lot easier, so you don't have to bother with xml parsing.

* AbsoluteLayout
Java Package that allows to use an absolute layout. This package is provided with NetBeans.

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Prototyp

2005-12-20T21:40:57Z

UE-InfoVis0506 0225061: /* Used Libraries */

== Prototype ==

Downloadlink: ...todo...

== Short Task Description ==

What we had to do in our project was to visualize data from MP3 music files. We use the so called ID3 Tags to get all the interesting attributes like: song title, album title, genre, year and so on. For getting all this information out of the songs, we decided to use iTunes, because this software saves all the songs on the computer in one file. It's a xml file that holds all the informations for each song.

There is also other data saved with each song when using iTunes. Namely the date when the song was added to the library, the date when it was last played and a rating given by the user between 0 and 5 stars. As we are doing Information Visualization a main task was to give the tool an explorative touch, so that the user can find and explore his music using totally new ways which have not been implemented in common tools on the market.

== Implementation Description ==

The prototype that we implemented of course doesn't has all the functionality we described in our concept but we tried to make clear what we wanted to achieve. The program consists of a main window and three other windows. In the main window there are two axis, one showing years and the other showing genres. The boxes on the crossings stand for the songs that were published in the given year and fall into the given genre.

The size of the box indicates the number of songs within and the color (more or less saturated in red) accounts for the rating. The better the rating, the higher the saturation. If you klick on such a box, more details of these songs are shown in the other windows. In the lower right window you can see a statistic view about how the selected songs are rated. In the lower left window the matching artists and albums are listed. In this prototype no pictures but only a list of artists and albums are shown unlike on the concept screenshot. The upper right window is also just faked and without functionality.

== Used Libraries ==

* mytunes
mytunes is a Java Package that makes it possible to get all the data from the iTunes Library xml file to the Java Sandbox. It makes the working with the xml file a lot easier, so you don't have to bother with xml parsing.

* AbsoluteLayout
Java Package that allows to use an absolute layout. This package is provided with NetBeans.

Teaching talk:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-12-19T20:26:09Z

UE-InfoVis0506 0225061:

'''Kommentar zum Konzept:'''

*Der Datensatz ist multidimensional (ein Attribut alleine ist immer 1-dimensional) '''Ausgebessert'''
*Die Beschreibung der Datentypen stimmt nicht (z.B. Artist und Album sind nominale Daten) '''Ausgebessert'''
*Verwendet bitte bei den Datentypen ein durchgängiges Schema: '''Ausgebessert'''
** nominal, ordinal, discrete, continuous, binary
** (quantitative kann nämlich discrete oder continuous bedeuten)
*Also entweder haben die Gruppen 4 und 9 von euch diese Tabelle abgekupfert oder umgekehrt? :-/
*Ihr schreibt: "musicians who like to use creative and new ways for finding songs to play in their music archive" - wie wird das unterstützt? bzw. Was ist dabei das besondere bei Musikern? '''Erklärung in Punkt 2.1'''
*Ihr schreibt von einer "expressive visualization" - es werden aber nicht alle Attribute dargestellt...? '''Erklärung in Punkt 3.1'''
*Kann die Reihenfolge der Genres in der Visualisierung geändert werden? '''Erklärung in Punkt 4.4'''
*Das Attribute Mapping ist gut.
*Eine sehr ähnliche Art der Visualisierung ist die [http://www.math.yorku.ca/SCS/Gallery/bright-ideas.html Reorderable Matrix]. Hier wird aber nicht auf Quadrate, sondern auf Balken gemappt, die an der gleichen horizontalen Position beginnen, was das vergleichen erleichtert.
*Die Ränder rund um die Rechtecke könnte man sich sparen.
*"Dynamic Queries" sind KEINE Scrollbalken, sondern schränken dynamisch Attribute und damit verbundene Elemente ein. '''Ausgebessert'''
*Weiters codiert ihr die Anzahl der Songs nicht als "volume", sondern als "area". '''Ausgebessert'''
*Die Verwendung von "multiple coordinated views" ist super!

-- [[User:Iwolf|Wolfgang Aigner]] 14:32, 25 November 2005 (CET)

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-12-19T20:05:56Z

UE-InfoVis0506 0225061: /* Who should use this visualation technique? */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Nominal
|Song title
|-
|Artist
|Nominal
|Artist name
|- style="background:#eeeeee"
|Album
|Nominal
|Album name
|-
|Genre
|Discrete
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Nominal
|The composer of the song
|-
|Size
|Continuous
|The file size
|- style="background:#eeeeee"
|Total time
|Continuous
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Discrete
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Discrete
|Total number of tracks on the disc
|-
|Year
|Discrete
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Discrete
|Date of modification
|-
|Date added
|Discrete
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Continuous
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Discrete
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Continuous
|Number of time the song was played
|-
|Play date
|Discrete
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Discrete
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Nominal
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. As a result of this one record is multi-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization. Therefore only a few correlating attributes are used for the visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser [Plaisant, 1995]
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: area and color [Munzner, 2000]
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. It is also possible to re-order the items on the y-axis. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

[Plaisant, 1995] C. Plaisant, D. Carr, B. Shneiderman. Image-browser taxonomy and guidelines for designers. ''IEEE Software'', Volume 12, Issue 2, Pages:21 - 32, March 1995

[Munzner, 2000] Tamara Munzner, Interactive Visualization of Large Graphs and Networks, Ph.D. dissertation, Stanford University, June 2000.

Teaching talk:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-12-15T13:26:35Z

UE-InfoVis0506 0225061:

'''Kommentar zum Konzept:'''

*Der Datensatz ist multidimensional (ein Attribut alleine ist immer 1-dimensional) '''Ausgebessert'''
*Die Beschreibung der Datentypen stimmt nicht (z.B. Artist und Album sind nominale Daten) '''Ausgebessert'''
*Verwendet bitte bei den Datentypen ein durchgängiges Schema: '''Ausgebessert'''
** nominal, ordinal, discrete, continuous, binary
** (quantitative kann nämlich discrete oder continuous bedeuten)
*Also entweder haben die Gruppen 4 und 9 von euch diese Tabelle abgekupfert oder umgekehrt? :-/
*Ihr schreibt: "musicians who like to use creative and new ways for finding songs to play in their music archive" - wie wird das unterstützt? bzw. Was ist dabei das besondere bei Musikern? '''TODO'''
*Ihr schreibt von einer "expressive visualization" - es werden aber nicht alle Attribute dargestellt...? '''Erklärung in Punkt 3.1'''
*Kann die Reihenfolge der Genres in der Visualisierung geändert werden? '''Erklärung in Punkt 4.4'''
*Das Attribute Mapping ist gut.
*Eine sehr ähnliche Art der Visualisierung ist die [http://www.math.yorku.ca/SCS/Gallery/bright-ideas.html Reorderable Matrix]. Hier wird aber nicht auf Quadrate, sondern auf Balken gemappt, die an der gleichen horizontalen Position beginnen, was das vergleichen erleichtert.
*Die Ränder rund um die Rechtecke könnte man sich sparen.
*"Dynamic Queries" sind KEINE Scrollbalken, sondern schränken dynamisch Attribute und damit verbundene Elemente ein. '''Ausgebessert'''
*Weiters codiert ihr die Anzahl der Songs nicht als "volume", sondern als "area". '''Ausgebessert'''
*Die Verwendung von "multiple coordinated views" ist super!

-- [[User:Iwolf|Wolfgang Aigner]] 14:32, 25 November 2005 (CET)

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T23:27:19Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser [Plaisant, 1995]
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges [Shneiderman, 1994]
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color [Munzner, 2000]
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

[Plaisant, 1995] C. Plaisant, D. Carr, B. Shneiderman. Image-browser taxonomy and guidelines for designers. ''IEEE Software'', Volume 12, Issue 2, Pages:21 - 32, March 1995

[Munzner, 2000] Tamara Munzner, Interactive Visualization of Large Graphs and Networks, Ph.D. dissertation, Stanford University, June 2000.

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T23:27:11Z

UE-InfoVis0506 0225061: /* References */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser [Plaisant, 1995]
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges [Shneiderman, 1994]
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

[Plaisant, 1995] C. Plaisant, D. Carr, B. Shneiderman. Image-browser taxonomy and guidelines for designers. ''IEEE Software'', Volume 12, Issue 2, Pages:21 - 32, March 1995

[Munzner, 2000] Tamara Munzner, Interactive Visualization of Large Graphs and Networks, Ph.D. dissertation, Stanford University, June 2000.

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T23:04:43Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser [Plaisant, 1995]
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges [Shneiderman, 1994]
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

[Plaisant, 1995] C. Plaisant, D. Carr, B. Shneiderman. Image-browser taxonomy and guidelines for designers. ''IEEE Software'', Volume 12, Issue 2, Pages:21 - 32, March 1995

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T23:04:34Z

UE-InfoVis0506 0225061: /* References */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges [Shneiderman, 1994]
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

[Plaisant, 1995] C. Plaisant, D. Carr, B. Shneiderman. Image-browser taxonomy and guidelines for designers. ''IEEE Software'', Volume 12, Issue 2, Pages:21 - 32, March 1995

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:57:29Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges [Shneiderman, 1994]
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot
[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:57:21Z

UE-InfoVis0506 0225061: /* References */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot
[Shneiderman, 1994] Ben Shneiderman, Dynamic Queries for Visual Information Seeking. Retrieved at: November 22, 2005. http://citeseer.ist.psu.edu/shneiderman94dynamic.html

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:55:25Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot [Wikipedia, 2005]
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:55:18Z

UE-InfoVis0506 0225061: /* References */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, 2005] Wikipedia, Scatterplot. Retrieved at: November 22, 2005. http://en.wikipedia.org/wiki/Scatterplot

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:52:04Z

UE-InfoVis0506 0225061:

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:48:12Z

UE-InfoVis0506 0225061:

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:45:01Z

UE-InfoVis0506 0225061: /* References */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

[Wikipedia, Scatterplot, 2005] Wikipedia.org, Scatterplot, 22.11.2005, http://en.wikipedia.org/wiki/Scatterplot

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:44:25Z

UE-InfoVis0506 0225061:

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

== References ==

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:44:13Z

UE-InfoVis0506 0225061:

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation.

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

=== References ===

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:28:18Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in the advanced [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|concept]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:27:54Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===

* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1)
** This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.

* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
** This technique is used at the left 2 windows to slide the genre or the albums, if there is not enough space available to display all at one.

* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27)
** With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Simple "Music Type Selection" Concept]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Advanced "Music Type Selection" Concept]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:26:59Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in [http://www.winamp.com Winamp]: After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task a "Music Type Selection" browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===
TODO: this is a listing of used techniques only at the moment - detail and map to the implemented features
* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1):
This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.
* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8): This technique is used at the left 2 windows to slide the genre or the albums, if there is not enough space available to display all at one.
* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27): With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Entwurf 1]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Entwurf 2]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:26:01Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of one special genre of one special year do I have?
* How do I have them rated?
* Which albums do I have of a selected genre and year of publishing?
* Which songs are included on an album?
* How often do I have played a song?
* When did I last play a song?
* Of which genre and how old are most of the songs in my archive?
* Which genre do I like (which genre is best rated)?
* Selecting genre and year/decade, which alternative music do i find to one other?
* Which albums match each other in terms of genre and age?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in Winamp (TODO: cite): After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

TODO: list the different types of attributes!

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task the "Music Type Selection" (TODO: find a superior name) browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===
TODO: this is a listing of used techniques only at the moment - detail and map to the implemented features
* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1): This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre.
* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8): This technique is used at the left 2 windows to slide the genre or the albums, if there is not enough space available to display all at one.
* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume and color (Slides 0, Page 27): With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the volume the number of songs.

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Entwurf 1]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Entwurf 2]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T22:01:20Z

UE-InfoVis0506 0225061: /* Used Techniques / Applied Principles */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to potentially find other music than without it.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used for work, but also as multimedia station. That means they play video, music and watch TV with their computer.

This group is specially interested in music and is buying songs over the internet and not buying music CD's frequently anymore. If they buy a CD they rip the content onto the PC to have it in their music library.

=== What are the special interests of our target group? ===

Probably our target group is quite young, probably creative and they potentially have some sort of interest in exploring data visualisations in alternative ways. As can be assumed by analyzing iTunes, the target group likes nice and neat design, cool features and gimmicks. They probably use the visualisation mainly for playing around with their music collection.

Our target group has more interest in mp3s than they have in buying CDs and playing them in their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to the music they like and the music matching upcoming emotions at every point of time. Instead of manually choosing a music CD they want to use a tool to help them selecting music out of their archive that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation technique that can be found on most music tools is the sound visualisation of a playing song, implemented as frequency response or graphical art responding to the music progress.

For representing the songs of a library, ususally lists or tables are used. List-like and tabular approaches can not really be considered as graphic visualisation - they just are textual representations of the data that the user can read and use. Especially in iTunes the possibilities of combining different ID3 attributes to get a filtered playlist are vast. The user is for example able to choose only songs from 1980 to 1984 that are in the rock genre, have a rating between 1 and 3 stars and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interesting.

== Purpose of the Visualisation ==

=== What should be achieved with the visualisation? ===

* An expressive and effective representation of the data records and contained information enabling users to gain an overview of the music in the library as fast as possible using this visualization.
* An explorative visualisation of the data records. A good presentation of the contained information helps users to obtain information better.
* A new approach for finding music to play by bringing genre, year of creation, rating and size of the data set into relation

=== Which tasks should be solved? ===

Using the nowadays available music library tools is effective and suitable for standard tasks like the following ones most of the time:
* Searching for music by textual fields like artist, album, genre etc.
* Filtering lists of music by selecting criteria on different attributes
* Ordering lists of music by different attributes
* Scrolling through lists of different items searching for songs that will be played next

All these standard tasks are more or less well known nowadays and implemented into most of the modern music libraries. Interestingly indeed is the fact that there are so much more approaches on finding music using alternative ways that have not been designed or implemented even after years like the following:
* Computer-aided decision of music to play based on user behavior (music types often skipped quickly, music types often played loud...)
* Graphical representations of relational visualisations of the music archive

This second task was being analyzed for the design of the here discussed visualisation trying to solve the following tasks:
* Representing a quick overview of the different types of music in the archive
* Guiding the user to good rated music using color coding
* Marking different sized song groups using different sizes of the representing graphic objects (boxes)
* Providing a focused view for selected music groups using a multi-view window layout
* Giving statistical information on selected music groups via a separated but linked window of the rating-distribution of the selected music group
* Filtering the representation by selecting range and scale

=== Questions that can be solved using this Visualisation ===

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of a Genre of a year do I have?
* How do I have them rated?
* Which albums do I have of a selected Genre and Year of publishing?
* Which songs are included on an album?
* How often have I played a song ?
* When did I play last a song ?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in Winamp (TODO: cite): After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

TODO: list the different types of attributes!

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task the "Music Type Selection" (TODO: find a superior name) browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===
TODO: this is a listing of used techniques only at the moment - detail and map to the implemented features
* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot (Slides 1, Page 1) + Color and Shape concept: This concept is used in the upper left window. On the x-axis the year of publishing is displayed and on the y-axis the genre. With the color of the shapes the average rating is displayed (white: bad rating; red: best rating) and with the size the number of songs.
* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8): This technique is used at the left 2 windows to slide the genre or the albums, if there is not enough space available to display all at one.
* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume, color

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Entwurf 1]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Entwurf 2]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-22T21:36:56Z

UE-InfoVis0506 0225061: /* Questions that can be solved using this Visualisation */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information such as songname, artist, year, album and so on. The challenge in visualizing this information is to select suitable attributes for being used in relation to each other because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation of our concept is mainly designed for people collecting mp3s and musicians who like to use creative and new ways for finding songs to play in their music archive they won't find in the usual tools. Moreover it's for people who like to explore their music collection using different approaches. This will fit the exploring character of information visualisation.

Our visualisation will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find music to play, e.g. songs they didn't listen to for a long time. They will see from which period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual approaches and will allow the user to probably find other music, than without the tool.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used to work, but also as multimedia station. That means they play video, music and watch TV with their computer.

They are also interessted in music and they are buying the music from the internet and not buying the songs on a CD. If they buy a CD they rip the content on the pc to have it in their music library.

=== What are the special interests of our target group? ===

I think our target group is quite young, probably creative and I suppose they have some sort of interest in playing around with things a bit. As we are analysing iTunes the target group likes nice and neat design, cool tools, cool features and gimmicks. They should use the visualisation mainly for playing around with their music collection.

Our target group has more interesst in mp3s than they have in buying CDs and playing them from their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to they music they like and the music they feel for in the moment. Instead of putting a CD into the HiFi set they want to see what they have in their collection that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation techniques can be found at the playback time of a song, when the music itself is visualised.

For representing the Songs of a library ususally lists or tables are used. That means this is not a real graphic visualisation, it's just a representation of the data, that the user can read and use to make for example playlists. Especially in iTunes the possibilities of combining many ID3 attributes to get a playlist are vast. You can for example say you want only songs from 1980 to 1984, that are in the rock genre, that have a rating between 1 and 3 stars, and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interessting.

== Purpose of the Visualisation ==

=== What should be achieved with the Visualisation? ===

* a expressive and effective representation of the data records and contained information so that user can see with this visualization as fast as possible overview of the data and contained information.
* Exploration visualisation on the data record . Good presentation of information, because users can obtain information with visualisation better.
* semantic information from data
* Data condensation , so that complex information can be well observed.

=== Which tasks should be solved? ===

* current condition from information
* Visualization should be clear , Information is made more easily understandable.
* Data must be interpreted correct
* Information is explained by the best way user
* Restriction of the data . NOT "too much data , too little space".

=== Questions that can be solved using this Visualisation ===

* Which Jazz Songs of the 80's do I have in my archives, which I evaluated average?
* How many Songs do I have in Genre "Metal" in 2000 ?
* When did I play last "Shoot ME again" ?
* How often have I played Song "My World"?
* Which albums of Metallica do I have ?
* When was "Purify" created ?

----

* Which Jazz songs of the 80's do I have im my library, how have I evaluated them in average?
* How many songs of a Genre of a year do I have?
* How do I have them rated?
* Which albums do I have of a selected Genre and Year of publishing?
* Which songs are included on an album?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in Winamp (TODO: cite): After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

TODO: list the different types of attributes!

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task the "Music Type Selection" (TODO: find a superior name) browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===
TODO: this is a listing of used techniques only at the moment - detail and map to the implemented features
* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot + Color and Shape concept
* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume, color

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windows are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windows to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Entwurf 1]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Entwurf 2]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-21T14:56:42Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

== Application Area and given Dataset ==

=== Application Area Analysis ===

The application area for this task is to visualize a music archive with the data provided by ID3/iTunes tags. These tags include information about songname, artist, year, album,... The challenge in visualizing this information is to select "good" attributes that can be brought into relation, because of the high number of discreet and "organizational" attributes.

=== Dataset Analysis ===

{|
|- style="background:#e0e0e0"
!Attribute
!Data type
!Description
|- style="background:#eeeeee"
|Name
|Discreet
|Song title
|-
|Artist
|Discreet
|Artist name
|- style="background:#eeeeee"
|Album
|Discreet
|Album name
|-
|Genre
|Nominal
|Genre the song belongs to
|- style="background:#eeeeee"
|Composer
|Discreet
|The composer of the song
|-
|Size
|Ordinal
|The file size
|- style="background:#eeeeee"
|Total time
|Ordinal
|The total time of the song
|-
|Disc number
|Ordinal
|Number of the disc
|- style="background:#eeeeee"
|Disc count
|Ordinal
|Total number of discs
|-
|Track number
|Ordinal
|Track number of this song on the disc
|- style="background:#eeeeee"
|Track count
|Ordinal
|Total number of tracks on the disc
|-
|Year
|Ordinal
|Year of origin
|- style="background:#eeeeee"
|Date Modified
|Ordinal
|Date of modification
|-
|Date added
|Ordinal
|Date when song was added to archive
|- style="background:#eeeeee"
|Bit rate
|Ordinal
|Bit rate of song (e.g. 128kbit/s)
|-
|Sample rate
|Ordinal
|Sample rate of song (e.g. 44100Hz)
|- style="background:#eeeeee"
|Play count
|Ordinal
|Number of time the song was played
|-
|Play date
|Ordinal
|Date of last play
|- style="background:#eeeeee"
|Play date UTC
|Ordinal
|Date of last play in [http://en.wikipedia.org/wiki/UTC UTC]
|-
|Location
|Discreet
|File location
|- style="background:#eeeeee"
|Kind
|Nominal
|Kind of file (e.g. MPEG audio file)
|-
|Rating
|Ordinal
|Personal rating (1-5 stars)
|}

One data record consists of a concatenation of attributes listed in the table above. Those attributes are all 1-dimensional. A data record contains only necessary attributes or attributes with data.

== Target Group Analysis ==

=== Who should use this visualation technique? ===

The visualisation is mainly meant for people collecting mp3s or for musicians who like to see some nice information they won't find in the usual representations. Moreover it's for people who like to explore their music collection under different standpoints. This will fit the exploring character of information visualisation.

Our visualisation tool will make it possible to browse through the music collection in different ways than what iTunes offers. It's meant for people who want to find some music, they for example didn't listen to for a long time. They will see from wich period the songs are, which genre they fall into and how they have been rated. This is a different starting point than usual and will allow the user to probably find other music, than without the tool.

The people that will use our tool are familiar with the internet and use it quite often. Moreover they are using their computer a lot at home and have their pc or mac in the living room where it is not only used to work, but also as multimedia station. That means they play video, music and watch TV with their computer.

They are also interessted in music and they are buying the music from the internet and not buying the songs on a CD. If they buy a CD they rip the content on the pc to have it in their music library.

=== What are the special interests of our target group? ===

I think our target group is quite young, probably creative and I suppose they have some sort of interest in playing around with things a bit. As we are analysing iTunes the target group likes nice and neat design, cool tools, cool features and gimmicks. They should use the visualisation mainly for playing around with their music collection.

Our target group has more interesst in mp3s than they have in buying CDs and playing them from their CD player. They have all their music stored on their computer and want to have many possibilities to browse through their collection. They are looking for new ways of finding music so that they can listen to they music they like and the music they feel for in the moment. Instead of putting a CD into the HiFi set they want to see what they have in their collection that suits their mood.

=== Are there any known / often used Methods / Visualisation Techniques? ===

Up to now there are no real visualisation techniques in the area of music players like iTunes. The only visualisation techniques can be found at the playback time of a song, when the music itself is visualised.

For representing the Songs of a library ususally lists or tables are used. That means this is not a real graphic visualisation, it's just a representation of the data, that the user can read and use to make for example playlists. Especially in iTunes the possibilities of combining many ID3 attributes to get a playlist are vast. You can for example say you want only songs from 1980 to 1984, that are in the rock genre, that have a rating between 1 and 3 stars, and are not from Guns n' Roses. So you can do quite a lot of things with it, but there is no visualisation behind it. You can choose all that, but you can not choose it graphically which can make this much easier, faster, or just more interessting.

== Purpose of the Visualisation ==

=== What should be achieved with the Visualisation? ===

* a expressive and effective representation of the data records and contained information so that user can see with this visualization as fast as possible overview of the data and contained information.
* Exploration visualization on the data record . Good presentation of information, because users can obtain information with visualization better.
* semantic information from data
* Data condensation , so that complex information can be well observed.

=== Which tasks should be solved? ===

* current condition from information
* Visualization should be clear , Information is to be made more easily understandable.
* Data must be interpreted correct
* Information is to be explained at the best user
* Restriction of the data . NOT too much data , too little space .

=== Questions that can be solved using this Visualisation ===

* Is there a certain structure classification of the data?
* Are Information understandable?
* Are Information made essential?
* Is Color used purposefully ?

== Designproposal ==

=== Which kinds of Visualisation should be used? ===
The actually existing music library systems mostly don't really visualize the contained music using its attributes but simply use lists of items (artists, albums, songs, playlists...). While this concept is easily understandable for the end-user it only allows for simple browsing using the following techniques:

* Searching for specific artists, albums, titles and so on.
* Filtering the list by choosing ranges or values for some attributes
* Sorting the list by different attributes
* Scrolling the list up and down

Some attributes of song items like artist, album and title are of hierarchical character and therefore suited mainly for being displayed in a list or being used for browsing in multi-step lists. One example of such a multi-step list is the media library in Winamp (TODO: cite): After selecting an artist in the first list, the second list gets filled with the available albums of this artist. Selecting an album fills the next list with the associated songs of this album and so on.

TODO: list the different types of attributes!

While hierarchical attributes can be considered essential and are very useful for a multi-level selection process or direct textual searching/filtering, they only can be used if the user exactly knows what he or she wants to listen to. In opposite users often want to listen to randomly chosen or special pattern matching song lists like "My Top 10 Most Played Ones".

Considering these facts we chose other criteria than hierachical attributes of music items for creating new concepts of how to find interesting music without exactly knowning what to listen to. Using attributes like genre, year of creation, rating, playcount and date of last play different approaches of browsing music came up to our minds.

=== Visual Mapping ===
In the context of this task the "Music Type Selection" (TODO: find a superior name) browsing approach was chosen for being designed in detail and worked out as a prototype. This approach uses the following visual mapping:
* The approach bases on a 2D diagram containing:
** The year of creation on the x-axis
** The genre on the y-axis
Using this grid groups of similar music with respect to genre and year are getting plotted into the diagram as filled boxes. Additionally another two attributes are being mapped:
* The absolute number of songs within a specific group is mapped as the size of the box.
* The mean rating of all songs within this group is mapped as the intensity of the color used for filling the boxes.

=== Used Techniques / Applied Principles ===
TODO: this is a listing of used techniques only at the moment - detail and map to the implemented features
* Focus & Context: Tiled Multi-Level Browser (Slides 0, Page 16)
** Overview Window
** Zoomed Window
** Details On Demand Window
* Scatterplot + Color and Shape concept
* Dynamic Queries: live choosable sliders for attribute ranges (Slides 4, Page 8)
* Linking & Brushing: Detail window containing rating distribution of selected songs (Slides 0, Page 25)
* Visual Encoding: volume, color

=== Interaction ===

As you can see in our second [[Media:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|layout]] we have a multi windwow view. The starting point is in the big main window. In the beginning the other windwos are empty. In the main part the user sees all the songs availible represented in boxes of different shade and size. It is possible to scale the x- and the y-axis to have a better overview, or to see the boxes larger. When he clicks at one of those boxes more detailed information will appear in the other windows. In the lower left window the user will see the different Artists that suited his selection. There will be one box for each artist containing all the albums of this artist that correspond with the users selection of genre and year. In the lower right window the user can see a more detailed view on the ratings of his selection. So the mean value is split up and one can see how many songs there are for each rating star. In the upper left window the first album of the first artist will be presented, showing the songs.

In the next step the user can interact in the three smaller windwos to change the artist, the album, or choose only specific ratings. When the user clicks on a new album or artist the details in the upper right window will be updated. Moreover there is the possibility to choose only some of the ratings represented in the lower right window. For example only 4 to 5 stars. Then the songs in the upper right window will be updated correctly and only albums which contain songs with this rating will be shown in the lower left window.

=== Mockup(s) / Fake Screenshot(s) ===
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf1.gif|none|thumb|500px|none|Entwurf 1]]
[[Image:InfoVis_Gruppe10_Aufgabe3_Entwurf2.jpg|none|thumb|561px|none|Entwurf 2]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T16:30:55Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T16:02:48Z

UE-InfoVis0506 0225061: /* Application Area Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T15:58:35Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T14:46:01Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T14:45:53Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T14:44:00Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T14:34:39Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T14:33:48Z

UE-InfoVis0506 0225061: /* Dataset Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design

2005-11-20T13:44:53Z

UE-InfoVis0506 0225061: /* Application Area Analysis */

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3

2005-11-20T13:38:30Z

UE-InfoVis0506 0225061:

== MP3 Archive Visualization ==

* [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Design|Design]]
* [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 3 - Prototyp|Prototyp]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:45:55Z

UE-InfoVis0506 0225061: /* Improvements */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits,
* Bad aesthetic: graphic has a bad usability (difficult to read) because of chart-junk, lie-factors and no use of colors.

== Improvements ==

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and other professionals, and 4-digit years) which results in a better data-ink-ratio,
* Grouped the legend into a single block,
* Added a y-axis scale on both sides, because of the high width of the new graphic,
* improved Aesthetic-Usability Effect due to usage of colors.

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:43:51Z

UE-InfoVis0506 0225061: /* Drawbacks */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits,
* Bad aesthetic: graphic has a bad usability (difficult to read) because of chart-junk, lie-factors and no use of colors.

== Improvements ==

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and other professionals, and 4-digit years) which results in a better data-ink-ratio,
* Grouped the legend into a single block,
* Added a y-axis scale on both sides, because of the high width of the new graphic.

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:37:02Z

UE-InfoVis0506 0225061: /* Improvements */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits.

== Improvements ==

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and other professionals, and 4-digit years) which results in a better data-ink-ratio,
* Grouped the legend into a single block,
* Added a y-axis scale on both sides, because of the high width of the new graphic.

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:36:06Z

UE-InfoVis0506 0225061: /* Improvements */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits.

== Improvements ==
* Choose linear time scale without jumps
* Analyze distribution (linear, exponential?)
* Choose appropriate diagram type
* Make the design simpler, without making it less understandable.
* Make a scale on the left side.

----

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and other professionals, and 4-digit years),
* Grouped the legend into a single block,
* Added a y-axis scale on both sides, because of the high width of the new graphic.

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:34:53Z

UE-InfoVis0506 0225061: /* Drawbacks */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits.

== Improvements ==
* Choose linear time scale without jumps
* Analyze distribution (linear, exponential?)
* Choose appropriate diagram type
* Make the design simpler, without making it less understandable.
* Make a scale on the left side.

----

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and working men),
* Grouped the legend into a single block

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-02T19:33:51Z

UE-InfoVis0506 0225061: /* Drawbacks */

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==
* Changing scale of the time line in mid-axis to make exponential growth linear (from slides). This is called the ''Lie Factor''
* The ''Lie Factor'' also makes one believe that there's continuity in the data.
* Bad Data-Ink-Ratio
* It is not very aestetic
* Could have some more colors
* Quite a lot of ''Chart Junk'' can be found in the graphic. The pictures of the doctors and the pictures of the other working men for example.

----

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and other professionals, year is always written with 4-digits.

== Improvements ==
* Choose linear time scale without jumps
* Analyze distribution (linear, exponential?)
* Choose appropriate diagram type
* Make the design simpler, without making it less understandable.
* Make a scale on the left side.

----

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and working men),
* Grouped the legend into a single block

== Redesigned Graphic ==
[[Image:Diagramm 02.png|none|thumb|600px|none|First proposal for new Graphics]]

Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 10 - Aufgabe 2

2005-11-01T19:00:02Z

UE-InfoVis0506 0225061:

== Poor Graphic ==
[[Image:Friendly02doctors.gif|none|thumb|413px|Incomes of Doctors Vs. Other Professionals]]

== Drawbacks ==
* Changing scale of the time line in mid-axis to make exponential growth linear (from slides). This is called the ''Lie Factor''
* The ''Lie Factor'' also makes one believe that there's continuity in the data.
* Bad Data-Ink-Ratio
* It is not very aestetic
* Could have some more colors
* Quite a lot of ''Chart Junk'' can be found in the graphic. The pictures of the doctors and the pictures of the other working men for example.

----

* Lie Factor: non-linear time scale shows a linear growth of the salary, but it's exponential,
* Bad Data-Ink-Ratio: a lot of ink is used to differ the bars and for
* Chart Junk: pictures of the doctors and working men.

== Improvements ==
* Choose linear time scale without jumps
* Analyze distribution (linear, exponential?)
* Choose appropriate diagram type
* Make the design simpler, without making it less understandable.
* Make a scale on the left side.

----

* Used a linear time scale to show the exponential growth,
* Additional usage of a line chart to better visualize the higher growth of doctors salary,
* Removed the chart junk (pictures of doctors and working men),
* Grouped the legend into a single block

== Redesigned Graphic ==
[[Image:Diagramm 01.png|none|thumb|600px|none|First proposal for new Graphics]]

Visual Clutter

2005-11-01T17:59:01Z

UE-InfoVis0506 0225061: /* Web pages */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers [Meadhra, 2004]

An example for this is the first page of GMX.at. This page is full of commercials and news headlines. One popular service of GMX is its webmail service. The login form is surrounded by visual clutter and it is easy to be overlooked.

[[Image:0225061_01_Screen3.jpg|thumb|200px|none|GMX.at start page]]

== Geological Maps ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. ''The Cartographic Journal'', Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge

Visual Clutter

2005-11-01T17:56:41Z

UE-InfoVis0506 0225061: /* Web pages */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers [Meadhra, 2004]

An example for this is the first page of GMX.at. This page is full of commercials and news headlines. One popular service of GMX is its webmail service. The login form is surrounded by visual clutter and it is easy to be overlooked.

[[Image:0225061_01_Screen3.jpg|thumb|200px|GMX.at start page]]

== Geological Maps ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. ''The Cartographic Journal'', Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge

Visual Clutter

2005-11-01T17:56:29Z

UE-InfoVis0506 0225061: /* Web pages */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers [Meadhra, 2004]

An example for this is the first page of GMX.at. This page is full of commercials and news headlines. One popular service of GMX is its webmail service. The login form is surrounded by visual clutter and it is easy to be overlooked.

[[Image:0225061_01_Screen3.jpg|thumb|200px|left|GMX.at start page]]

== Geological Maps ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. ''The Cartographic Journal'', Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge

File:0225061 01 Screen3.jpg

2005-11-01T17:47:39Z

UE-InfoVis0506 0225061: Screenshot of the GMX.at start page

== Summary ==
Screenshot of the GMX.at start page
== Copyright status ==

== Source ==
www.gmx.at

File:Image1.jpg

2005-11-01T17:45:36Z

UE-InfoVis0506 0225061: Screenshot of the GMX.at start page

== Summary ==
Screenshot of the GMX.at start page
== Copyright status ==

== Source ==
www.gmx.at

Visual Clutter

2005-11-01T16:59:30Z

UE-InfoVis0506 0225061: /* Bibliography */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers

Another common problem of web page design is to find the right resolution of the design. A designer may have a high resolution monitor (1280x1024+) while a visitor has only a low-resolution monitor (800x600). If the page is designed for a higher resolution than the visitor can display, only a part of the page can be displayed. On the other hand, if a page is designed for a smaller resolution than a visitor can display, a lot of unusage space exists. [Meadhra, 2004]

[[Image:0225061_01_Screen1.jpg|thumb|200px|left|High-resolution monitor]] [[Image:0225061_01_Screen2.jpg|thumb|200px|none|Low-res monitor]]
<br>

== Geological Maps ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. ''The Cartographic Journal'', Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge

Visual Clutter

2005-10-24T18:28:50Z

UE-InfoVis0506 0225061: /* Examples */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers

Another common problem of web page design is to find the right resolution of the design. A designer may have a high resolution monitor (1280x1024+) while a visitor has only a low-resolution monitor (800x600). If the page is designed for a higher resolution than the visitor can display, only a part of the page can be displayed. On the other hand, if a page is designed for a smaller resolution than a visitor can display, a lot of unusage space exists. [Meadhra, 2004]

[[Image:0225061_01_Screen1.jpg|thumb|200px|left|High-resolution monitor]] [[Image:0225061_01_Screen2.jpg|thumb|200px|none|Low-res monitor]]
<br>

== Geological Maps ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. The Cartographic Journal, Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge

Visual Clutter

2005-10-24T18:28:14Z

UE-InfoVis0506 0225061: /* Web pages */

== Definition ==

* Clutter is the state in which excess items, or their representation or organization, lead to a degradation of performance at some task. [Rosenholtz et al., 2005]

* Clutter may refer to any of the following:
** A confusing or disorderly state or collection; or the creation thereof. Excessive, unnecessary or uncontrolled clutter in a home or office is a sign of compulsive hoarding.
** Cluttering, a communication disorder
** The Clutter family, whose murder was documented in the Truman Capote "nonfiction novel" In Cold Blood
** A type of light pollution
** Unwanted echoes in electronic systems, particularly in refference to radars. Such echoes are typically returned from ground, sea, rain, animals, chaff and atmospheric turbulences.
** The jumble of odd posts placed in the first Top Level Post of a User Friendly member's diary by the Cluttersquad [http://en.wikipedia.org/wiki/Clutter ''http://en.wikipedia.org/wiki/Clutter'']

== Introduction ==

Clutter is an important phenomenon in our lives, and an important consideration in the design of user interfaces and information visualizations. Many existing visualization systems are designed to reduce clutter by filtering what objects or information the user sees, or using non-linear magnification techniques so that objects in the center of the screen are allowed more display area. Tips for designing web pages, maps, and other visualizations often focus on techniques for displaying a large amount of information while keeping clutter to a minimum through careful choices of representation and organization of that information. [Rosenholtz et al., 2005]

== Web pages ==

A home page might contain a logo and tag line, an attractive graphic, some site navigation buttons, and a welcome message. Now, it's common to see all of that and much more, including:

* Headlines and text for multiple news items
* Separate headers and quick links for several site features
* An assortment of graphics for promotions and advertisements
* Logos for various affiliates, memberships, and awards
* Copyright notices and other legal disclaimers

Another common problem of web page design is to find the right resolution of the design. A designer may have a high resolution monitor (1280x1024+) while a visitor has only a low-resolution monitor (800x600). If the page is designed for a higher resolution than the visitor can display, only a part of the page can be displayed. On the other hand, if a page is designed for a smaller resolution than a visitor can display, a lot of unusage space exists. [Meadhra, 2004]

[[Image:0225061_01_Screen1.jpg|thumb|200px|left|High-resolution monitor]] [[Image:0225061_01_Screen2.jpg|thumb|200px|none|Low-res monitor]]
<br>

== Examples ==

Visual Clutter in the Topographic Base of Geological Maps

Geological maps are arguably the most complicated visual displays in common use and so they were a good subject for an experiment to understand the nature of visual clutter. But this experiment also tackles the practical problem of how best to simplify the topographic base on geological maps.

[[Image:Erste.png]]

[[Image:zweite1.png]] [[Image:dritte1.png]][[Image:vierte1.png]][[Image:fünfte1.png]]
[[Image:sechs1.png]]

Here is a small detail from one of the test maps used in the experiments and examples of the five types of topographic base which were compared: 'full', 'line', 'point', 'minimal' and 'design'. These bases were printed in grey and geological information was superimposed. The experiment compared the relative importance of line symbols and point symbols in causing visual clutter, but account was also taken of the importance placed on different topographic symbols by professional map users.

Abstract - Visual clutter on maps is a familiar experience but its precise nature is only poorly understood. Clutter was investigated in an experiment using a 1:50 000 geological map. Twelve representative map reading tasks were used to compare map reading performance on maps which differed only in their topographic base. The aim was to assess the effect of removing topographic symbols which are of only minor importance to the map reader. This reduction in visual clutter significantly improved performance on a number of the questions. Some evidence was obtained to support the hypothesis that line symbols clutter other line symbols, and point symbols clutter other point symbols, but there is little effect between the two. In practical terms the removal of minor point symbols and type led to larger improvements than the removal of minor line symbols, even though more of the latter were deleted. The relevance of the experiment to other geological maps, and to maps in general, is discussed. [Phillips, 1982]

== Bibliography ==

:[Rosenholtz et al., 2005] Ruth Rosenholtz, Yuanzhen Li, Jonathan Mansfield, and Zhenlan Jin. Feature Congestion: A Measure of Display Clutter. http://web.mit.edu/rruth/www/Papers/RosenholtzEtAlCHI2005Clutter.pdf

:[Meadhra, 2004] Michael Meadhra, Reduce visual clutter to improve usability. Created at: May 20, 2004. Retrieved at: Oct 24, 2005. http://www.builderau.com.au/program/web/0,39024632,39129000,00.htm

:[Phillips, 1982] Richard J. Phillips. An Investigation of Visual Clutter in the Topographic Base of a Geological Map. The Cartographic Journal, Vol.19, No.2: 122-132, December 1982. http://richardphillips.org.uk/maps/symbols.html#ge