<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en">
	<id>https://infovis-wiki.net/w/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=UE-InfoVis0506+0402143</id>
	<title>InfoVis:Wiki - User contributions [en]</title>
	<link rel="self" type="application/atom+xml" href="https://infovis-wiki.net/w/api.php?action=feedcontributions&amp;feedformat=atom&amp;user=UE-InfoVis0506+0402143"/>
	<link rel="alternate" type="text/html" href="https://infovis-wiki.net/wiki/Special:Contributions/UE-InfoVis0506_0402143"/>
	<updated>2026-05-25T06:27:35Z</updated>
	<subtitle>User contributions</subtitle>
	<generator>MediaWiki 1.45.3</generator>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8338</id>
		<title>Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09 - Design</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8338"/>
		<updated>2005-11-22T22:46:47Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* References */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Topic ==&lt;br /&gt;
MP3 Archive Visualization&lt;br /&gt;
&lt;br /&gt;
== Description of the Application Area and given Dataset ==&lt;br /&gt;
&lt;br /&gt;
=== Application Area Analysis ===&lt;br /&gt;
The application area is the creation of a MP3 archive visualisation and its ID3 tags. This should contain information like the name of the artist, the year it came out, name of the album etc. &amp;lt;br&amp;gt;&lt;br /&gt;
ID3 tags store information within the MP3 files. Originally ID3 tags held just the basic text-only information about a music file. They had a standard size and standardized information.&amp;lt;br&amp;gt;&lt;br /&gt;
The most important and also special thing about this project is to create a useful visualisation, which can store lots of information in one place, without having to abstain from a user friendly interface.[Doug, 2005]&lt;br /&gt;
&lt;br /&gt;
=== Dataset Analysis ===&lt;br /&gt;
In the following table, you can find the attributes which should be contained in a MP3 file.&amp;lt;br&amp;gt; These attributes are  1-dimensional.&amp;lt;br&amp;gt;&lt;br /&gt;
A MP3 file contains only attributes with data.&lt;br /&gt;
{|&lt;br /&gt;
|- style=&amp;quot;background:#e06113&amp;quot;&lt;br /&gt;
!Attribute&lt;br /&gt;
!Data type&lt;br /&gt;
!Description&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track&lt;br /&gt;
|Discreet&lt;br /&gt;
|Track Name&lt;br /&gt;
|-&lt;br /&gt;
|Artist&lt;br /&gt;
|Discreet&lt;br /&gt;
|Artist name&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Album&lt;br /&gt;
|Discreet&lt;br /&gt;
|Album name&lt;br /&gt;
|-&lt;br /&gt;
|Genre&lt;br /&gt;
|Nominal&lt;br /&gt;
|Type or category of music&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The track&#039;s position on a CD&lt;br /&gt;
|-&lt;br /&gt;
|Disc #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The CD&#039;s position in relationship to other CDs in a series, such as a boxed set&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of tracks on the disc&lt;br /&gt;
|-&lt;br /&gt;
|Disc count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of discs&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Composer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Composer of the track&lt;br /&gt;
|-&lt;br /&gt;
|Performer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Performer of the Track&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Year&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The year the track was recorded&lt;br /&gt;
|-&lt;br /&gt;
|Size&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The file size&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Total time&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The total time of the song&lt;br /&gt;
|-&lt;br /&gt;
|Date added&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date when song was added to archive&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Play count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Number of time the song was played&lt;br /&gt;
|-&lt;br /&gt;
|Play date&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date of last play&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Bit rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Bit rate of song&lt;br /&gt;
|-&lt;br /&gt;
|BPM&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Beats per Minute&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Sample rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Sample rate of song&lt;br /&gt;
|- &lt;br /&gt;
|Location&lt;br /&gt;
|Discreet&lt;br /&gt;
|File location&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Kind&lt;br /&gt;
|Nominal&lt;br /&gt;
|Kind of file&lt;br /&gt;
|-&lt;br /&gt;
|Rating&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Personal rating &lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Comments&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Any comments you care to make about the track&lt;br /&gt;
|-&lt;br /&gt;
|Mood&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The mood of the track&lt;br /&gt;
|}&lt;br /&gt;
[RealNetworks, 2005]&lt;br /&gt;
&lt;br /&gt;
== Target Group Analysis ==&lt;br /&gt;
&lt;br /&gt;
=== Who should use this visualation technique? ===&lt;br /&gt;
&lt;br /&gt;
In the past years media is getting much smaller, much better in quality, and also provide more space for our data. If you convert conventional audio files from CDs to the MP3 Format, you can afford to have your whole music collection on one larger hard drive. The business within the musich industry is taking over the internet. You are either able to download song, or listen to them directly through streams. So your favorite song is just a click away!&amp;lt;br&amp;gt;&lt;br /&gt;
Because of the fact that this new art of saving your songs, albums and so on, does not contain the usually shipped cd covers which were a very good visualisation of the audio you are listening to, it has become very important to find a good solution for the visualisation of your music archive. &amp;lt;br&amp;gt;&lt;br /&gt;
At this moment the target group are mostly the people who already use the MP3 format to store their audio data, but should expend soon to all the other music-lovers.[Netzwelt, 2005]&lt;br /&gt;
&lt;br /&gt;
=== What are the characteristics of the target group? ===&lt;br /&gt;
Like we already mentined (2.1) the business with the music is spreading more and more towards the internet. So over the years there are going to be developed more and more solutions (e.g. for children, elders, amaurotics etc.) for the music market place. &lt;br /&gt;
The target group is going to expand over the years.&lt;br /&gt;
&lt;br /&gt;
=== Are there any known / often used Methods / Visualisation Techniques? ===&lt;br /&gt;
&lt;br /&gt;
The most popular program for MP3 files is nowadays iTunes von Macintosh (Apple). This is mostly due to the big boom in the distribution of the iPod in the past few years. In order to manage the music archive, iTunes uses a XML (Extensible Markup Language). In this xml file, the metainformation is stored, independent from the proprietary audio format which e.g. use ID3 tags. The advantage is that the metainformation nevertheless can be edited, even if the audio files don&#039;t allow modificatoins to their tags. Besides iTunes contains a visualizer for different music genres and can encode (import) and decode (play-back) music in different audio formats, except for  music samples which is bought in the protected AAC-format.&lt;br /&gt;
&lt;br /&gt;
== Purpose of the Visualisation ==&lt;br /&gt;
&lt;br /&gt;
=== What should be achieved with the Visualisation? ===&lt;br /&gt;
Information should be displayed clearly and intuitinal. The user should have a clear view of the information, be able to orient him/herself, and always know that the information displayed is about a music sample.&lt;br /&gt;
&lt;br /&gt;
=== Which tasks should be solved? ===&lt;br /&gt;
A solution should be found which can be suitable for young and old, but also for the power and &amp;quot;less&amp;quot;-listeners. The problem is that presentation mostly functions and in fact is very subjective. On the one side the user wants to have as much information as possible displayed, and on the other side one wants to see only the relevant data. &amp;lt;br&amp;gt;&lt;br /&gt;
A good compromise should be found and developed.&lt;br /&gt;
&lt;br /&gt;
=== Questions that can be solved using this Visualisation ===&lt;br /&gt;
&lt;br /&gt;
* Which title is being played back at this very moment?&lt;br /&gt;
* Which interprets are available?&lt;br /&gt;
* Which titles are available?&lt;br /&gt;
* How many titles from a certain genre are available?&lt;br /&gt;
* Has the design been propertly developed?&lt;br /&gt;
* Is the view / information shown user friendly and straightforward?&lt;br /&gt;
&lt;br /&gt;
== Designproposal ==&lt;br /&gt;
&lt;br /&gt;
=== Which kinds of Visualisation should be used? ===&lt;br /&gt;
* Search for genre and interpret&lt;br /&gt;
* Filtered search output should be displayed in an information window&lt;br /&gt;
* View (display) and selection possibility for the genres&lt;br /&gt;
* View (display) of the current title and interpret&lt;br /&gt;
* Scrolling list up &amp;amp; down&lt;br /&gt;
* View (display) for the interprets&lt;br /&gt;
* Colored distinction of the amount of titles through intervals&amp;lt;br&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The main pannel stays clear until an artist or title is selected and afterwards gets filled with all the information.&lt;br /&gt;
&lt;br /&gt;
=== Visual Mapping ===&lt;br /&gt;
* Dimension &amp;quot;MP3 Anzahl&amp;quot; --&amp;gt; visual attribute &amp;quot;colored square&amp;quot;&lt;br /&gt;
The amount of titles is characterised in terms of color, e.g. red for &amp;lt;100 MP3 files&lt;br /&gt;
* Dimension &amp;quot;Interpret&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
* Dimension &amp;quot;Genre&amp;quot; --&amp;gt; visual attribute &amp;quot;square&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
&lt;br /&gt;
=== Description of Used Techniques / Applied Principles ===&lt;br /&gt;
* Details on demand: &lt;br /&gt;
(slide 57 of Info_Vis4.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* Focus &amp;amp; Context: Tiled Multi-Level Browser &lt;br /&gt;
(slide 65 of Info_Vis-0-Defs.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* File Structure to tree&lt;br /&gt;
(slide 21 of Info_Vis6.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
&lt;br /&gt;
=== Possibilities of the Interaction ===&lt;br /&gt;
Through the selection of a genre, the user is able to select an interpret/title. This yields to display of detailed information and possibility of play-back.&lt;br /&gt;
&lt;br /&gt;
* Information about the amout of the titles/genre&lt;br /&gt;
* Output of the information in the ID3 tags&lt;br /&gt;
* Navigation in the single windows with scrolls in order to get more detailed information&lt;br /&gt;
* Output for the filtered search results&lt;br /&gt;
* Player for play-back of the selected title&lt;br /&gt;
&lt;br /&gt;
=== Mockup(s) / Fake Screenshot(s) ===&lt;br /&gt;
&lt;br /&gt;
[[Image:Screenshot.jpg|none|thumb|500px|]]&lt;br /&gt;
&lt;br /&gt;
== References ==&lt;br /&gt;
&lt;br /&gt;
[1][Doug, 2005]Doug&#039;s Apple Scripts, Access Date: 22 November 2005, http://www.dougscripts.com/itunes/itinfo/id3tags00.php &amp;lt;br&amp;gt;&lt;br /&gt;
[2][RealNetworks, 2005] RealNetworks Inc., Access Date: 22 November 2005, http://home.real.com/product/help/rhapv3_ts/en/Track_Info_Edit.htm &amp;lt;br&amp;gt;&lt;br /&gt;
[3][Netzwelt, 2005]Netzwelt.de, Access Date: 22 November 2005, http://netzwelt.de/lexikon/ITunes.html&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8322</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8322"/>
		<updated>2005-11-22T22:39:08Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Source */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
Open Source&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
Gruppe 09&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8321</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8321"/>
		<updated>2005-11-22T22:38:41Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Source */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
Open Source&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
Gruppe09&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8320</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8320"/>
		<updated>2005-11-22T22:37:20Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
Open Source&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
Andreas Obermaier&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8319</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8319"/>
		<updated>2005-11-22T22:37:12Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
Open Source&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;br /&gt;
Andreas Obermaier&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8317</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8317"/>
		<updated>2005-11-22T22:36:02Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;br /&gt;
Andreas Obermaier&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8316</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8316"/>
		<updated>2005-11-22T22:35:46Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Screenshot of our MP3 Visualisation&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
Open Source&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;br /&gt;
Andreas Obermaier&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8312</id>
		<title>Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09 - Design</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8312"/>
		<updated>2005-11-22T22:34:16Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Mockup(s) / Fake Screenshot(s) */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Topic ==&lt;br /&gt;
MP3 Archive Visualization&lt;br /&gt;
&lt;br /&gt;
== Description of the Application Area and given Dataset ==&lt;br /&gt;
&lt;br /&gt;
=== Application Area Analysis ===&lt;br /&gt;
The application area is the creation of a MP3 archive visualisation and its ID3 tags. This should contain information like the name of the artist, the year it came out, name of the album etc. &amp;lt;br&amp;gt;&lt;br /&gt;
ID3 tags store information within the MP3 files. Originally ID3 tags held just the basic text-only information about a music file. They had a standard size and standardized information.&amp;lt;br&amp;gt;&lt;br /&gt;
The most important and also special thing about this project is to create a useful visualisation, which can store lots of information in one place, without having to abstain from a user friendly interface.&lt;br /&gt;
&lt;br /&gt;
=== Dataset Analysis ===&lt;br /&gt;
In the following table, you can find the attributes which should be contained in a MP3 file.&amp;lt;br&amp;gt; These attributes are  1-dimensional.&amp;lt;br&amp;gt;&lt;br /&gt;
A MP3 file contains only attributes with data.&lt;br /&gt;
{|&lt;br /&gt;
|- style=&amp;quot;background:#e06113&amp;quot;&lt;br /&gt;
!Attribute&lt;br /&gt;
!Data type&lt;br /&gt;
!Description&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track&lt;br /&gt;
|Discreet&lt;br /&gt;
|Track Name&lt;br /&gt;
|-&lt;br /&gt;
|Artist&lt;br /&gt;
|Discreet&lt;br /&gt;
|Artist name&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Album&lt;br /&gt;
|Discreet&lt;br /&gt;
|Album name&lt;br /&gt;
|-&lt;br /&gt;
|Genre&lt;br /&gt;
|Nominal&lt;br /&gt;
|Type or category of music&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The track&#039;s position on a CD&lt;br /&gt;
|-&lt;br /&gt;
|Disc #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The CD&#039;s position in relationship to other CDs in a series, such as a boxed set&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of tracks on the disc&lt;br /&gt;
|-&lt;br /&gt;
|Disc count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of discs&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Composer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Composer of the track&lt;br /&gt;
|-&lt;br /&gt;
|Performer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Performer of the Track&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Year&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The year the track was recorded&lt;br /&gt;
|-&lt;br /&gt;
|Size&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The file size&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Total time&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The total time of the song&lt;br /&gt;
|-&lt;br /&gt;
|Date added&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date when song was added to archive&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Play count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Number of time the song was played&lt;br /&gt;
|-&lt;br /&gt;
|Play date&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date of last play&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Bit rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Bit rate of song&lt;br /&gt;
|-&lt;br /&gt;
|BPM&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Beats per Minute&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Sample rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Sample rate of song&lt;br /&gt;
|- &lt;br /&gt;
|Location&lt;br /&gt;
|Discreet&lt;br /&gt;
|File location&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Kind&lt;br /&gt;
|Nominal&lt;br /&gt;
|Kind of file&lt;br /&gt;
|-&lt;br /&gt;
|Rating&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Personal rating &lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Comments&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Any comments you care to make about the track&lt;br /&gt;
|-&lt;br /&gt;
|Mood&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The mood of the track&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Target Group Analysis ==&lt;br /&gt;
&lt;br /&gt;
=== Who should use this visualation technique? ===&lt;br /&gt;
&lt;br /&gt;
In the past years media is getting much smaller, much better in quality, and also provide more space for our data. If you convert conventional audio files from CDs to the MP3 Format, you can afford to have your whole music collection on one larger hard drive. The business within the musich industry is taking over the internet. You are either able to download song, or listen to them directly through streams. So your favorite song is just a click away!&amp;lt;br&amp;gt;&lt;br /&gt;
Because of the fact that this new art of saving your songs, albums and so on, does not contain the usually shipped cd covers which were a very good visualisation of the audio you are listening to, it has become very important to find a good solution for the visualisation of your music archive. &amp;lt;br&amp;gt;&lt;br /&gt;
At this moment the target group are mostly the people who already use the MP3 format to store their audio data, but should expend soon to all the other music-lovers.&lt;br /&gt;
&lt;br /&gt;
=== What are the characteristics of the target group? ===&lt;br /&gt;
Like we already mentined (2.1) the business with the music is spreading more and more towards the internet. So over the years there are going to be developed more and more solutions (e.g. for children, elders, amaurotics etc.) for the music market place. &lt;br /&gt;
The target group is going to expand over the years.&lt;br /&gt;
&lt;br /&gt;
=== Are there any known / often used Methods / Visualisation Techniques? ===&lt;br /&gt;
&lt;br /&gt;
The most popular program for MP3 files is nowadays iTunes von Macintosh (Apple). This is mostly due to the big boom in the distribution of the iPod in the past few years. In order to manage the music archive, iTunes uses a XML (Extensible Markup Language). In this xml file, the metainformation is stored, independent from the proprietary audio format which e.g. use ID3 tags. The advantage is that the metainformation nevertheless can be edited, even if the audio files don&#039;t allow modificatoins to their tags. Besides iTunes contains a visualizer for different music genres and can encode (import) and decode (play-back) music in different audio formats, except for  music samples which is bought in the protected AAC-format.&lt;br /&gt;
&lt;br /&gt;
== Purpose of the Visualisation ==&lt;br /&gt;
&lt;br /&gt;
=== What should be achieved with the Visualisation? ===&lt;br /&gt;
Information should be displayed clearly and intuitinal. The user should have a clear view of the information, be able to orient him/herself, and always know that the information displayed is about a music sample.&lt;br /&gt;
&lt;br /&gt;
=== Which tasks should be solved? ===&lt;br /&gt;
A solution should be found which can be suitable for young and old, but also for the power and &amp;quot;less&amp;quot;-listeners. The problem is that presentation mostly functions and in fact is very subjective. On the one side the user wants to have as much information as possible displayed, and on the other side one wants to see only the relevant data. &amp;lt;br&amp;gt;&lt;br /&gt;
A good compromise should be found and developed.&lt;br /&gt;
&lt;br /&gt;
=== Questions that can be solved using this Visualisation ===&lt;br /&gt;
&lt;br /&gt;
* Which title is being played back at this very moment?&lt;br /&gt;
* Which interprets are available?&lt;br /&gt;
* Which titles are available?&lt;br /&gt;
* How many titles from a certain genre are available?&lt;br /&gt;
* Has the design been propertly developed?&lt;br /&gt;
* Is the view / information shown user friendly and straightforward?&lt;br /&gt;
&lt;br /&gt;
== Designproposal ==&lt;br /&gt;
&lt;br /&gt;
=== Which kinds of Visualisation should be used? ===&lt;br /&gt;
* Search for genre and interpret&lt;br /&gt;
* Filtered search output should be displayed in an information window&lt;br /&gt;
* View (display) and selection possibility for the genres&lt;br /&gt;
* View (display) of the current title and interpret&lt;br /&gt;
* Scrolling list up &amp;amp; down&lt;br /&gt;
* View (display) for the interprets&lt;br /&gt;
* Colored distinction of the amount of titles through intervals&amp;lt;br&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The main pannel stays clear until an artist or title is selected and afterwards gets filled with all the information.&lt;br /&gt;
&lt;br /&gt;
=== Visual Mapping ===&lt;br /&gt;
* Dimension &amp;quot;MP3 Anzahl&amp;quot; --&amp;gt; visual attribute &amp;quot;colored square&amp;quot;&lt;br /&gt;
The amount of titles is characterised in terms of color, e.g. red for &amp;lt;100 MP3 files&lt;br /&gt;
* Dimension &amp;quot;Interpret&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
* Dimension &amp;quot;Genre&amp;quot; --&amp;gt; visual attribute &amp;quot;square&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
&lt;br /&gt;
=== Description of Used Techniques / Applied Principles ===&lt;br /&gt;
* Details on demand: &lt;br /&gt;
(slide 57 of Info_Vis4.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* Focus &amp;amp; Context: Tiled Multi-Level Browser &lt;br /&gt;
(slide 65 of Info_Vis-0-Defs.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* File Structure to tree&lt;br /&gt;
(slide 21 of Info_Vis6.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
&lt;br /&gt;
=== Possibilities of the Interaction ===&lt;br /&gt;
Through the selection of a genre, the user is able to select an interpret/title. This yields to display of detailed information and possibility of play-back.&lt;br /&gt;
&lt;br /&gt;
* Information about the amout of the titles/genre&lt;br /&gt;
* Output of the information in the ID3 tags&lt;br /&gt;
* Navigation in the single windows with scrolls in order to get more detailed information&lt;br /&gt;
* Output for the filtered search results&lt;br /&gt;
* Player for play-back of the selected title&lt;br /&gt;
&lt;br /&gt;
=== Mockup(s) / Fake Screenshot(s) ===&lt;br /&gt;
&lt;br /&gt;
[[Image:Screenshot.jpg|none|thumb|500px|]]&lt;br /&gt;
&lt;br /&gt;
== References ==&lt;br /&gt;
&lt;br /&gt;
http://www.dougscripts.com/itunes/itinfo/id3tags00.php &amp;lt;br&amp;gt;&lt;br /&gt;
http://home.real.com/product/help/rhapv3_ts/en/Track_Info_Edit.htm &amp;lt;br&amp;gt;&lt;br /&gt;
http://netzwelt.de/lexikon/ITunes.html&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8311</id>
		<title>File:Screenshot.jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot.jpg&amp;diff=8311"/>
		<updated>2005-11-22T22:34:05Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: &lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8304</id>
		<title>Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09 - Design</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8304"/>
		<updated>2005-11-22T22:32:49Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Mockup(s) / Fake Screenshot(s) */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Topic ==&lt;br /&gt;
MP3 Archive Visualization&lt;br /&gt;
&lt;br /&gt;
== Description of the Application Area and given Dataset ==&lt;br /&gt;
&lt;br /&gt;
=== Application Area Analysis ===&lt;br /&gt;
The application area is the creation of a MP3 archive visualisation and its ID3 tags. This should contain information like the name of the artist, the year it came out, name of the album etc. &amp;lt;br&amp;gt;&lt;br /&gt;
ID3 tags store information within the MP3 files. Originally ID3 tags held just the basic text-only information about a music file. They had a standard size and standardized information.&amp;lt;br&amp;gt;&lt;br /&gt;
The most important and also special thing about this project is to create a useful visualisation, which can store lots of information in one place, without having to abstain from a user friendly interface.&lt;br /&gt;
&lt;br /&gt;
=== Dataset Analysis ===&lt;br /&gt;
In the following table, you can find the attributes which should be contained in a MP3 file.&amp;lt;br&amp;gt; These attributes are  1-dimensional.&amp;lt;br&amp;gt;&lt;br /&gt;
A MP3 file contains only attributes with data.&lt;br /&gt;
{|&lt;br /&gt;
|- style=&amp;quot;background:#e06113&amp;quot;&lt;br /&gt;
!Attribute&lt;br /&gt;
!Data type&lt;br /&gt;
!Description&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track&lt;br /&gt;
|Discreet&lt;br /&gt;
|Track Name&lt;br /&gt;
|-&lt;br /&gt;
|Artist&lt;br /&gt;
|Discreet&lt;br /&gt;
|Artist name&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Album&lt;br /&gt;
|Discreet&lt;br /&gt;
|Album name&lt;br /&gt;
|-&lt;br /&gt;
|Genre&lt;br /&gt;
|Nominal&lt;br /&gt;
|Type or category of music&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The track&#039;s position on a CD&lt;br /&gt;
|-&lt;br /&gt;
|Disc #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The CD&#039;s position in relationship to other CDs in a series, such as a boxed set&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of tracks on the disc&lt;br /&gt;
|-&lt;br /&gt;
|Disc count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of discs&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Composer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Composer of the track&lt;br /&gt;
|-&lt;br /&gt;
|Performer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Performer of the Track&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Year&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The year the track was recorded&lt;br /&gt;
|-&lt;br /&gt;
|Size&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The file size&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Total time&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The total time of the song&lt;br /&gt;
|-&lt;br /&gt;
|Date added&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date when song was added to archive&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Play count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Number of time the song was played&lt;br /&gt;
|-&lt;br /&gt;
|Play date&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date of last play&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Bit rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Bit rate of song&lt;br /&gt;
|-&lt;br /&gt;
|BPM&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Beats per Minute&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Sample rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Sample rate of song&lt;br /&gt;
|- &lt;br /&gt;
|Location&lt;br /&gt;
|Discreet&lt;br /&gt;
|File location&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Kind&lt;br /&gt;
|Nominal&lt;br /&gt;
|Kind of file&lt;br /&gt;
|-&lt;br /&gt;
|Rating&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Personal rating &lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Comments&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Any comments you care to make about the track&lt;br /&gt;
|-&lt;br /&gt;
|Mood&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The mood of the track&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Target Group Analysis ==&lt;br /&gt;
&lt;br /&gt;
=== Who should use this visualation technique? ===&lt;br /&gt;
&lt;br /&gt;
In the past years media is getting much smaller, much better in quality, and also provide more space for our data. If you convert conventional audio files from CDs to the MP3 Format, you can afford to have your whole music collection on one larger hard drive. The business within the musich industry is taking over the internet. You are either able to download song, or listen to them directly through streams. So your favorite song is just a click away!&amp;lt;br&amp;gt;&lt;br /&gt;
Because of the fact that this new art of saving your songs, albums and so on, does not contain the usually shipped cd covers which were a very good visualisation of the audio you are listening to, it has become very important to find a good solution for the visualisation of your music archive. &amp;lt;br&amp;gt;&lt;br /&gt;
At this moment the target group are mostly the people who already use the MP3 format to store their audio data, but should expend soon to all the other music-lovers.&lt;br /&gt;
&lt;br /&gt;
=== What are the characteristics of the target group? ===&lt;br /&gt;
Like we already mentined (2.1) the business with the music is spreading more and more towards the internet. So over the years there are going to be developed more and more solutions (e.g. for children, elders, amaurotics etc.) for the music market place. &lt;br /&gt;
The target group is going to expand over the years.&lt;br /&gt;
&lt;br /&gt;
=== Are there any known / often used Methods / Visualisation Techniques? ===&lt;br /&gt;
&lt;br /&gt;
The most popular program for MP3 files is nowadays iTunes von Macintosh (Apple). This is mostly due to the big boom in the distribution of the iPod in the past few years. In order to manage the music archive, iTunes uses a XML (Extensible Markup Language). In this xml file, the metainformation is stored, independent from the proprietary audio format which e.g. use ID3 tags. The advantage is that the metainformation nevertheless can be edited, even if the audio files don&#039;t allow modificatoins to their tags. Besides iTunes contains a visualizer for different music genres and can encode (import) and decode (play-back) music in different audio formats, except for  music samples which is bought in the protected AAC-format.&lt;br /&gt;
&lt;br /&gt;
== Purpose of the Visualisation ==&lt;br /&gt;
&lt;br /&gt;
=== What should be achieved with the Visualisation? ===&lt;br /&gt;
Information should be displayed clearly and intuitinal. The user should have a clear view of the information, be able to orient him/herself, and always know that the information displayed is about a music sample.&lt;br /&gt;
&lt;br /&gt;
=== Which tasks should be solved? ===&lt;br /&gt;
A solution should be found which can be suitable for young and old, but also for the power and &amp;quot;less&amp;quot;-listeners. The problem is that presentation mostly functions and in fact is very subjective. On the one side the user wants to have as much information as possible displayed, and on the other side one wants to see only the relevant data. &amp;lt;br&amp;gt;&lt;br /&gt;
A good compromise should be found and developed.&lt;br /&gt;
&lt;br /&gt;
=== Questions that can be solved using this Visualisation ===&lt;br /&gt;
&lt;br /&gt;
* Which title is being played back at this very moment?&lt;br /&gt;
* Which interprets are available?&lt;br /&gt;
* Which titles are available?&lt;br /&gt;
* How many titles from a certain genre are available?&lt;br /&gt;
* Has the design been propertly developed?&lt;br /&gt;
* Is the view / information shown user friendly and straightforward?&lt;br /&gt;
&lt;br /&gt;
== Designproposal ==&lt;br /&gt;
&lt;br /&gt;
=== Which kinds of Visualisation should be used? ===&lt;br /&gt;
* Search for genre and interpret&lt;br /&gt;
* Filtered search output should be displayed in an information window&lt;br /&gt;
* View (display) and selection possibility for the genres&lt;br /&gt;
* View (display) of the current title and interpret&lt;br /&gt;
* Scrolling list up &amp;amp; down&lt;br /&gt;
* View (display) for the interprets&lt;br /&gt;
* Colored distinction of the amount of titles through intervals&amp;lt;br&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The main pannel stays clear until an artist or title is selected and afterwards gets filled with all the information.&lt;br /&gt;
&lt;br /&gt;
=== Visual Mapping ===&lt;br /&gt;
* Dimension &amp;quot;MP3 Anzahl&amp;quot; --&amp;gt; visual attribute &amp;quot;colored square&amp;quot;&lt;br /&gt;
The amount of titles is characterised in terms of color, e.g. red for &amp;lt;100 MP3 files&lt;br /&gt;
* Dimension &amp;quot;Interpret&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
* Dimension &amp;quot;Genre&amp;quot; --&amp;gt; visual attribute &amp;quot;square&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
&lt;br /&gt;
=== Description of Used Techniques / Applied Principles ===&lt;br /&gt;
* Details on demand: &lt;br /&gt;
(slide 57 of Info_Vis4.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* Focus &amp;amp; Context: Tiled Multi-Level Browser &lt;br /&gt;
(slide 65 of Info_Vis-0-Defs.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* File Structure to tree&lt;br /&gt;
(slide 21 of Info_Vis6.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
&lt;br /&gt;
=== Possibilities of the Interaction ===&lt;br /&gt;
Through the selection of a genre, the user is able to select an interpret/title. This yields to display of detailed information and possibility of play-back.&lt;br /&gt;
&lt;br /&gt;
* Information about the amout of the titles/genre&lt;br /&gt;
* Output of the information in the ID3 tags&lt;br /&gt;
* Navigation in the single windows with scrolls in order to get more detailed information&lt;br /&gt;
* Output for the filtered search results&lt;br /&gt;
* Player for play-back of the selected title&lt;br /&gt;
&lt;br /&gt;
=== Mockup(s) / Fake Screenshot(s) ===&lt;br /&gt;
&lt;br /&gt;
[[Image:Screenshot(2).jpg|none|thumb|500px|]]&lt;br /&gt;
&lt;br /&gt;
== References ==&lt;br /&gt;
&lt;br /&gt;
http://www.dougscripts.com/itunes/itinfo/id3tags00.php &amp;lt;br&amp;gt;&lt;br /&gt;
http://home.real.com/product/help/rhapv3_ts/en/Track_Info_Edit.htm &amp;lt;br&amp;gt;&lt;br /&gt;
http://netzwelt.de/lexikon/ITunes.html&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Screenshot(2).jpg&amp;diff=8301</id>
		<title>File:Screenshot(2).jpg</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Screenshot(2).jpg&amp;diff=8301"/>
		<updated>2005-11-22T22:32:10Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: &lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8299</id>
		<title>Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09 - Design</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8299"/>
		<updated>2005-11-22T22:31:40Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Mockup(s) / Fake Screenshot(s) */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Topic ==&lt;br /&gt;
MP3 Archive Visualization&lt;br /&gt;
&lt;br /&gt;
== Description of the Application Area and given Dataset ==&lt;br /&gt;
&lt;br /&gt;
=== Application Area Analysis ===&lt;br /&gt;
The application area is the creation of a MP3 archive visualisation and its ID3 tags. This should contain information like the name of the artist, the year it came out, name of the album etc. &amp;lt;br&amp;gt;&lt;br /&gt;
ID3 tags store information within the MP3 files. Originally ID3 tags held just the basic text-only information about a music file. They had a standard size and standardized information.&amp;lt;br&amp;gt;&lt;br /&gt;
The most important and also special thing about this project is to create a useful visualisation, which can store lots of information in one place, without having to abstain from a user friendly interface.&lt;br /&gt;
&lt;br /&gt;
=== Dataset Analysis ===&lt;br /&gt;
In the following table, you can find the attributes which should be contained in a MP3 file.&amp;lt;br&amp;gt; These attributes are  1-dimensional.&amp;lt;br&amp;gt;&lt;br /&gt;
A MP3 file contains only attributes with data.&lt;br /&gt;
{|&lt;br /&gt;
|- style=&amp;quot;background:#e06113&amp;quot;&lt;br /&gt;
!Attribute&lt;br /&gt;
!Data type&lt;br /&gt;
!Description&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track&lt;br /&gt;
|Discreet&lt;br /&gt;
|Track Name&lt;br /&gt;
|-&lt;br /&gt;
|Artist&lt;br /&gt;
|Discreet&lt;br /&gt;
|Artist name&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Album&lt;br /&gt;
|Discreet&lt;br /&gt;
|Album name&lt;br /&gt;
|-&lt;br /&gt;
|Genre&lt;br /&gt;
|Nominal&lt;br /&gt;
|Type or category of music&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The track&#039;s position on a CD&lt;br /&gt;
|-&lt;br /&gt;
|Disc #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The CD&#039;s position in relationship to other CDs in a series, such as a boxed set&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of tracks on the disc&lt;br /&gt;
|-&lt;br /&gt;
|Disc count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of discs&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Composer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Composer of the track&lt;br /&gt;
|-&lt;br /&gt;
|Performer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Performer of the Track&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Year&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The year the track was recorded&lt;br /&gt;
|-&lt;br /&gt;
|Size&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The file size&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Total time&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The total time of the song&lt;br /&gt;
|-&lt;br /&gt;
|Date added&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date when song was added to archive&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Play count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Number of time the song was played&lt;br /&gt;
|-&lt;br /&gt;
|Play date&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date of last play&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Bit rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Bit rate of song&lt;br /&gt;
|-&lt;br /&gt;
|BPM&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Beats per Minute&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Sample rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Sample rate of song&lt;br /&gt;
|- &lt;br /&gt;
|Location&lt;br /&gt;
|Discreet&lt;br /&gt;
|File location&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Kind&lt;br /&gt;
|Nominal&lt;br /&gt;
|Kind of file&lt;br /&gt;
|-&lt;br /&gt;
|Rating&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Personal rating &lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Comments&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Any comments you care to make about the track&lt;br /&gt;
|-&lt;br /&gt;
|Mood&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The mood of the track&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Target Group Analysis ==&lt;br /&gt;
&lt;br /&gt;
=== Who should use this visualation technique? ===&lt;br /&gt;
&lt;br /&gt;
In the past years media is getting much smaller, much better in quality, and also provide more space for our data. If you convert conventional audio files from CDs to the MP3 Format, you can afford to have your whole music collection on one larger hard drive. The business within the musich industry is taking over the internet. You are either able to download song, or listen to them directly through streams. So your favorite song is just a click away!&amp;lt;br&amp;gt;&lt;br /&gt;
Because of the fact that this new art of saving your songs, albums and so on, does not contain the usually shipped cd covers which were a very good visualisation of the audio you are listening to, it has become very important to find a good solution for the visualisation of your music archive. &amp;lt;br&amp;gt;&lt;br /&gt;
At this moment the target group are mostly the people who already use the MP3 format to store their audio data, but should expend soon to all the other music-lovers.&lt;br /&gt;
&lt;br /&gt;
=== What are the characteristics of the target group? ===&lt;br /&gt;
Like we already mentined (2.1) the business with the music is spreading more and more towards the internet. So over the years there are going to be developed more and more solutions (e.g. for children, elders, amaurotics etc.) for the music market place. &lt;br /&gt;
The target group is going to expand over the years.&lt;br /&gt;
&lt;br /&gt;
=== Are there any known / often used Methods / Visualisation Techniques? ===&lt;br /&gt;
&lt;br /&gt;
The most popular program for MP3 files is nowadays iTunes von Macintosh (Apple). This is mostly due to the big boom in the distribution of the iPod in the past few years. In order to manage the music archive, iTunes uses a XML (Extensible Markup Language). In this xml file, the metainformation is stored, independent from the proprietary audio format which e.g. use ID3 tags. The advantage is that the metainformation nevertheless can be edited, even if the audio files don&#039;t allow modificatoins to their tags. Besides iTunes contains a visualizer for different music genres and can encode (import) and decode (play-back) music in different audio formats, except for  music samples which is bought in the protected AAC-format.&lt;br /&gt;
&lt;br /&gt;
== Purpose of the Visualisation ==&lt;br /&gt;
&lt;br /&gt;
=== What should be achieved with the Visualisation? ===&lt;br /&gt;
Information should be displayed clearly and intuitinal. The user should have a clear view of the information, be able to orient him/herself, and always know that the information displayed is about a music sample.&lt;br /&gt;
&lt;br /&gt;
=== Which tasks should be solved? ===&lt;br /&gt;
A solution should be found which can be suitable for young and old, but also for the power and &amp;quot;less&amp;quot;-listeners. The problem is that presentation mostly functions and in fact is very subjective. On the one side the user wants to have as much information as possible displayed, and on the other side one wants to see only the relevant data. &amp;lt;br&amp;gt;&lt;br /&gt;
A good compromise should be found and developed.&lt;br /&gt;
&lt;br /&gt;
=== Questions that can be solved using this Visualisation ===&lt;br /&gt;
&lt;br /&gt;
* Which title is being played back at this very moment?&lt;br /&gt;
* Which interprets are available?&lt;br /&gt;
* Which titles are available?&lt;br /&gt;
* How many titles from a certain genre are available?&lt;br /&gt;
* Has the design been propertly developed?&lt;br /&gt;
* Is the view / information shown user friendly and straightforward?&lt;br /&gt;
&lt;br /&gt;
== Designproposal ==&lt;br /&gt;
&lt;br /&gt;
=== Which kinds of Visualisation should be used? ===&lt;br /&gt;
* Search for genre and interpret&lt;br /&gt;
* Filtered search output should be displayed in an information window&lt;br /&gt;
* View (display) and selection possibility for the genres&lt;br /&gt;
* View (display) of the current title and interpret&lt;br /&gt;
* Scrolling list up &amp;amp; down&lt;br /&gt;
* View (display) for the interprets&lt;br /&gt;
* Colored distinction of the amount of titles through intervals&amp;lt;br&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The main pannel stays clear until an artist or title is selected and afterwards gets filled with all the information.&lt;br /&gt;
&lt;br /&gt;
=== Visual Mapping ===&lt;br /&gt;
* Dimension &amp;quot;MP3 Anzahl&amp;quot; --&amp;gt; visual attribute &amp;quot;colored square&amp;quot;&lt;br /&gt;
The amount of titles is characterised in terms of color, e.g. red for &amp;lt;100 MP3 files&lt;br /&gt;
* Dimension &amp;quot;Interpret&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
* Dimension &amp;quot;Genre&amp;quot; --&amp;gt; visual attribute &amp;quot;square&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
&lt;br /&gt;
=== Description of Used Techniques / Applied Principles ===&lt;br /&gt;
* Details on demand: &lt;br /&gt;
(slide 57 of Info_Vis4.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* Focus &amp;amp; Context: Tiled Multi-Level Browser &lt;br /&gt;
(slide 65 of Info_Vis-0-Defs.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* File Structure to tree&lt;br /&gt;
(slide 21 of Info_Vis6.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
&lt;br /&gt;
=== Possibilities of the Interaction ===&lt;br /&gt;
Through the selection of a genre, the user is able to select an interpret/title. This yields to display of detailed information and possibility of play-back.&lt;br /&gt;
&lt;br /&gt;
* Information about the amout of the titles/genre&lt;br /&gt;
* Output of the information in the ID3 tags&lt;br /&gt;
* Navigation in the single windows with scrolls in order to get more detailed information&lt;br /&gt;
* Output for the filtered search results&lt;br /&gt;
* Player for play-back of the selected title&lt;br /&gt;
&lt;br /&gt;
=== Mockup(s) / Fake Screenshot(s) ===&lt;br /&gt;
&lt;br /&gt;
[[Image:InfoVis_Gruppe09_Aufgabe3_Mp3.jpg|none|thumb|500px|]]&lt;br /&gt;
&lt;br /&gt;
== References ==&lt;br /&gt;
&lt;br /&gt;
http://www.dougscripts.com/itunes/itinfo/id3tags00.php &amp;lt;br&amp;gt;&lt;br /&gt;
http://home.real.com/product/help/rhapv3_ts/en/Track_Info_Edit.htm &amp;lt;br&amp;gt;&lt;br /&gt;
http://netzwelt.de/lexikon/ITunes.html&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8285</id>
		<title>Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09 - Design</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Teaching:TUW_-_UE_InfoVis_WS_2005/06_-_Gruppe_09_-_Design&amp;diff=8285"/>
		<updated>2005-11-22T22:05:30Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Possibilities of the Interaction */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Topic ==&lt;br /&gt;
MP3 Archive Visualization&lt;br /&gt;
&lt;br /&gt;
== Description of the Application Area and given Dataset ==&lt;br /&gt;
&lt;br /&gt;
=== Application Area Analysis ===&lt;br /&gt;
The application area is the creation of a MP3 archive visualisation and its ID3 tags. This should contain information like the name of the artist, the year it came out, name of the album etc. &amp;lt;br&amp;gt;&lt;br /&gt;
ID3 tags store information within the MP3 files. Originally ID3 tags held just the basic text-only information about a music file. They had a standard size and standardized information.&amp;lt;br&amp;gt;&lt;br /&gt;
The most important and also special thing about this project is to create a useful visualisation, which can store lots of information in one place, without having to abstain from a user friendly interface.&lt;br /&gt;
&lt;br /&gt;
=== Dataset Analysis ===&lt;br /&gt;
In the following table, you can find the attributes which should be contained in a MP3 file.&amp;lt;br&amp;gt; These attributes are  1-dimensional.&amp;lt;br&amp;gt;&lt;br /&gt;
A MP3 file contains only attributes with data.&lt;br /&gt;
{|&lt;br /&gt;
|- style=&amp;quot;background:#e06113&amp;quot;&lt;br /&gt;
!Attribute&lt;br /&gt;
!Data type&lt;br /&gt;
!Description&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track&lt;br /&gt;
|Discreet&lt;br /&gt;
|Track Name&lt;br /&gt;
|-&lt;br /&gt;
|Artist&lt;br /&gt;
|Discreet&lt;br /&gt;
|Artist name&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Album&lt;br /&gt;
|Discreet&lt;br /&gt;
|Album name&lt;br /&gt;
|-&lt;br /&gt;
|Genre&lt;br /&gt;
|Nominal&lt;br /&gt;
|Type or category of music&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The track&#039;s position on a CD&lt;br /&gt;
|-&lt;br /&gt;
|Disc #&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The CD&#039;s position in relationship to other CDs in a series, such as a boxed set&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Track count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of tracks on the disc&lt;br /&gt;
|-&lt;br /&gt;
|Disc count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Total number of discs&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Composer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Composer of the track&lt;br /&gt;
|-&lt;br /&gt;
|Performer&lt;br /&gt;
|Discreet&lt;br /&gt;
|Performer of the Track&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Year&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The year the track was recorded&lt;br /&gt;
|-&lt;br /&gt;
|Size&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The file size&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Total time&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The total time of the song&lt;br /&gt;
|-&lt;br /&gt;
|Date added&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date when song was added to archive&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Play count&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Number of time the song was played&lt;br /&gt;
|-&lt;br /&gt;
|Play date&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Date of last play&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Bit rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Bit rate of song&lt;br /&gt;
|-&lt;br /&gt;
|BPM&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Beats per Minute&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Sample rate&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Sample rate of song&lt;br /&gt;
|- &lt;br /&gt;
|Location&lt;br /&gt;
|Discreet&lt;br /&gt;
|File location&lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Kind&lt;br /&gt;
|Nominal&lt;br /&gt;
|Kind of file&lt;br /&gt;
|-&lt;br /&gt;
|Rating&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Personal rating &lt;br /&gt;
|- style=&amp;quot;background:#fd8d48&amp;quot;&lt;br /&gt;
|Comments&lt;br /&gt;
|Ordinal&lt;br /&gt;
|Any comments you care to make about the track&lt;br /&gt;
|-&lt;br /&gt;
|Mood&lt;br /&gt;
|Ordinal&lt;br /&gt;
|The mood of the track&lt;br /&gt;
|}&lt;br /&gt;
&lt;br /&gt;
== Target Group Analysis ==&lt;br /&gt;
&lt;br /&gt;
=== Who should use this visualation technique? ===&lt;br /&gt;
&lt;br /&gt;
In the past years media is getting much smaller, much better in quality, and also provide more space for our data. If you convert conventional audio files from CDs to the MP3 Format, you can afford to have your whole music collection on one larger hard drive. The business within the musich industry is taking over the internet. You are either able to download song, or listen to them directly through streams. So your favorite song is just a click away!&amp;lt;br&amp;gt;&lt;br /&gt;
Because of the fact that this new art of saving your songs, albums and so on, does not contain the usually shipped cd covers which were a very good visualisation of the audio you are listening to, it has become very important to find a good solution for the visualisation of your music archive. &amp;lt;br&amp;gt;&lt;br /&gt;
At this moment the target group are mostly the people who already use the MP3 format to store their audio data, but should expend soon to all the other music-lovers.&lt;br /&gt;
&lt;br /&gt;
=== What are the characteristics of the target group? ===&lt;br /&gt;
Like we already mentined (2.1) the business with the music is spreading more and more towards the internet. So over the years there are going to be developed more and more solutions (e.g. for children, elders, amaurotics etc.) for the music market place. &lt;br /&gt;
The target group is going to expand over the years.&lt;br /&gt;
&lt;br /&gt;
=== Are there any known / often used Methods / Visualisation Techniques? ===&lt;br /&gt;
&lt;br /&gt;
The most popular program for MP3 files is nowadays iTunes von Macintosh (Apple). This is mostly due to the big boom in the distribution of the iPod in the past few years. In order to manage the music archive, iTunes uses a XML (Extensible Markup Language). In this xml file, the metainformation is stored, independent from the proprietary audio format which e.g. use ID3 tags. The advantage is that the metainformation nevertheless can be edited, even if the audio files don&#039;t allow modificatoins to their tags. Besides iTunes contains a visualizer for different music genres and can encode (import) and decode (play-back) music in different audio formats, except for  music samples which is bought in the protected AAC-format.&lt;br /&gt;
&lt;br /&gt;
== Purpose of the Visualisation ==&lt;br /&gt;
&lt;br /&gt;
=== What should be achieved with the Visualisation? ===&lt;br /&gt;
Information should be displayed clearly and intuitinal. The user should have a clear view of the information, be able to orient him/herself, and always know that the information displayed is about a music sample.&lt;br /&gt;
&lt;br /&gt;
=== Which tasks should be solved? ===&lt;br /&gt;
A solution should be found which can be suitable for young and old, but also for the power and &amp;quot;less&amp;quot;-listeners. The problem is that presentation mostly functions and in fact is very subjective. On the one side the user wants to have as much information as possible displayed, and on the other side one wants to see only the relevant data. &amp;lt;br&amp;gt;&lt;br /&gt;
A good compromise should be found and developed.&lt;br /&gt;
&lt;br /&gt;
=== Questions that can be solved using this Visualisation ===&lt;br /&gt;
&lt;br /&gt;
* Which title is being played back at this very moment?&lt;br /&gt;
* Which interprets are available?&lt;br /&gt;
* Which titles are available?&lt;br /&gt;
* How many titles from a certain genre are available?&lt;br /&gt;
* Has the design been propertly developed?&lt;br /&gt;
* Is the view / information shown user friendly and straightforward?&lt;br /&gt;
&lt;br /&gt;
== Designproposal ==&lt;br /&gt;
&lt;br /&gt;
=== Which kinds of Visualisation should be used? ===&lt;br /&gt;
* Search for genre and interpret&lt;br /&gt;
* Filtered search output should be displayed in an information window&lt;br /&gt;
* View (display) and selection possibility for the genres&lt;br /&gt;
* View (display) of the current title and interpret&lt;br /&gt;
* Scrolling list up &amp;amp; down&lt;br /&gt;
* View (display) for the interprets&lt;br /&gt;
* Colored distinction of the amount of titles through intervals&amp;lt;br&amp;gt;&lt;br /&gt;
&lt;br /&gt;
The main pannel stays clear until an artist or title is selected and afterwards gets filled with all the information.&lt;br /&gt;
&lt;br /&gt;
=== Visual Mapping ===&lt;br /&gt;
* Dimension &amp;quot;MP3 Anzahl&amp;quot; --&amp;gt; visual attribute &amp;quot;colored square&amp;quot;&lt;br /&gt;
The amount of titles is characterised in terms of color, e.g. red for &amp;lt;100 MP3 files&lt;br /&gt;
* Dimension &amp;quot;Interpret&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
* Dimension &amp;quot;Genre&amp;quot; --&amp;gt; visual attribute &amp;quot;table&amp;quot;&lt;br /&gt;
Information should be displayed as a table&lt;br /&gt;
&lt;br /&gt;
=== Description of Used Techniques / Applied Principles ===&lt;br /&gt;
* Details on demand: &lt;br /&gt;
(slide 57 of Info_Vis4.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* Focus &amp;amp; Context: Tiled Multi-Level Browser &lt;br /&gt;
(slide 65 of Info_Vis-0-Defs.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
* File Structure to tree&lt;br /&gt;
(slide 21 of Info_Vis6.pdf handed out in the course 188.305 VO Informationsvisualisierung)&lt;br /&gt;
&lt;br /&gt;
=== Possibilities of the Interaction ===&lt;br /&gt;
Through the selection of a genre, the user is able to select an interpret/title. This yields to display of detailed information and possibility of play-back.&lt;br /&gt;
&lt;br /&gt;
* Information about the amout of the titles/genre&lt;br /&gt;
* Output of the information in the ID3 tags&lt;br /&gt;
* Navigation in the single windows with scrolls in order to get more detailed information&lt;br /&gt;
* Output for the filtered search results&lt;br /&gt;
* Player for play-back of the selected title&lt;br /&gt;
&lt;br /&gt;
=== Mockup(s) / Fake Screenshot(s) ===&lt;br /&gt;
&lt;br /&gt;
== References ==&lt;br /&gt;
&lt;br /&gt;
http://www.dougscripts.com/itunes/itinfo/id3tags00.php &amp;lt;br&amp;gt;&lt;br /&gt;
http://home.real.com/product/help/rhapv3_ts/en/Track_Info_Edit.htm &amp;lt;br&amp;gt;&lt;br /&gt;
http://netzwelt.de/lexikon/ITunes.html&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6726</id>
		<title>Color Coding / Color</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6726"/>
		<updated>2005-10-25T11:38:55Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* CMY und CMYK */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;==Definition(s)==&lt;br /&gt;
*Color: Color is the perceptual result of light in the visible region of the spectrum, having wavelengths in the region of 400 nm to 700 nm, incident upon the retina. [Poynton, 1997]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Coding: &lt;br /&gt;
**In communications systems, the altering of the characteristics of a signal to make the signal more suitable for an intended application, such as optimizing the signal for transmission, improving transmission quality and fidelity, modifying the signal spectrum, increasing the information content, providing error detection and/or correction, and providing data security (Note: A single coding scheme usually does not provide more than one or two specific capabilities. Different codes have different sets of advantages and disadvantages.) &lt;br /&gt;
**In communications and computer systems, implementing rules that are used to map the elements of one set onto the elements of another set, usually on a one-to-one basis &lt;br /&gt;
**The digital encoding of an analog signal and, conversely, decoding to an analog signal &lt;br /&gt;
**Computer programming &lt;br /&gt;
**The process of classification of information [http://www.mywiseowl.com/articles/Coding  &#039;&#039;http://www.mywiseowl.com/articles/Coding&#039;&#039;]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Color Coding: The typical human eye can distinguish over 10,000 different colors. We use color everyday to identify, classify and determine the state of objects around us. In addition to natural colors, we use color codes for displaying color on the Computer. That is what Color Coding is used for. [Sahler, 2005]&lt;br /&gt;
&lt;br /&gt;
==Introduction==&lt;br /&gt;
&lt;br /&gt;
&amp;lt;center&amp;gt;Light is electromagnetic radiation with wavelength between 380 nm = blue and 780 nm = red.&amp;lt;/center&amp;gt;&lt;br /&gt;
&amp;lt;center&amp;gt;Unit 1 nm = 1 billionth of a meter.&amp;lt;/center&amp;gt;&lt;br /&gt;
[[Image:Intro.JPG|thumb|400px|center]] &lt;br /&gt;
The complexity of all kinds of different color mixtures was substantially simplified in 1931 by Commission Internationale de l&#039;Éclairage CIE, who defined a two-dimensional, horseshoe-like color space, that allows easy definition and description of color mixtures. The edge of the horseshoe includes all the pure spectral colors. The inside region contains the mixtures. &lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
The human visual perception is too complex to be quantified in a more than approximate manner. One practical approach is to define 2,3 or more spectral colors and create mixed colors by adjusting the relative proportions of the said spectral colors and colorless (i.e. white/black) component,. Or one defines first the mixed color, quantifies first its colorless (brightness/darkness) component and then codes the color information as deviation in the direction of 2, 3 or more spectral colors. Typical examples would be the RGB and YIQ systems respectively. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Examples for Color Coding==&lt;br /&gt;
&lt;br /&gt;
===RGB===&lt;br /&gt;
&lt;br /&gt;
Shadow Mask Color CRTs consist of Red/Green/Blue triples, which are selectively excited through three cathode rays (accelerated through 3 separate anode voltages) Each combination of the voltages applied creates its own characteristical color, so it is natural to characterize different colors through the intensity ratios. The Shadow-Mask-Color-CRTs can not show all the colors, that a human eye can perceive. On the other a significant portion of possible colors can be comfortably described by the three RGB values. This simple color coding has accepted elatively fast and ound its way into all operating systems, image formats and programming languages. The acceptance level is also one of the reasons for use of this technology in all flat panel displays. The final result is that the RGB model is the most important and universal color coding convention. The RGB model may be satisfactory for display purposes, but unfortunately has limitations, which make it less than useful for applications, where the color is not supposed to depend from the display used to create or display it. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModelRGB.JPG|thumb|400px|left|3D-vector space of the RGB-color model]] &lt;br /&gt;
[[Image:RGB.JPG|thumb|300px|none|RGB Image]]&lt;br /&gt;
&lt;br /&gt;
===CMY===&lt;br /&gt;
&lt;br /&gt;
An active image display must fill its dark surface with light, i.e. combine the red, green and blue components into the final colors. When all three primary colors are added in equal proportions, a white color results. &lt;br /&gt;
A printer creates the colors the opposite way: it must create colors by eliminating - i..e. subtracting - the red, green and blue colors from the white paper background. By subtracting equal proportions of the primary colors a black color can be created. To achieve this one needs Cyan, Magenta and Yellow, colors which are complementary to RGB. The resulting CMY model is a straightforward complement of the RGB-Modell. The conversion from RGB into CMY is given by the following equations:&lt;br /&gt;
C = 255 - R; M = 255 - G; Y = 255 - B [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModeCMY.JPG|thumb|400px|left|3D-vector space of the CMY-color model]]&lt;br /&gt;
[[Image:CMY.JPG|thumb|300px|none|CMY Image]]&lt;br /&gt;
&lt;br /&gt;
===YIQ and YUV===&lt;br /&gt;
&lt;br /&gt;
In TV broadcasting the color is for all practical purposes an addition to the black and white information, provided by the so-called Y-signal: Y = g1*R+ g2*G + g3*B where g1+g2+g3 = 1.0. Two additional low-bandwidth signal pathways transport the color information in a form of weighted difference between the real signal and the Y component. &lt;br /&gt;
&lt;br /&gt;
YIQ:&lt;br /&gt;
is used in color TV norm NTSC (America and Japan).&lt;br /&gt;
&lt;br /&gt;
YUV:&lt;br /&gt;
is used in the PAL colorTV norm (Europe, Africa, Asia except for Japan, Australia) and in digital video. YUV uses similar signals as YIQ (with different weights, however, and using a coordinate system, rotated 33 degrees) but with a higher bandwidth and correspondingly higher quality. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
===HLS, HSV, HVC===&lt;br /&gt;
&lt;br /&gt;
These color models reflect the human color vision better than the RGB, CMY, YUV and YIQ models, which are targeted primarily for hardware applications. HLS, HSV, HVC are better suited for human than for electronic communication.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HLS&#039;&#039;&#039; is the abreviation for Hue-Lightness-Saturation.&lt;br /&gt;
&lt;br /&gt;
The HLS-Model can be best understood by an analogy of a painter deciding for a color he or she will apply:&lt;br /&gt;
(1) choose first a pure color (=Hue). &lt;br /&gt;
(2) add white pigment to it, so that it loses a little of its individuality (=Saturation).&lt;br /&gt;
(3) Now add the black pigment, so that the color is not too bright (=Lightness)&lt;br /&gt;
&lt;br /&gt;
The three coordinates H, L and S of this system can be easily visualized as follows:&lt;br /&gt;
Pure colors are found at the outer border of a horizontal color circle. The hue can be interpreted as the polar angle, going from red (0 degrees), green (120), blue (240) back to red. &lt;br /&gt;
The circle is closed to the outside, on the other side any point within the circle stands for some color. The closer to the center of the circle the higher the proportion of the white color. The center of the circle is colorless white.&lt;br /&gt;
Below this level other color circles are positioned in a cylindrical fashion. The lower they are, the darker they get. Descending along the vertical axis of the system from its top down to the bottom, one crosses from bright white color down to complete black. Off-axis, for instance for hue=red, one descends from bright red down to dark red, with the degree of color saturation depending on how far off-axis we are. Note that bright red is not as bright as bright white, which, additional to bright red, also contains bright green and bright blue. &lt;br /&gt;
This is why the final form of an HLS system consists of two tops (rotational pyramids), with their bottom sides glued together. The top point denotates absolute white, the bottom absolute black and the middle circle a circular approximation of all available colors at an intermediate intensity.&lt;br /&gt;
The Hue coordinate is described by an angle between 0 and 360 degrees, the Lightness (vertical axis) and Saturation (radial distance from the Lightness axis) with values between 0.0 and 1.0. The maximal color saturation possible depends on Lightness. Halfway from the top (L=0.5) the maximum saturation (in other words the radius of the circle) is S=1.0. The red color for instance thus has coordinates like H = 0 Degrees, L = 0.5 and S = 1.0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HLS.JPG|thumb|500px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HSV&#039;&#039;&#039; is an abbreviation for Hue-Saturation-Value.&lt;br /&gt;
This system is identical to HLS, just that instead of Lightness the vertical coordinate is named value&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HSV.JPG|thumb|400px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HVC&#039;&#039;&#039; is an abreviation of Hue-Value-Chroma.&lt;br /&gt;
This is a practical color coordinate system, designed about 1900 by a physicist A. Munsell. It is based on a set of samples, whose production is carefully controlled to ensure repeatability. The samples have been selected in such a fashion that from the point of view of human vision they sample the seeable colors in equidistant fashion. It is good in cases when subjective impression of the color is asked for but less useful in case of technical systems. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Bibliography==&lt;br /&gt;
*[Poynton, 1999] Charles Poynton, Frequently Asked Questions about Color, 30.12.1999, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorFAQ.pdf&lt;br /&gt;
&lt;br /&gt;
*[Sahler, 2005] Sahler Office Interiors &amp;amp; Information Systems, Color Coding, Oct. 2005, http://www.sahler.com/colorcode.shtml&lt;br /&gt;
&lt;br /&gt;
*[Miszalok and Smolej, 2001] V. Miszalok, V. Smolej, Color Coding, 13.01.2001, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;br /&gt;
&lt;br /&gt;
----&lt;br /&gt;
Back to [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09|Gruppe 09]]&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6725</id>
		<title>File:HSV.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6725"/>
		<updated>2005-10-25T11:38:42Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Infographic &amp;quot;Hue-Saturation-Value&amp;quot;&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6724</id>
		<title>File:HLS.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6724"/>
		<updated>2005-10-25T11:38:28Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
Infographic &amp;quot;Hue-Lightness-Saturation&amp;quot;&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6723</id>
		<title>File:CMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6723"/>
		<updated>2005-10-25T11:38:14Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
CMY-image&lt;br /&gt;
In case of an ink jet printer the upper right image is drawn using cyan ink,&lt;br /&gt;
the lower left using magenta&lt;br /&gt;
and the lower right using yellow ink.&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6722</id>
		<title>File:3DVecModeCMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6722"/>
		<updated>2005-10-25T11:37:58Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
3D-vector space of the CMY-color model&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6721</id>
		<title>File:RGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6721"/>
		<updated>2005-10-25T11:35:51Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
RGB-images contain 3 monochrome images,&lt;br /&gt;
the first being fed to the red electron gun of the shadow mask color CRT,&lt;br /&gt;
the second into the green and&lt;br /&gt;
the third into the blue gun.&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6720</id>
		<title>File:3DVecModelRGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6720"/>
		<updated>2005-10-25T11:35:34Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
3D-vector space of the RGB-color model&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6719</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6719"/>
		<updated>2005-10-25T11:35:11Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Summary ==&lt;br /&gt;
The Wavelength of Light&lt;br /&gt;
== Copyright Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6718</id>
		<title>File:HSV.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6718"/>
		<updated>2005-10-25T11:33:41Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
Infographic &amp;quot;Hue-Saturation-Value&amp;quot;&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6717</id>
		<title>File:HLS.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6717"/>
		<updated>2005-10-25T11:33:19Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
Infographic &amp;quot;Hue-Lightness-Saturation&amp;quot;&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6716</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6716"/>
		<updated>2005-10-25T11:32:23Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
The Wavelength of Light&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6715</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6715"/>
		<updated>2005-10-25T11:32:12Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Description */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
Describes the Wavelength of Light&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6714</id>
		<title>File:HSV.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6714"/>
		<updated>2005-10-25T11:31:44Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6713</id>
		<title>File:HSV.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6713"/>
		<updated>2005-10-25T11:30:59Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6712</id>
		<title>File:HSV.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HSV.JPG&amp;diff=6712"/>
		<updated>2005-10-25T11:30:54Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6711</id>
		<title>File:HLS.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6711"/>
		<updated>2005-10-25T11:30:37Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6710</id>
		<title>File:HLS.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6710"/>
		<updated>2005-10-25T11:30:13Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6709</id>
		<title>File:HLS.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:HLS.JPG&amp;diff=6709"/>
		<updated>2005-10-25T11:30:08Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6708</id>
		<title>File:CMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6708"/>
		<updated>2005-10-25T11:29:37Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
CMY-image&lt;br /&gt;
In case of an ink jet printer the upper right image is drawn using cyan ink,&lt;br /&gt;
the lower left using magenta&lt;br /&gt;
and the lower right using yellow ink.&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6707</id>
		<title>File:CMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6707"/>
		<updated>2005-10-25T11:29:19Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6706</id>
		<title>File:CMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:CMY.JPG&amp;diff=6706"/>
		<updated>2005-10-25T11:29:15Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6705</id>
		<title>File:3DVecModeCMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6705"/>
		<updated>2005-10-25T11:28:56Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
3D-vector space of the CMY-color model&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6704</id>
		<title>File:3DVecModeCMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6704"/>
		<updated>2005-10-25T11:28:40Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6703</id>
		<title>File:3DVecModeCMY.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModeCMY.JPG&amp;diff=6703"/>
		<updated>2005-10-25T11:28:35Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6702</id>
		<title>File:RGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6702"/>
		<updated>2005-10-25T11:28:16Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
RGB-images contain 3 monochrome images,&lt;br /&gt;
the first being fed to the red electron gun of the shadow mask color CRT,&lt;br /&gt;
the second into the green and&lt;br /&gt;
the third into the blue gun.&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6701</id>
		<title>File:RGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6701"/>
		<updated>2005-10-25T11:27:54Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6700</id>
		<title>File:RGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:RGB.JPG&amp;diff=6700"/>
		<updated>2005-10-25T11:27:46Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6699</id>
		<title>File:3DVecModelRGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6699"/>
		<updated>2005-10-25T11:26:41Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
3D-vector space of the RGB-color model&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6698</id>
		<title>File:3DVecModelRGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6698"/>
		<updated>2005-10-25T11:26:27Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6697</id>
		<title>File:3DVecModelRGB.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:3DVecModelRGB.JPG&amp;diff=6697"/>
		<updated>2005-10-25T11:26:19Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Beschreibung ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6696</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6696"/>
		<updated>2005-10-25T11:05:10Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Quelle */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Source ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6695</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6695"/>
		<updated>2005-10-25T11:05:03Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Copyright-Status */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6694</id>
		<title>File:Intro.JPG</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=File:Intro.JPG&amp;diff=6694"/>
		<updated>2005-10-25T11:04:55Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Beschreibung */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;== Description ==&lt;br /&gt;
&lt;br /&gt;
== Copyright-Status ==&lt;br /&gt;
&lt;br /&gt;
== Quelle ==&lt;br /&gt;
http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6685</id>
		<title>Color Coding / Color</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6685"/>
		<updated>2005-10-25T10:56:01Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Bibliography */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;==Definition(s)==&lt;br /&gt;
*Color: Color is the perceptual result of light in the visible region of the spectrum, having wavelengths in the region of 400 nm to 700 nm, incident upon the retina. [Poynton, 1997]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Coding: &lt;br /&gt;
**In communications systems, the altering of the characteristics of a signal to make the signal more suitable for an intended application, such as optimizing the signal for transmission, improving transmission quality and fidelity, modifying the signal spectrum, increasing the information content, providing error detection and/or correction, and providing data security (Note: A single coding scheme usually does not provide more than one or two specific capabilities. Different codes have different sets of advantages and disadvantages.) &lt;br /&gt;
**In communications and computer systems, implementing rules that are used to map the elements of one set onto the elements of another set, usually on a one-to-one basis &lt;br /&gt;
**The digital encoding of an analog signal and, conversely, decoding to an analog signal &lt;br /&gt;
**Computer programming &lt;br /&gt;
**The process of classification of information [http://www.mywiseowl.com/articles/Coding  &#039;&#039;http://www.mywiseowl.com/articles/Coding&#039;&#039;]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Color Coding: The typical human eye can distinguish over 10,000 different colors. We use color everyday to identify, classify and determine the state of objects around us. In addition to natural colors, we use color codes for displaying color on the Computer. That is what Color Coding is used for. [Sahler, 2005]&lt;br /&gt;
&lt;br /&gt;
==Introduction==&lt;br /&gt;
&lt;br /&gt;
&amp;lt;center&amp;gt;Light is electromagnetic radiation with wavelength between 380 nm = blue and 780 nm = red.&amp;lt;/center&amp;gt;&lt;br /&gt;
&amp;lt;center&amp;gt;Unit 1 nm = 1 billionth of a meter.&amp;lt;/center&amp;gt;&lt;br /&gt;
[[Image:Intro.JPG|thumb|400px|center]] &lt;br /&gt;
The complexity of all kinds of different color mixtures was substantially simplified in 1931 by Commission Internationale de l&#039;Éclairage CIE, who defined a two-dimensional, horseshoe-like color space, that allows easy definition and description of color mixtures. The edge of the horseshoe includes all the pure spectral colors. The inside region contains the mixtures. &lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
The human visual perception is too complex to be quantified in a more than approximate manner. One practical approach is to define 2,3 or more spectral colors and create mixed colors by adjusting the relative proportions of the said spectral colors and colorless (i.e. white/black) component,. Or one defines first the mixed color, quantifies first its colorless (brightness/darkness) component and then codes the color information as deviation in the direction of 2, 3 or more spectral colors. Typical examples would be the RGB and YIQ systems respectively. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Examples for Color Coding==&lt;br /&gt;
&lt;br /&gt;
===RGB===&lt;br /&gt;
&lt;br /&gt;
Shadow Mask Color CRTs consist of Red/Green/Blue triples, which are selectively excited through three cathode rays (accelerated through 3 separate anode voltages) Each combination of the voltages applied creates its own characteristical color, so it is natural to characterize different colors through the intensity ratios. The Shadow-Mask-Color-CRTs can not show all the colors, that a human eye can perceive. On the other a significant portion of possible colors can be comfortably described by the three RGB values. This simple color coding has accepted elatively fast and ound its way into all operating systems, image formats and programming languages. The acceptance level is also one of the reasons for use of this technology in all flat panel displays. The final result is that the RGB model is the most important and universal color coding convention. The RGB model may be satisfactory for display purposes, but unfortunately has limitations, which make it less than useful for applications, where the color is not supposed to depend from the display used to create or display it. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModelRGB.JPG|thumb|400px|left|3D-vector space of the RGB-color model]] &lt;br /&gt;
[[Image:RGB.JPG|thumb|300px|none|RGB Image]]&lt;br /&gt;
&lt;br /&gt;
===CMY und CMYK===&lt;br /&gt;
&lt;br /&gt;
An active image display must fill its dark surface with light, i.e. combine the red, green and blue components into the final colors. When all three primary colors are added in equal proportions, a white color results. &lt;br /&gt;
A printer creates the colors the opposite way: it must create colors by eliminating - i..e. subtracting - the red, green and blue colors from the white paper background. By subtracting equal proportions of the primary colors a black color can be created. To achieve this one needs Cyan, Magenta and Yellow, colors which are complementary to RGB. The resulting CMY model is a straightforward complement of the RGB-Modell. The conversion from RGB into CMY is given by the following equations:&lt;br /&gt;
C = 255 - R; M = 255 - G; Y = 255 - B [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModeCMY.JPG|thumb|400px|left|3D-vector space of the CMY-color model]]&lt;br /&gt;
[[Image:CMY.JPG|thumb|300px|none|CMY Image]]&lt;br /&gt;
&lt;br /&gt;
===YIQ and YUV===&lt;br /&gt;
&lt;br /&gt;
In TV broadcasting the color is for all practical purposes an addition to the black and white information, provided by the so-called Y-signal: Y = g1*R+ g2*G + g3*B where g1+g2+g3 = 1.0. Two additional low-bandwidth signal pathways transport the color information in a form of weighted difference between the real signal and the Y component. &lt;br /&gt;
&lt;br /&gt;
YIQ:&lt;br /&gt;
is used in color TV norm NTSC (America and Japan).&lt;br /&gt;
&lt;br /&gt;
YUV:&lt;br /&gt;
is used in the PAL colorTV norm (Europe, Africa, Asia except for Japan, Australia) and in digital video. YUV uses similar signals as YIQ (with different weights, however, and using a coordinate system, rotated 33 degrees) but with a higher bandwidth and correspondingly higher quality. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
===HLS, HSV, HVC===&lt;br /&gt;
&lt;br /&gt;
These color models reflect the human color vision better than the RGB, CMY, YUV and YIQ models, which are targeted primarily for hardware applications. HLS, HSV, HVC are better suited for human than for electronic communication.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HLS&#039;&#039;&#039; is the abreviation for Hue-Lightness-Saturation.&lt;br /&gt;
&lt;br /&gt;
The HLS-Model can be best understood by an analogy of a painter deciding for a color he or she will apply:&lt;br /&gt;
(1) choose first a pure color (=Hue). &lt;br /&gt;
(2) add white pigment to it, so that it loses a little of its individuality (=Saturation).&lt;br /&gt;
(3) Now add the black pigment, so that the color is not too bright (=Lightness)&lt;br /&gt;
&lt;br /&gt;
The three coordinates H, L and S of this system can be easily visualized as follows:&lt;br /&gt;
Pure colors are found at the outer border of a horizontal color circle. The hue can be interpreted as the polar angle, going from red (0 degrees), green (120), blue (240) back to red. &lt;br /&gt;
The circle is closed to the outside, on the other side any point within the circle stands for some color. The closer to the center of the circle the higher the proportion of the white color. The center of the circle is colorless white.&lt;br /&gt;
Below this level other color circles are positioned in a cylindrical fashion. The lower they are, the darker they get. Descending along the vertical axis of the system from its top down to the bottom, one crosses from bright white color down to complete black. Off-axis, for instance for hue=red, one descends from bright red down to dark red, with the degree of color saturation depending on how far off-axis we are. Note that bright red is not as bright as bright white, which, additional to bright red, also contains bright green and bright blue. &lt;br /&gt;
This is why the final form of an HLS system consists of two tops (rotational pyramids), with their bottom sides glued together. The top point denotates absolute white, the bottom absolute black and the middle circle a circular approximation of all available colors at an intermediate intensity.&lt;br /&gt;
The Hue coordinate is described by an angle between 0 and 360 degrees, the Lightness (vertical axis) and Saturation (radial distance from the Lightness axis) with values between 0.0 and 1.0. The maximal color saturation possible depends on Lightness. Halfway from the top (L=0.5) the maximum saturation (in other words the radius of the circle) is S=1.0. The red color for instance thus has coordinates like H = 0 Degrees, L = 0.5 and S = 1.0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HLS.JPG|thumb|500px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HSV&#039;&#039;&#039; is an abbreviation for Hue-Saturation-Value.&lt;br /&gt;
This system is identical to HLS, just that instead of Lightness the vertical coordinate is named value&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HSV.JPG|thumb|400px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HVC&#039;&#039;&#039; is an abreviation of Hue-Value-Chroma.&lt;br /&gt;
This is a practical color coordinate system, designed about 1900 by a physicist A. Munsell. It is based on a set of samples, whose production is carefully controlled to ensure repeatability. The samples have been selected in such a fashion that from the point of view of human vision they sample the seeable colors in equidistant fashion. It is good in cases when subjective impression of the color is asked for but less useful in case of technical systems. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Bibliography==&lt;br /&gt;
*[Poynton, 1999] Charles Poynton, Frequently Asked Questions about Color, 30.12.1999, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorFAQ.pdf&lt;br /&gt;
&lt;br /&gt;
*[Sahler, 2005] Sahler Office Interiors &amp;amp; Information Systems, Color Coding, Oct. 2005, http://www.sahler.com/colorcode.shtml&lt;br /&gt;
&lt;br /&gt;
*[Miszalok and Smolej, 2001] V. Miszalok, V. Smolej, Color Coding, 13.01.2001, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;br /&gt;
&lt;br /&gt;
----&lt;br /&gt;
Back to [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09|Gruppe 09]]&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6684</id>
		<title>Color Coding / Color</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6684"/>
		<updated>2005-10-25T10:55:49Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Bibliography */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;==Definition(s)==&lt;br /&gt;
*Color: Color is the perceptual result of light in the visible region of the spectrum, having wavelengths in the region of 400 nm to 700 nm, incident upon the retina. [Poynton, 1997]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Coding: &lt;br /&gt;
**In communications systems, the altering of the characteristics of a signal to make the signal more suitable for an intended application, such as optimizing the signal for transmission, improving transmission quality and fidelity, modifying the signal spectrum, increasing the information content, providing error detection and/or correction, and providing data security (Note: A single coding scheme usually does not provide more than one or two specific capabilities. Different codes have different sets of advantages and disadvantages.) &lt;br /&gt;
**In communications and computer systems, implementing rules that are used to map the elements of one set onto the elements of another set, usually on a one-to-one basis &lt;br /&gt;
**The digital encoding of an analog signal and, conversely, decoding to an analog signal &lt;br /&gt;
**Computer programming &lt;br /&gt;
**The process of classification of information [http://www.mywiseowl.com/articles/Coding  &#039;&#039;http://www.mywiseowl.com/articles/Coding&#039;&#039;]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Color Coding: The typical human eye can distinguish over 10,000 different colors. We use color everyday to identify, classify and determine the state of objects around us. In addition to natural colors, we use color codes for displaying color on the Computer. That is what Color Coding is used for. [Sahler, 2005]&lt;br /&gt;
&lt;br /&gt;
==Introduction==&lt;br /&gt;
&lt;br /&gt;
&amp;lt;center&amp;gt;Light is electromagnetic radiation with wavelength between 380 nm = blue and 780 nm = red.&amp;lt;/center&amp;gt;&lt;br /&gt;
&amp;lt;center&amp;gt;Unit 1 nm = 1 billionth of a meter.&amp;lt;/center&amp;gt;&lt;br /&gt;
[[Image:Intro.JPG|thumb|400px|center]] &lt;br /&gt;
The complexity of all kinds of different color mixtures was substantially simplified in 1931 by Commission Internationale de l&#039;Éclairage CIE, who defined a two-dimensional, horseshoe-like color space, that allows easy definition and description of color mixtures. The edge of the horseshoe includes all the pure spectral colors. The inside region contains the mixtures. &lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
The human visual perception is too complex to be quantified in a more than approximate manner. One practical approach is to define 2,3 or more spectral colors and create mixed colors by adjusting the relative proportions of the said spectral colors and colorless (i.e. white/black) component,. Or one defines first the mixed color, quantifies first its colorless (brightness/darkness) component and then codes the color information as deviation in the direction of 2, 3 or more spectral colors. Typical examples would be the RGB and YIQ systems respectively. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Examples for Color Coding==&lt;br /&gt;
&lt;br /&gt;
===RGB===&lt;br /&gt;
&lt;br /&gt;
Shadow Mask Color CRTs consist of Red/Green/Blue triples, which are selectively excited through three cathode rays (accelerated through 3 separate anode voltages) Each combination of the voltages applied creates its own characteristical color, so it is natural to characterize different colors through the intensity ratios. The Shadow-Mask-Color-CRTs can not show all the colors, that a human eye can perceive. On the other a significant portion of possible colors can be comfortably described by the three RGB values. This simple color coding has accepted elatively fast and ound its way into all operating systems, image formats and programming languages. The acceptance level is also one of the reasons for use of this technology in all flat panel displays. The final result is that the RGB model is the most important and universal color coding convention. The RGB model may be satisfactory for display purposes, but unfortunately has limitations, which make it less than useful for applications, where the color is not supposed to depend from the display used to create or display it. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModelRGB.JPG|thumb|400px|left|3D-vector space of the RGB-color model]] &lt;br /&gt;
[[Image:RGB.JPG|thumb|300px|none|RGB Image]]&lt;br /&gt;
&lt;br /&gt;
===CMY und CMYK===&lt;br /&gt;
&lt;br /&gt;
An active image display must fill its dark surface with light, i.e. combine the red, green and blue components into the final colors. When all three primary colors are added in equal proportions, a white color results. &lt;br /&gt;
A printer creates the colors the opposite way: it must create colors by eliminating - i..e. subtracting - the red, green and blue colors from the white paper background. By subtracting equal proportions of the primary colors a black color can be created. To achieve this one needs Cyan, Magenta and Yellow, colors which are complementary to RGB. The resulting CMY model is a straightforward complement of the RGB-Modell. The conversion from RGB into CMY is given by the following equations:&lt;br /&gt;
C = 255 - R; M = 255 - G; Y = 255 - B [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModeCMY.JPG|thumb|400px|left|3D-vector space of the CMY-color model]]&lt;br /&gt;
[[Image:CMY.JPG|thumb|300px|none|CMY Image]]&lt;br /&gt;
&lt;br /&gt;
===YIQ and YUV===&lt;br /&gt;
&lt;br /&gt;
In TV broadcasting the color is for all practical purposes an addition to the black and white information, provided by the so-called Y-signal: Y = g1*R+ g2*G + g3*B where g1+g2+g3 = 1.0. Two additional low-bandwidth signal pathways transport the color information in a form of weighted difference between the real signal and the Y component. &lt;br /&gt;
&lt;br /&gt;
YIQ:&lt;br /&gt;
is used in color TV norm NTSC (America and Japan).&lt;br /&gt;
&lt;br /&gt;
YUV:&lt;br /&gt;
is used in the PAL colorTV norm (Europe, Africa, Asia except for Japan, Australia) and in digital video. YUV uses similar signals as YIQ (with different weights, however, and using a coordinate system, rotated 33 degrees) but with a higher bandwidth and correspondingly higher quality. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
===HLS, HSV, HVC===&lt;br /&gt;
&lt;br /&gt;
These color models reflect the human color vision better than the RGB, CMY, YUV and YIQ models, which are targeted primarily for hardware applications. HLS, HSV, HVC are better suited for human than for electronic communication.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HLS&#039;&#039;&#039; is the abreviation for Hue-Lightness-Saturation.&lt;br /&gt;
&lt;br /&gt;
The HLS-Model can be best understood by an analogy of a painter deciding for a color he or she will apply:&lt;br /&gt;
(1) choose first a pure color (=Hue). &lt;br /&gt;
(2) add white pigment to it, so that it loses a little of its individuality (=Saturation).&lt;br /&gt;
(3) Now add the black pigment, so that the color is not too bright (=Lightness)&lt;br /&gt;
&lt;br /&gt;
The three coordinates H, L and S of this system can be easily visualized as follows:&lt;br /&gt;
Pure colors are found at the outer border of a horizontal color circle. The hue can be interpreted as the polar angle, going from red (0 degrees), green (120), blue (240) back to red. &lt;br /&gt;
The circle is closed to the outside, on the other side any point within the circle stands for some color. The closer to the center of the circle the higher the proportion of the white color. The center of the circle is colorless white.&lt;br /&gt;
Below this level other color circles are positioned in a cylindrical fashion. The lower they are, the darker they get. Descending along the vertical axis of the system from its top down to the bottom, one crosses from bright white color down to complete black. Off-axis, for instance for hue=red, one descends from bright red down to dark red, with the degree of color saturation depending on how far off-axis we are. Note that bright red is not as bright as bright white, which, additional to bright red, also contains bright green and bright blue. &lt;br /&gt;
This is why the final form of an HLS system consists of two tops (rotational pyramids), with their bottom sides glued together. The top point denotates absolute white, the bottom absolute black and the middle circle a circular approximation of all available colors at an intermediate intensity.&lt;br /&gt;
The Hue coordinate is described by an angle between 0 and 360 degrees, the Lightness (vertical axis) and Saturation (radial distance from the Lightness axis) with values between 0.0 and 1.0. The maximal color saturation possible depends on Lightness. Halfway from the top (L=0.5) the maximum saturation (in other words the radius of the circle) is S=1.0. The red color for instance thus has coordinates like H = 0 Degrees, L = 0.5 and S = 1.0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HLS.JPG|thumb|500px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HSV&#039;&#039;&#039; is an abbreviation for Hue-Saturation-Value.&lt;br /&gt;
This system is identical to HLS, just that instead of Lightness the vertical coordinate is named value&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HSV.JPG|thumb|400px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HVC&#039;&#039;&#039; is an abreviation of Hue-Value-Chroma.&lt;br /&gt;
This is a practical color coordinate system, designed about 1900 by a physicist A. Munsell. It is based on a set of samples, whose production is carefully controlled to ensure repeatability. The samples have been selected in such a fashion that from the point of view of human vision they sample the seeable colors in equidistant fashion. It is good in cases when subjective impression of the color is asked for but less useful in case of technical systems. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Bibliography==&lt;br /&gt;
*[Poynton, 1999] Charles Poynton, Frequently Asked Questions about Color, 30.12.1999, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorFAQ.pdf&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*[Sahler, 2005] Sahler Office Interiors &amp;amp; Information Systems, Color Coding, Oct. 2005, http://www.sahler.com/colorcode.shtml&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*[Miszalok and Smolej, 2001] V. Miszalok, V. Smolej, Color Coding, 13.01.2001, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;br /&gt;
&lt;br /&gt;
----&lt;br /&gt;
Back to [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09|Gruppe 09]]&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6683</id>
		<title>Color Coding / Color</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6683"/>
		<updated>2005-10-25T10:53:59Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Definition(s) */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;==Definition(s)==&lt;br /&gt;
*Color: Color is the perceptual result of light in the visible region of the spectrum, having wavelengths in the region of 400 nm to 700 nm, incident upon the retina. [Poynton, 1997]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Coding: &lt;br /&gt;
**In communications systems, the altering of the characteristics of a signal to make the signal more suitable for an intended application, such as optimizing the signal for transmission, improving transmission quality and fidelity, modifying the signal spectrum, increasing the information content, providing error detection and/or correction, and providing data security (Note: A single coding scheme usually does not provide more than one or two specific capabilities. Different codes have different sets of advantages and disadvantages.) &lt;br /&gt;
**In communications and computer systems, implementing rules that are used to map the elements of one set onto the elements of another set, usually on a one-to-one basis &lt;br /&gt;
**The digital encoding of an analog signal and, conversely, decoding to an analog signal &lt;br /&gt;
**Computer programming &lt;br /&gt;
**The process of classification of information [http://www.mywiseowl.com/articles/Coding  &#039;&#039;http://www.mywiseowl.com/articles/Coding&#039;&#039;]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
*Color Coding: The typical human eye can distinguish over 10,000 different colors. We use color everyday to identify, classify and determine the state of objects around us. In addition to natural colors, we use color codes for displaying color on the Computer. That is what Color Coding is used for. [Sahler, 2005]&lt;br /&gt;
&lt;br /&gt;
==Introduction==&lt;br /&gt;
&lt;br /&gt;
&amp;lt;center&amp;gt;Light is electromagnetic radiation with wavelength between 380 nm = blue and 780 nm = red.&amp;lt;/center&amp;gt;&lt;br /&gt;
&amp;lt;center&amp;gt;Unit 1 nm = 1 billionth of a meter.&amp;lt;/center&amp;gt;&lt;br /&gt;
[[Image:Intro.JPG|thumb|400px|center]] &lt;br /&gt;
The complexity of all kinds of different color mixtures was substantially simplified in 1931 by Commission Internationale de l&#039;Éclairage CIE, who defined a two-dimensional, horseshoe-like color space, that allows easy definition and description of color mixtures. The edge of the horseshoe includes all the pure spectral colors. The inside region contains the mixtures. &lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
The human visual perception is too complex to be quantified in a more than approximate manner. One practical approach is to define 2,3 or more spectral colors and create mixed colors by adjusting the relative proportions of the said spectral colors and colorless (i.e. white/black) component,. Or one defines first the mixed color, quantifies first its colorless (brightness/darkness) component and then codes the color information as deviation in the direction of 2, 3 or more spectral colors. Typical examples would be the RGB and YIQ systems respectively. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Examples for Color Coding==&lt;br /&gt;
&lt;br /&gt;
===RGB===&lt;br /&gt;
&lt;br /&gt;
Shadow Mask Color CRTs consist of Red/Green/Blue triples, which are selectively excited through three cathode rays (accelerated through 3 separate anode voltages) Each combination of the voltages applied creates its own characteristical color, so it is natural to characterize different colors through the intensity ratios. The Shadow-Mask-Color-CRTs can not show all the colors, that a human eye can perceive. On the other a significant portion of possible colors can be comfortably described by the three RGB values. This simple color coding has accepted elatively fast and ound its way into all operating systems, image formats and programming languages. The acceptance level is also one of the reasons for use of this technology in all flat panel displays. The final result is that the RGB model is the most important and universal color coding convention. The RGB model may be satisfactory for display purposes, but unfortunately has limitations, which make it less than useful for applications, where the color is not supposed to depend from the display used to create or display it. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModelRGB.JPG|thumb|400px|left|3D-vector space of the RGB-color model]] &lt;br /&gt;
[[Image:RGB.JPG|thumb|300px|none|RGB Image]]&lt;br /&gt;
&lt;br /&gt;
===CMY und CMYK===&lt;br /&gt;
&lt;br /&gt;
An active image display must fill its dark surface with light, i.e. combine the red, green and blue components into the final colors. When all three primary colors are added in equal proportions, a white color results. &lt;br /&gt;
A printer creates the colors the opposite way: it must create colors by eliminating - i..e. subtracting - the red, green and blue colors from the white paper background. By subtracting equal proportions of the primary colors a black color can be created. To achieve this one needs Cyan, Magenta and Yellow, colors which are complementary to RGB. The resulting CMY model is a straightforward complement of the RGB-Modell. The conversion from RGB into CMY is given by the following equations:&lt;br /&gt;
C = 255 - R; M = 255 - G; Y = 255 - B [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModeCMY.JPG|thumb|400px|left|3D-vector space of the CMY-color model]]&lt;br /&gt;
[[Image:CMY.JPG|thumb|300px|none|CMY Image]]&lt;br /&gt;
&lt;br /&gt;
===YIQ and YUV===&lt;br /&gt;
&lt;br /&gt;
In TV broadcasting the color is for all practical purposes an addition to the black and white information, provided by the so-called Y-signal: Y = g1*R+ g2*G + g3*B where g1+g2+g3 = 1.0. Two additional low-bandwidth signal pathways transport the color information in a form of weighted difference between the real signal and the Y component. &lt;br /&gt;
&lt;br /&gt;
YIQ:&lt;br /&gt;
is used in color TV norm NTSC (America and Japan).&lt;br /&gt;
&lt;br /&gt;
YUV:&lt;br /&gt;
is used in the PAL colorTV norm (Europe, Africa, Asia except for Japan, Australia) and in digital video. YUV uses similar signals as YIQ (with different weights, however, and using a coordinate system, rotated 33 degrees) but with a higher bandwidth and correspondingly higher quality. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
===HLS, HSV, HVC===&lt;br /&gt;
&lt;br /&gt;
These color models reflect the human color vision better than the RGB, CMY, YUV and YIQ models, which are targeted primarily for hardware applications. HLS, HSV, HVC are better suited for human than for electronic communication.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HLS&#039;&#039;&#039; is the abreviation for Hue-Lightness-Saturation.&lt;br /&gt;
&lt;br /&gt;
The HLS-Model can be best understood by an analogy of a painter deciding for a color he or she will apply:&lt;br /&gt;
(1) choose first a pure color (=Hue). &lt;br /&gt;
(2) add white pigment to it, so that it loses a little of its individuality (=Saturation).&lt;br /&gt;
(3) Now add the black pigment, so that the color is not too bright (=Lightness)&lt;br /&gt;
&lt;br /&gt;
The three coordinates H, L and S of this system can be easily visualized as follows:&lt;br /&gt;
Pure colors are found at the outer border of a horizontal color circle. The hue can be interpreted as the polar angle, going from red (0 degrees), green (120), blue (240) back to red. &lt;br /&gt;
The circle is closed to the outside, on the other side any point within the circle stands for some color. The closer to the center of the circle the higher the proportion of the white color. The center of the circle is colorless white.&lt;br /&gt;
Below this level other color circles are positioned in a cylindrical fashion. The lower they are, the darker they get. Descending along the vertical axis of the system from its top down to the bottom, one crosses from bright white color down to complete black. Off-axis, for instance for hue=red, one descends from bright red down to dark red, with the degree of color saturation depending on how far off-axis we are. Note that bright red is not as bright as bright white, which, additional to bright red, also contains bright green and bright blue. &lt;br /&gt;
This is why the final form of an HLS system consists of two tops (rotational pyramids), with their bottom sides glued together. The top point denotates absolute white, the bottom absolute black and the middle circle a circular approximation of all available colors at an intermediate intensity.&lt;br /&gt;
The Hue coordinate is described by an angle between 0 and 360 degrees, the Lightness (vertical axis) and Saturation (radial distance from the Lightness axis) with values between 0.0 and 1.0. The maximal color saturation possible depends on Lightness. Halfway from the top (L=0.5) the maximum saturation (in other words the radius of the circle) is S=1.0. The red color for instance thus has coordinates like H = 0 Degrees, L = 0.5 and S = 1.0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HLS.JPG|thumb|500px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HSV&#039;&#039;&#039; is an abbreviation for Hue-Saturation-Value.&lt;br /&gt;
This system is identical to HLS, just that instead of Lightness the vertical coordinate is named value&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HSV.JPG|thumb|400px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HVC&#039;&#039;&#039; is an abreviation of Hue-Value-Chroma.&lt;br /&gt;
This is a practical color coordinate system, designed about 1900 by a physicist A. Munsell. It is based on a set of samples, whose production is carefully controlled to ensure repeatability. The samples have been selected in such a fashion that from the point of view of human vision they sample the seeable colors in equidistant fashion. It is good in cases when subjective impression of the color is asked for but less useful in case of technical systems. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Bibliography==&lt;br /&gt;
[Poynton, 1999] Charles Poynton, Frequently Asked Questions about Color, 30.12.1999, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorFAQ.pdf&lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
[Sahler, 2005] Sahler Office Interiors &amp;amp; Information Systems, Color Coding, Oct. 2005, http://www.sahler.com/colorcode.shtml&lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
[Miszalok and Smolej, 2001] V. Miszalok, V. Smolej, Color Coding, 13.01.2001, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;br /&gt;
&lt;br /&gt;
----&lt;br /&gt;
Back to [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09|Gruppe 09]]&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
	<entry>
		<id>https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6682</id>
		<title>Color Coding / Color</title>
		<link rel="alternate" type="text/html" href="https://infovis-wiki.net/w/index.php?title=Color_Coding_/_Color&amp;diff=6682"/>
		<updated>2005-10-25T10:53:49Z</updated>

		<summary type="html">&lt;p&gt;UE-InfoVis0506 0402143: /* Definition(s) */&lt;/p&gt;
&lt;hr /&gt;
&lt;div&gt;==Definition(s)==&lt;br /&gt;
*Color: Color is the perceptual result of light in the visible region of the spectrum, having wavelengths in the region of 400 nm to 700 nm, incident upon the retina. [Poynton, 1997]&lt;br /&gt;
&lt;br /&gt;
*Coding: &lt;br /&gt;
**In communications systems, the altering of the characteristics of a signal to make the signal more suitable for an intended application, such as optimizing the signal for transmission, improving transmission quality and fidelity, modifying the signal spectrum, increasing the information content, providing error detection and/or correction, and providing data security (Note: A single coding scheme usually does not provide more than one or two specific capabilities. Different codes have different sets of advantages and disadvantages.) &lt;br /&gt;
**In communications and computer systems, implementing rules that are used to map the elements of one set onto the elements of another set, usually on a one-to-one basis &lt;br /&gt;
**The digital encoding of an analog signal and, conversely, decoding to an analog signal &lt;br /&gt;
**Computer programming &lt;br /&gt;
**The process of classification of information [http://www.mywiseowl.com/articles/Coding  &#039;&#039;http://www.mywiseowl.com/articles/Coding&#039;&#039;]&lt;br /&gt;
&lt;br /&gt;
*Color Coding: The typical human eye can distinguish over 10,000 different colors. We use color everyday to identify, classify and determine the state of objects around us. In addition to natural colors, we use color codes for displaying color on the Computer. That is what Color Coding is used for. [Sahler, 2005]&lt;br /&gt;
&lt;br /&gt;
==Introduction==&lt;br /&gt;
&lt;br /&gt;
&amp;lt;center&amp;gt;Light is electromagnetic radiation with wavelength between 380 nm = blue and 780 nm = red.&amp;lt;/center&amp;gt;&lt;br /&gt;
&amp;lt;center&amp;gt;Unit 1 nm = 1 billionth of a meter.&amp;lt;/center&amp;gt;&lt;br /&gt;
[[Image:Intro.JPG|thumb|400px|center]] &lt;br /&gt;
The complexity of all kinds of different color mixtures was substantially simplified in 1931 by Commission Internationale de l&#039;Éclairage CIE, who defined a two-dimensional, horseshoe-like color space, that allows easy definition and description of color mixtures. The edge of the horseshoe includes all the pure spectral colors. The inside region contains the mixtures. &lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
The human visual perception is too complex to be quantified in a more than approximate manner. One practical approach is to define 2,3 or more spectral colors and create mixed colors by adjusting the relative proportions of the said spectral colors and colorless (i.e. white/black) component,. Or one defines first the mixed color, quantifies first its colorless (brightness/darkness) component and then codes the color information as deviation in the direction of 2, 3 or more spectral colors. Typical examples would be the RGB and YIQ systems respectively. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Examples for Color Coding==&lt;br /&gt;
&lt;br /&gt;
===RGB===&lt;br /&gt;
&lt;br /&gt;
Shadow Mask Color CRTs consist of Red/Green/Blue triples, which are selectively excited through three cathode rays (accelerated through 3 separate anode voltages) Each combination of the voltages applied creates its own characteristical color, so it is natural to characterize different colors through the intensity ratios. The Shadow-Mask-Color-CRTs can not show all the colors, that a human eye can perceive. On the other a significant portion of possible colors can be comfortably described by the three RGB values. This simple color coding has accepted elatively fast and ound its way into all operating systems, image formats and programming languages. The acceptance level is also one of the reasons for use of this technology in all flat panel displays. The final result is that the RGB model is the most important and universal color coding convention. The RGB model may be satisfactory for display purposes, but unfortunately has limitations, which make it less than useful for applications, where the color is not supposed to depend from the display used to create or display it. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModelRGB.JPG|thumb|400px|left|3D-vector space of the RGB-color model]] &lt;br /&gt;
[[Image:RGB.JPG|thumb|300px|none|RGB Image]]&lt;br /&gt;
&lt;br /&gt;
===CMY und CMYK===&lt;br /&gt;
&lt;br /&gt;
An active image display must fill its dark surface with light, i.e. combine the red, green and blue components into the final colors. When all three primary colors are added in equal proportions, a white color results. &lt;br /&gt;
A printer creates the colors the opposite way: it must create colors by eliminating - i..e. subtracting - the red, green and blue colors from the white paper background. By subtracting equal proportions of the primary colors a black color can be created. To achieve this one needs Cyan, Magenta and Yellow, colors which are complementary to RGB. The resulting CMY model is a straightforward complement of the RGB-Modell. The conversion from RGB into CMY is given by the following equations:&lt;br /&gt;
C = 255 - R; M = 255 - G; Y = 255 - B [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:3DVecModeCMY.JPG|thumb|400px|left|3D-vector space of the CMY-color model]]&lt;br /&gt;
[[Image:CMY.JPG|thumb|300px|none|CMY Image]]&lt;br /&gt;
&lt;br /&gt;
===YIQ and YUV===&lt;br /&gt;
&lt;br /&gt;
In TV broadcasting the color is for all practical purposes an addition to the black and white information, provided by the so-called Y-signal: Y = g1*R+ g2*G + g3*B where g1+g2+g3 = 1.0. Two additional low-bandwidth signal pathways transport the color information in a form of weighted difference between the real signal and the Y component. &lt;br /&gt;
&lt;br /&gt;
YIQ:&lt;br /&gt;
is used in color TV norm NTSC (America and Japan).&lt;br /&gt;
&lt;br /&gt;
YUV:&lt;br /&gt;
is used in the PAL colorTV norm (Europe, Africa, Asia except for Japan, Australia) and in digital video. YUV uses similar signals as YIQ (with different weights, however, and using a coordinate system, rotated 33 degrees) but with a higher bandwidth and correspondingly higher quality. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
===HLS, HSV, HVC===&lt;br /&gt;
&lt;br /&gt;
These color models reflect the human color vision better than the RGB, CMY, YUV and YIQ models, which are targeted primarily for hardware applications. HLS, HSV, HVC are better suited for human than for electronic communication.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HLS&#039;&#039;&#039; is the abreviation for Hue-Lightness-Saturation.&lt;br /&gt;
&lt;br /&gt;
The HLS-Model can be best understood by an analogy of a painter deciding for a color he or she will apply:&lt;br /&gt;
(1) choose first a pure color (=Hue). &lt;br /&gt;
(2) add white pigment to it, so that it loses a little of its individuality (=Saturation).&lt;br /&gt;
(3) Now add the black pigment, so that the color is not too bright (=Lightness)&lt;br /&gt;
&lt;br /&gt;
The three coordinates H, L and S of this system can be easily visualized as follows:&lt;br /&gt;
Pure colors are found at the outer border of a horizontal color circle. The hue can be interpreted as the polar angle, going from red (0 degrees), green (120), blue (240) back to red. &lt;br /&gt;
The circle is closed to the outside, on the other side any point within the circle stands for some color. The closer to the center of the circle the higher the proportion of the white color. The center of the circle is colorless white.&lt;br /&gt;
Below this level other color circles are positioned in a cylindrical fashion. The lower they are, the darker they get. Descending along the vertical axis of the system from its top down to the bottom, one crosses from bright white color down to complete black. Off-axis, for instance for hue=red, one descends from bright red down to dark red, with the degree of color saturation depending on how far off-axis we are. Note that bright red is not as bright as bright white, which, additional to bright red, also contains bright green and bright blue. &lt;br /&gt;
This is why the final form of an HLS system consists of two tops (rotational pyramids), with their bottom sides glued together. The top point denotates absolute white, the bottom absolute black and the middle circle a circular approximation of all available colors at an intermediate intensity.&lt;br /&gt;
The Hue coordinate is described by an angle between 0 and 360 degrees, the Lightness (vertical axis) and Saturation (radial distance from the Lightness axis) with values between 0.0 and 1.0. The maximal color saturation possible depends on Lightness. Halfway from the top (L=0.5) the maximum saturation (in other words the radius of the circle) is S=1.0. The red color for instance thus has coordinates like H = 0 Degrees, L = 0.5 and S = 1.0.&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HLS.JPG|thumb|500px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HSV&#039;&#039;&#039; is an abbreviation for Hue-Saturation-Value.&lt;br /&gt;
This system is identical to HLS, just that instead of Lightness the vertical coordinate is named value&lt;br /&gt;
&lt;br /&gt;
&lt;br /&gt;
[[Image:HSV.JPG|thumb|400px|center]] &lt;br /&gt;
&lt;br /&gt;
&#039;&#039;&#039;HVC&#039;&#039;&#039; is an abreviation of Hue-Value-Chroma.&lt;br /&gt;
This is a practical color coordinate system, designed about 1900 by a physicist A. Munsell. It is based on a set of samples, whose production is carefully controlled to ensure repeatability. The samples have been selected in such a fashion that from the point of view of human vision they sample the seeable colors in equidistant fashion. It is good in cases when subjective impression of the color is asked for but less useful in case of technical systems. [Miszalok and Smolej, 2001]&lt;br /&gt;
&lt;br /&gt;
==Bibliography==&lt;br /&gt;
[Poynton, 1999] Charles Poynton, Frequently Asked Questions about Color, 30.12.1999, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorFAQ.pdf&lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
[Sahler, 2005] Sahler Office Interiors &amp;amp; Information Systems, Color Coding, Oct. 2005, http://www.sahler.com/colorcode.shtml&lt;br /&gt;
&amp;lt;br&amp;gt;&lt;br /&gt;
[Miszalok and Smolej, 2001] V. Miszalok, V. Smolej, Color Coding, 13.01.2001, http://www.miszalok.de/Lectures/L11_ColorCoding/ColorCoding_english.htm#a1&lt;br /&gt;
&lt;br /&gt;
----&lt;br /&gt;
Back to [[Teaching:TUW - UE InfoVis WS 2005/06 - Gruppe 09|Gruppe 09]]&lt;/div&gt;</summary>
		<author><name>UE-InfoVis0506 0402143</name></author>
	</entry>
</feed>