InfoVis:Wiki - User contributions [en]

Teaching talk:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2008-02-05T15:05:13Z

UE-InfoVis0708 0225966:

== Bewertung ==

'''Punkte: 21 von 25'''

'''Begründung:'''

siehe Kommentare (kursiv) bei [[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3|Aufgabe 3]]

'''''Ihr habt die Möglichkeit, die angegebenen Dinge noch bis einschließlich 15.01.2008 zu verbessern - dann wird natürlich eure Punkteanzahl aufgewertet!'''''

-- [[User:ASchratt|Alexander Schratt]] 17:31, 20 December 2007 (CEST)

'''Keine Änderungen vorgenommen. Daher bleibt es beim alten Punktestand.'''

-- [[User:ASchratt|Alexander Schratt]] 15:50, 05 February 2008 (CEST)

''Die Graphik wurde doch verbessert !''

Teaching talk:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2008-02-05T14:55:08Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 4

2008-01-04T22:04:39Z

UE-InfoVis0708 0225966:

== Aufgabenstellung ==

Aufgabe ist das Design einer interaktiven Visualisierungsapplikation zur Darstellung und Exploration (des zeitlichen Verlaufs) von Laborwerten einer Blutuntersuchung. BenutzerInnen, Einsatzzweck, Tasks, etc. sollen von Euch selbst festgelegt und beschrieben werden.

[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe4.html Beschreibung der Aufgabe 4]

=== Beispiele für derartige Datensätze ===

[[Image:20061115_blutuntersuchung.jpg]]

[[Image:20070920_blutuntersuchung.jpg]]

= ABGABE =

== Analysis of the application area ==

=== Application Area Analysis ===

Laboratory Values of blood tests should be visualized, in order to make an exploration, for a point in time as well in a chronological sequence, possible. This Application Area is highly sensible with high expectance towards accuracy. Furthermore the development of blood test results over time is of special interest. For the interpretation of the values and a diagnosis based on these values, the available reference values are of central relevance.

One special characteristic is that the results are within known ranges. The scale can therefore be adjusted towards these ranges.

=== Dataset Analysis ===
Theoretically the values of the blood tests are continuous. From a practical point of view the values will not undercut or exceed some certain borders. Therefore the data can be considered as steady and finite. The borders will be set obviously ample to be able to visualize the most unlikely values as well.

The data is two dimensional. One dimension is the value, the second dimension shows the point in time (the date of the blood test) for which this value is valid.
It has to be analyzed whether certain test results could be gathered together from a thematic point of view, in order to create structures and groups.

=== Target Group Analysis ===
The doctor needs a fast overview of the test results to be able to create a diagnosis. First and foremost the visualization should therefore help doctors to get an overview of the test results. The second target group should be patients. It should be possible to explain them in an easy way the test results.

=== Target Group Specifics ===
Doctors often lack time and are under performance pressure. To avoid misinterpretations and to support the doctor in creating a diagnosis, the doctors’ attention should be drawn to the values outside the reference range. Furthermore an overview should show whether the results are ok or not.
Patients should be able to understand easily the visualized values. It is of high importance that the patient gets support in reaching clarity in this sensible topic.

=== Well known Visualization Techniques for this area ===
Icon-based techniques would be a possible approach for visualizing this kind of data. There are some tools like the VIE-VISU-system [Horn et al., 1998] for example that use glyphs to visualize medical data. The drawback of most icon-based techniques is that they cannot visualize data that changes its values continuously over time. In most cases only specific points in time are visualized separately by one glyph. The VIE-VISU-system for example uses 24 glyphs to represent one 24-hour-cycle of measurements.
Purpose of the Visualization

The visualization should provide an overview over the blood test results both for a concrete test and in variation in time.
An outstanding task is the elevated focus on values which exceed or undercut the predefined borders. Not only these values need special attention, but as well the values near these borders should be focused in some way.
The visualization should answer questions like whether the blood values are in the normal range, whether some tendencies exist and whether one or more values should be drawn more attention to.

== Concept ==

As mentioned above, the tool is mainly intended for doctors, therefore one should be able to use it intuitively.
The information to emphasize would be :

* the change of a specific blood feature over time
* when the value of a blood feature goes outside of its reference interval

We also want to keep the table format, because of its convenience when looking up specific values [Few, 2006]. Also, our values have more than one unit of measure, which makes it useless to compare them amongst each other [Few, 2006]. A graph is used for visualizing the values of a specific blood feature over time.

=== Design ===

The design is was intentionally kept simple, not to distract the user from the main task. It only offers the most important information.

==== Header ====

All screens have a common header with the name of the patient and a time line. The time line shows the dates when blood tests were taken. The user may click on each date and the corresponding data will be shown. It is also possible to drag the time line in order to shift the view port if there are too many dates to fit on the screen.

==== Outline Screen ====

[[Image:screen1.png | 250px | Outline screen]]

The initial screen shows the data in tabular form. Values which are outside the reference interval are shown on top of the list, colored red and in alphabetical order.This makes it easy for the doctor to immediately spot dangerous values. Other values are colored green, also in alphabetical order. Upon clicking on the triangle next to a blood feature we get to the detailed screen.

==== Detailed Screen ====

[[Image:screen2.png | 250px | Detailed screen]]

This screen has a graph showing the various measurements of the selected feature over time. The area of the reference interval is colored green, everything outside of it is red. The selected value has a enlarged dot and is centered on the screen. It is also possible to use the time line to select a different date.

=== Discussion ===

One of the main goals of the design was to keep it simple, so that the user does not have to go through a manual to figure out how things work (doctors are usually not technical people). The sorted table supports the user in locating irregularities in the blood sample as fast as possible. The detailed view gives an insight about the history of selected blood feature and therewith assists in discovering recidivism. A possible improvement would be to use different shades of green/red to indicate how close a value is to the border of the reference interval. Whether or not this information would really be useful has to be discussed with a doctor.

== References ==

* [Horn et al., 1998] Werner Horn, Christian Popow, and Lukas Unterasinger. Metaphor Graphics to Visualize ICU Data over Time, In Proceedings of Intelligent Data Analysis in Medicine and Pharmacology (IDAMAP-98), Workshop Notes of the ECAI-98 Workshop, 1998.
* [Few, 2006] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Appendix A - Table and Graph Design at a Glance.
== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 4

2008-01-04T21:38:01Z

UE-InfoVis0708 0225966:

== Aufgabenstellung ==

Aufgabe ist das Design einer interaktiven Visualisierungsapplikation zur Darstellung und Exploration (des zeitlichen Verlaufs) von Laborwerten einer Blutuntersuchung. BenutzerInnen, Einsatzzweck, Tasks, etc. sollen von Euch selbst festgelegt und beschrieben werden.

[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe4.html Beschreibung der Aufgabe 4]

=== Beispiele für derartige Datensätze ===

[[Image:20061115_blutuntersuchung.jpg]]

[[Image:20070920_blutuntersuchung.jpg]]

= ABGABE =

== Analysis of the application area ==

=== Application Area Analysis ===

Laboratory Values of blood tests should be visualized, in order to make an exploration, for a point in time as well in a chronological sequence, possible. This Application Area is highly sensible with high expectance towards accuracy. Furthermore the development of blood test results over time is of special interest. For the interpretation of the values and a diagnosis based on these values, the available reference values are of central relevance.

One special characteristic is that the results are within known ranges. The scale can therefore be adjusted towards these ranges.

=== Dataset Analysis ===
Theoretically the values of the blood tests are continuous. From a practical point of view the values will not undercut or exceed some certain borders. Therefore the data can be considered as steady and finite. The borders will be set obviously ample to be able to visualize the most unlikely values as well.

The data is two dimensional. One dimension is the value, the second dimension shows the point in time (the date of the blood test) for which this value is valid.
It has to be analyzed whether certain test results could be gathered together from a thematic point of view, in order to create structures and groups.

=== Target Group Analysis ===
The doctor needs a fast overview of the test results to be able to create a diagnosis. First and foremost the visualization should therefore help doctors to get an overview of the test results. The second target group should be patients. It should be possible to explain them in an easy way the test results.

=== Target Group Specifics ===
Doctors often lack time and are under performance pressure. To avoid misinterpretations and to support the doctor in creating a diagnosis, the doctors’ attention should be drawn to the values outside the reference range. Furthermore an overview should show whether the results are ok or not.
Patients should be able to understand easily the visualized values. It is of high importance that the patient gets support in reaching clarity in this sensible topic.

=== Well known Visualization Techniques for this area ===
Icon-based techniques would be a possible approach for visualizing this kind of data. There are some tools like the VIE-VISU-system [Horn et al., 1998] for example that use glyphs to visualize medical data. The drawback of most icon-based techniques is that they cannot visualize data that changes its values continuously over time. In most cases only specific points in time are visualized separately by one glyph. The VIE-VISU-system for example uses 24 glyphs to represent one 24-hour-cycle of measurements.
Purpose of the Visualization

The visualization should provide an overview over the blood test results both for a concrete test and in variation in time.
An outstanding task is the elevated focus on values which exceed or undercut the predefined borders. Not only these values need special attention, but as well the values near these borders should be focused in some way.
The visualization should answer questions like whether the blood values are in the normal range, whether some tendencies exist and whether one or more values should be drawn more attention to.

== Concept ==

As mentioned above, the tool is mainly intended for doctors, therefore one should be able to use it intuitively.
The information to emphasize would be :

* the change of a specific blood feature over time
* when the value of a blood feature goes outside of its reference interval

We also want to keep the table format, because of its convenience when looking up specific values [Few, 2006]. Also, our values have more than one unit of measure, which makes it useless to compare them amongst each other [Few, 2006]. A graph is used for visualizing the values of a specific blood feature over time.

=== Design ===

The design is was intentionally kept simple, not to distract the user from the main task.

==== Header ====

All screens have a common header with the name of the patient and a time line. The time line shows the dates when blood tests were taken. The user may click on each date and the corresponding data will be shown.

==== Outline Screen ====

[[Image:screen1.png | 250px | Outline screen]]

The initial screen shows the data in tabular form. Values which are outside the reference interval are shown on top of the list, colored red and in alphabetical order.This makes it easy for the doctor to immediately spot dangerous values. Other values are colored green, also in alphabetical order. Upon clicking on the triangle next to a blood feature we get to the next screen.

==== Detailed Screen ====

[[Image:screen2.png | 250px | Detailed screen]]

This screen has a graph showing the various measurements of the selected feature over time. The area of the reference interval is colored green, everything outside of it is red. The selected value has a enlarged dot and is centered on the screen. It is also possible to use the time line to select a different date.

== References ==

* [Horn et al., 1998] Werner Horn, Christian Popow, and Lukas Unterasinger. Metaphor Graphics to Visualize ICU Data over Time, In Proceedings of Intelligent Data Analysis in Medicine and Pharmacology (IDAMAP-98), Workshop Notes of the ECAI-98 Workshop, 1998.
* [Few, 2006] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Appendix A - Table and Graph Design at a Glance.
== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

File:Screen2.png

2008-01-04T21:08:06Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

File:Screen1.png

2008-01-04T21:07:31Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 4

2008-01-04T16:56:02Z

UE-InfoVis0708 0225966:

== Aufgabenstellung ==

Aufgabe ist das Design einer interaktiven Visualisierungsapplikation zur Darstellung und Exploration (des zeitlichen Verlaufs) von Laborwerten einer Blutuntersuchung. BenutzerInnen, Einsatzzweck, Tasks, etc. sollen von Euch selbst festgelegt und beschrieben werden.

[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe4.html Beschreibung der Aufgabe 4]

=== Beispiele für derartige Datensätze ===

[[Image:20061115_blutuntersuchung.jpg]]

[[Image:20070920_blutuntersuchung.jpg]]

= ABGABE =

== Analysis of the application area ==

=== Application Area Analysis ===

Laboratory Values of blood tests should be visualized, in order to make an exploration, for a point in time as well in a chronological sequence, possible. This Application Area is highly sensible with high expectance towards accuracy. Furthermore the development of blood test results over time is of special interest. For the interpretation of the values and a diagnosis based on these values, the available reference values are of central relevance.

One special characteristic is that the results are within known ranges. The scale can therefore be adjusted towards these ranges.

=== Dataset Analysis ===
Theoretically the values of the blood tests are continuous. From a practical point of view the values will not undercut or exceed some certain borders. Therefore the data can be considered as steady and finite. The borders will be set obviously ample to be able to visualize the most unlikely values as well.

The data is two dimensional. One dimension is the value, the second dimension shows the point in time (the date of the blood test) for which this value is valid.
It has to be analyzed whether certain test results could be gathered together from a thematic point of view, in order to create structures and groups.

=== Target Group Analysis ===
The doctor needs a fast overview of the test results to be able to create a diagnosis. First and foremost the visualization should therefore help doctors to get an overview of the test results. The second target group should be patients. It should be possible to explain them in an easy way the test results.

=== Target Group Specifics ===
Doctors often lack time and are under performance pressure. To avoid misinterpretations and to support the doctor in creating a diagnosis, the doctors’ attention should be drawn to the values outside the reference range. Furthermore an overview should show whether the results are ok or not.
Patients should be able to understand easily the visualized values. It is of high importance that the patient gets support in reaching clarity in this sensible topic.

=== Well known Visualization Techniques for this area ===
Icon-based techniques would be a possible approach for visualizing this kind of data. There are some tools like the VIE-VISU-system [Horn et al., 1998] for example that use glyphs to visualize medical data. The drawback of most icon-based techniques is that they cannot visualize data that changes its values continuously over time. In most cases only specific points in time are visualized separately by one glyph. The VIE-VISU-system for example uses 24 glyphs to represent one 24-hour-cycle of measurements.
Purpose of the Visualization

The visualization should provide an overview over the blood test results both for a concrete test and in variation in time.
An outstanding task is the elevated focus on values which exceed or undercut the predefined borders. Not only these values need special attention, but as well the values near these borders should be focused in some way.
The visualization should answer questions like whether the blood values are in the normal range, whether some tendencies exist and whether one or more values should be drawn more attention to.

== Concept ==

As mentioned above, the tool is mainly intended for doctors, therefore one should be able to use it intuitively.
The information to emphasize would be :

* the change of a specific blood feature over time
* when the value of a blood feature goes outside of its reference interval

We also want to keep the table format, because of its convenience when looking up specific values [Few, 2006]. Also, our values have more than one unit of measure, which makes it useless to compare them amongst each other [Few, 2006]. A graph is used for visualizing the values of a specific blood feature over time.

=== Header ===

All screens have a common header with the name of the patient and a time line. The time line shows the dates when blood tests were taken. The user may click on each date and the corresponding data will be shown.

=== Screen 1 ===
The initial screen shows the data in tabular form. Values which are outside the reference interval are shown on top of the list, colored red and in alphabetical order.
This makes it easy for the doctor to immediately spot dangerous values. Other values are colored green, also in alphabetical order.
Upon clicking on the triangle next to a blood feature we get to the next screen.

=== Screen 2 ===
This screen has a graph showing the various measurements of the selected feature over time. The area of the reference interval is colored green, everything outside of it is red. The selected value has a enlarged dot and is centered on the screen. It is also possible to use the time line to select a different date.

== References ==

* [Horn et al., 1998] Werner Horn, Christian Popow, and Lukas Unterasinger. Metaphor Graphics to Visualize ICU Data over Time, In Proceedings of Intelligent Data Analysis in Medicine and Pharmacology (IDAMAP-98), Workshop Notes of the ECAI-98 Workshop, 1998.
* [Few, 2006] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Appendix A - Table and Graph Design at a Glance.
== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2007-12-08T07:33:00Z

UE-InfoVis0708 0225966:

== Poor Graphic ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe3.html Beschreibung der Aufgabe 3]

[[Image:Traeume.jpg]]

Frauen träumen sanfter

== Critics ==
=== Data-Ink Ratio ===
{{Quotation| The goal is to design a display that has the highest possible data-ink ratio (that is, as close to the total of 1.0 or 100% as possible), without eliminating something that is necessary for effective communication. |[Few Article, 2004]}}
Following this principle unnecessary non-data ink will be removed. Therefore the background picture and the unnecessary graphics will be removed. Furthermore unnecessary data ink will be removed or replaced.

In the next step the most important data should be emphasized. Since the attention of the reader should be drawn on the information that men more often dream about violence and conflicts, whereas women lead in having depressive dreams, this information should be emphasized with some special markup. For example, the bars, which having the dreams of the men ahead, could be colored with a more saturated color.

=== Visual Means to Highlight Data ===
{{Quotation| A contrasting version of any visual attribute, rendered differently from the norm — whatever the norm — demands attention. … Anything different catches our eyes and begs us to assign meaning, to understand the significance of that difference. |[Few Article, 2004]}}
As mentioned above we want to draw the reader’s attention to the difference between women and men’s dreams. As the most important data in the graphic is that men dream more about violence, this part should be emphasized. Therefore the men’s violence bars could be drawn with a darker color.

=== Background ===
{{Quotation| Non-data ink, consistent with its supporting role, should stand out just enough from the background to serve its purpose but not so much that it draws attention. This can be achieved through the use of thin lines and soft, neutral colors (e.g. light gray). | [Few, 2004]}}
Following this rule, all the background pictures should be erased, and replaced with some background that does not draw much attention, but serves the purpose of a background.

=== Emphasize the most important data ink ===
{{Quotation| Regardless of the encoding method, certain visual attributes of objects, words, and numbers stand out more than others.| [Few, 2004]}}
Hue, Enclosure, Size, Line width and more are attributes which can be used to emphasize the most important data ink. The most important data in our graphic is the relationship between men and women´s dreams. So this part of the graphic should be emphasized.

{{Quotation| Your message may require multiple tables, multiple graphs, or a combination of both, along with additional text in the form of bullet points, sentences, or even whole paragraphs. When you arrange this information on the page or screen, you must do so consciously to tell a story. What should I say first? What should I save for last? … The answers to these questions take on the form of visual attributes designed to accomplish the following:
* Group the data (i.e., segment the data into meaningful subsets)
* Prioritize the data (i.e., rank the data by importance)
* Sequence the data (i.e., give direction for the order in which the data
.| [Few, 2004]}}
Since we want to draw the attention to the data which shows the violence data, the order of the data could be changed. That the reader begins at the left, subsequently follows the graph to the right and that his look at the graphic ends with a ‘wow’ effect.

=== Prioritize the Data ===
{{Quotation| Whenever you communicate quantitative information, it is imperative that you step back from it and ask yourself, “What are the important numbers here?” Once you´ve established a clear sense of what´s important, you should make that information stand out clearly from the rest.| [Few, 2004]}}
As mentioned already we want to draw the reader’s attention to the violence dreams. But the data shows as well the interesting point that depressive dreams are underrepresented, at least concerning this survey, in dreams.
There are some ways to prioritize the data. For this example we think it is useful to concentrate on the hue or a lesser saturation of the depressive bar color.

=== Sequence the Data ===
The contents of a graphic should be clearly divided into columns, since readers will first scan the left-most column from top-to-bottom, then move to the top of the next column [Few, 2004]. Therefore the 3-dimensional view of the bar chart in the given grapic is unnecessary and even obstructive for the viewer. It should be replaced by a normal 2-dimensional bar chartwith proper labeling.

=== Text ===
Most of the text in the given graphic satisfies the rules of [Few, 2007]. The labeling of the bars is ok accept that the "%"-sign should be put directly next to the values of each bar. Furthermore the color of the "male"-bar hasn't been chosen very well since it has not enough contrast to the background. The title of the graphic could be improved also. It doesnt give very much information about the contains of the grapic. "Häufigkeit von Träumen nach Geschlecht" would be a more informative title for example.

==Revised Graphic==
[[Image:traum.png]]

==Improvements==

The following changes were made to fix the issues criticized in previous sections:

* The title was changed. It now gives a more accurate description of the graphic.
* Unessential and partially disturbing background graphics was removed. The overall image is now much clearer and more readable.
* The labeling was improved. Unit of the values is now immediately clear.
* Switched the model from 3D to 2D. Now the graphic can be read off more accurately.
* Changed the coloring to be distinguishable and still easily readable.
* Added grid and axis for better orientation.

== References ==

[Few Article, 2004] Stephen Few, Elegance Through Simplicity, Article about redesigning graphs, http://www.intelligententerprise.com/showArticle.jhtml;jsessionid=N2ATDQWY5VYKSQSNDBGCKHSCJUMEKJVN?articleID=49400920, accessed 29.11.2007.

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 7 - General Design for Communication.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2007-12-07T22:27:13Z

UE-InfoVis0708 0225966:

== Poor Graphic ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe3.html Beschreibung der Aufgabe 3]

[[Image:Traeume.jpg]]

Frauen träumen sanfter

== Critics ==
=== Data-Ink Ratio ===
{{Quotation| The goal is to design a display that has the highest possible data-ink ratio (that is, as close to the total of 1.0 or 100% as possible), without eliminating something that is necessary for effective communication. |[Few Article, 2004]}}
Following this principle unnecessary non-data ink will be removed. Therefore the background picture and the unnecessary graphics will be removed. Furthermore unnecessary data ink will be removed or replaced.

In the next step the most important data should be emphasized. Since the attention of the reader should be drawn on the information that men more often dream about violence and conflicts, whereas women lead in having depressive dreams, this information should be emphasized with some special markup. For example, the bars, which having the dreams of the men ahead, could be colored with a more saturated color.

=== Visual Means to Highlight Data ===
{{Quotation| A contrasting version of any visual attribute, rendered differently from the norm — whatever the norm — demands attention. … Anything different catches our eyes and begs us to assign meaning, to understand the significance of that difference. |[Few Article, 2004]}}
As mentioned above we want to draw the reader’s attention to the difference between women and men’s dreams. As the most important data in the graphic is that men dream more about violence, this part should be emphasized. Therefore the men’s violence bars could be drawn with a darker color.

=== Background ===
{{Quotation| Non-data ink, consistent with its supporting role, should stand out just enough from the background to serve its purpose but not so much that it draws attention. This can be achieved through the use of thin lines and soft, neutral colors (e.g. light gray). | [Few, 2004]}}
Following this rule, all the background pictures should be erased, and replaced with some background that does not draw much attention, but serves the purpose of a background.

=== Emphasize the most important data ink ===
{{Quotation| Regardless of the encoding method, certain visual attributes of objects, words, and numbers stand out more than others.| [Few, 2004]}}
Hue, Enclosure, Size, Line width and more are attributes which can be used to emphasize the most important data ink. The most important data in our graphic is the relationship between men and women´s dreams. So this part of the graphic should be emphasized.

{{Quotation| Your message may require multiple tables, multiple graphs, or a combination of both, along with additional text in the form of bullet points, sentences, or even whole paragraphs. When you arrange this information on the page or screen, you must do so consciously to tell a story. What should I say first? What should I save for last? … The answers to these questions take on the form of visual attributes designed to accomplish the following:
* Group the data (i.e., segment the data into meaningful subsets)
* Prioritize the data (i.e., rank the data by importance)
* Sequence the data (i.e., give direction for the order in which the data
.| [Few, 2004]}}
Since we want to draw the attention to the data which shows the violence data, the order of the data could be changed. That the reader begins at the left, subsequently follows the graph to the right and that his look at the graphic ends with a ‘wow’ effect.

=== Prioritize the Data ===
{{Quotation| Whenever you communicate quantitative information, it is imperative that you step back from it and ask yourself, “What are the important numbers here?” Once you´ve established a clear sense of what´s important, you should make that information stand out clearly from the rest.| [Few, 2004]}}
As mentioned already we want to draw the reader’s attention to the violence dreams. But the data shows as well the interesting point that depressive dreams are underrepresented, at least concerning this survey, in dreams.
There are some ways to prioritize the data. For this example we think it is useful to concentrate on the hue or a lesser saturation of the depressive bar color.

=== Sequence the Data ===
The contents of a graphic should be clearly divided into columns, since readers will first scan the left-most column from top-to-bottom, then move to the top of the next column [Few, 2004]. Therefore the 3-dimensional view of the bar chart in the given grapic is unnecessary and even obstructive for the viewer. It should be replaced by a normal 2-dimensional bar chartwith proper labeling.

=== Text ===
Most of the text in the given graphic satisfies the rules of [Few, 2007]. The labeling of the bars is ok accept that the "%"-sign should be put directly next to the values of each bar. Furthermore the color of the "male"-bar hasn't been chosen very well since it has not enough contrast to the background. The title of the graphic could be improved also. It doesnt give very much information about the contains of the grapic. "Häufigkeit bestimmter Träume bei Frauen und Männern" would be a more informative title for example.

==Revised Graphic==
[[Image:traum.png]]

==Improvements==

The following changes were made to fix the issues criticized in previous sections:

* The title was changed. It now gives a more accurate description of the graphic.
* Unessential and partially disturbing background graphics was removed. The overall image is now much clearer and more readable.
* The labeling was improved. Unit of the values is now immediately clear.
* Switched the model from 3D to 2D. Now the graphic can be read off more accurately.
* Changed the coloring to be distinguishable and still easily readable.
* Added grid and axis for better orientation.

== References ==

[Few Article, 2004] Stephen Few, Elegance Through Simplicity, Article about redesigning graphs, http://www.intelligententerprise.com/showArticle.jhtml;jsessionid=N2ATDQWY5VYKSQSNDBGCKHSCJUMEKJVN?articleID=49400920, accessed 29.11.2007.

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 7 - General Design for Communication.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2007-12-07T15:53:26Z

UE-InfoVis0708 0225966:

== Poor Graphic ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe3.html Beschreibung der Aufgabe 3]

[[Image:Traeume.jpg]]

Frauen träumen sanfter

== Critics ==
=== Data-Ink Ratio ===
{{Quotation| The goal is to design a display that has the highest possible data-ink ratio (that is, as close to the total of 1.0 or 100% as possible), without eliminating something that is necessary for effective communication. |[Few Article, 2004]}}
Following this principle unnecessary non-data ink will be removed. Therefore the background picture and the unnecessary graphics will be removed. Furthermore unnecessary data ink will be removed or replaced.

In the next step the most important data should be emphasized. Since the attention of the reader should be drawn on the information that men more often dream about violence and conflicts, whereas women lead in having depressive dreams, this information should be emphasized with some special markup. For example, the bars, which having the dreams of the men ahead, could be colored with a more saturated color.

=== Visual Means to Highlight Data ===
{{Quotation| A contrasting version of any visual attribute, rendered differently from the norm — whatever the norm — demands attention. … Anything different catches our eyes and begs us to assign meaning, to understand the significance of that difference. |[Few Article, 2004]}}
As mentioned above we want to draw the reader’s attention to the difference between women and men’s dreams. As the most important data in the graphic is that men dream more about violence, this part should be emphasized. Therefore the men’s violence bars could be drawn with a darker color.

=== Background ===
{{Quotation| Non-data ink, consistent with its supporting role, should stand out just enough from the background to serve its purpose but not so much that it draws attention. This can be achieved through the use of thin lines and soft, neutral colors (e.g. light gray). | [Few, 2004]}}
Following this rule, all the background pictures should be erased, and replaced with some background that does not draw much attention, but serves the purpose of a background.

=== Emphasize the most important data ink ===
{{Quotation| Regardless of the encoding method, certain visual attributes of objects, words, and numbers stand out more than others.| [Few, 2004]}}
Hue, Enclosure, Size, Line width and more are attributes which can be used to emphasize the most important data ink. The most important data in our graphic is the relationship between men and women´s dreams. So this part of the graphic should be emphasized.

{{Quotation| Your message may require multiple tables, multiple graphs, or a combination of both, along with additional text in the form of bullet points, sentences, or even whole paragraphs. When you arrange this information on the page or screen, you must do so consciously to tell a story. What should I say first? What should I save for last? … The answers to these questions take on the form of visual attributes designed to accomplish the following:
* Group the data (i.e., segment the data into meaningful subsets)
* Prioritize the data (i.e., rank the data by importance)
* Sequence the data (i.e., give direction for the order in which the data
.| [Few, 2004]}}
Since we want to draw the attention to the data which shows the violence data, the order of the data could be changed. That the reader begins at the left, subsequently follows the graph to the right and that his look at the graphic ends with a ‘wow’ effect.

=== Prioritize the Data ===
{{Quotation| Whenever you communicate quantitative information, it is imperative that you step back from it and ask yourself, “What are the important numbers here?” Once you´ve established a clear sense of what´s important, you should make that information stand out clearly from the rest.| [Few, 2004]}}
As mentioned already we want to draw the reader’s attention to the violence dreams. But the data shows as well the interesting point that depressive dreams are underrepresented, at least concerning this survey, in dreams.
There are some ways to prioritize the data. For this example we think it is useful to concentrate on the hue or a lesser saturation of the depressive bar color.

=== Sequence the Data ===
The contents of a graphic should be clearly divided into columns, since readers will first scan the left-most column from top-to-bottom, then move to the top of the next column [Few, 2004]. Therefore the 3-dimensional view of the bar chart in the given grapic is unnecessary and even obstructive for the viewer. It should be replaced by a normal 2-dimensional bar chartwith proper labeling.

=== Text ===
Most of the text in the given graphic satisfies the rules of [Few, 2007]. The labeling of the bars is ok accept that the "%"-sign should be put directly next to the values of each bar. Furthermore the color of the "male"-bar hasn't been chosen very well since it has not enough contrast to the background. The title of the graphic could be improved also. It doesnt give very much information about the contains of the grapic. "Häufigkeit bestimmter Träume bei Frauen und Männern" would be a more informative title for example.

==Revised Graphic==
[[Image:traum.png]]

==Improvements==

The following changes were made to fix the issues criticized in previous sections:

* The title was changed. It now gives a more accurate description of the graphic.
* Unessential and partially disturbing background graphics was removed. The overall image is now much clearer and more readable.
* The labeling was improved. Unit of the values is now immediately clear.
* Switched the model from 3D to 2D. Now the graphic can be read off more accurately.
* Changed the coloring to be distinguishable and still easily readable.

== References ==

[Few Article, 2004] Stephen Few, Elegance Through Simplicity, Article about redesigning graphs, http://www.intelligententerprise.com/showArticle.jhtml;jsessionid=N2ATDQWY5VYKSQSNDBGCKHSCJUMEKJVN?articleID=49400920, accessed 29.11.2007.

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 7 - General Design for Communication.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3

2007-12-07T15:07:18Z

UE-InfoVis0708 0225966:

== Poor Graphic ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe3.html Beschreibung der Aufgabe 3]

[[Image:Traeume.jpg]]

Frauen träumen sanfter

== Critics ==
=== Data-Ink Ratio ===
{{Quotation| The goal is to design a display that has the highest possible data-ink ratio (that is, as close to the total of 1.0 or 100% as possible), without eliminating something that is necessary for effective communication. |[Few Article, 2004]}}
Following this principle unnecessary non-data ink will be removed. Therefore the background picture and the unnecessary graphics will be removed. Furthermore unnecessary data ink will be removed or replaced.

In the next step the most important data should be emphasized. Since the attention of the reader should be drawn on the information that men more often dream about violence and conflicts, whereas women lead in having depressive dreams, this information should be emphasized with some special markup. For example, the bars, which having the dreams of the men ahead, could be colored with a more saturated color.

=== Visual Means to Highlight Data ===
{{Quotation| A contrasting version of any visual attribute, rendered differently from the norm — whatever the norm — demands attention. … Anything different catches our eyes and begs us to assign meaning, to understand the significance of that difference. |[Few Article, 2004]}}
As mentioned above we want to draw the reader’s attention to the difference between women and men’s dreams. As the most important data in the graphic is that men dream more about violence, this part should be emphasized. Therefore the men’s violence bars could be drawn with a darker color.

=== Background ===
{{Quotation| Non-data ink, consistent with its supporting role, should stand out just enough from the background to serve its purpose but not so much that it draws attention. This can be achieved through the use of thin lines and soft, neutral colors (e.g. light gray). | [Few, 2004]}}
Following this rule, all the background pictures should be erased, and replaced with some background that does not draw much attention, but serves the purpose of a background.

=== Emphasize the most important data ink ===
{{Quotation| Regardless of the encoding method, certain visual attributes of objects, words, and numbers stand out more than others.| [Few, 2004]}}
Hue, Enclosure, Size, Line width and more are attributes which can be used to emphasize the most important data ink. The most important data in our graphic is the relationship between men and women´s dreams. So this part of the graphic should be emphasized.

{{Quotation| Your message may require multiple tables, multiple graphs, or a combination of both, along with additional text in the form of bullet points, sentences, or even whole paragraphs. When you arrange this information on the page or screen, you must do so consciously to tell a story. What should I say first? What should I save for last? … The answers to these questions take on the form of visual attributes designed to accomplish the following:
* Group the data (i.e., segment the data into meaningful subsets)
* Prioritize the data (i.e., rank the data by importance)
* Sequence the data (i.e., give direction for the order in which the data
.| [Few, 2004]}}
Since we want to draw the attention to the data which shows the violence data, the order of the data could be changed. That the reader begins at the left, subsequently follows the graph to the right and that his look at the graphic ends with a ‘wow’ effect.

=== Prioritize the Data ===
{{Quotation| Whenever you communicate quantitative information, it is imperative that you step back from it and ask yourself, “What are the important numbers here?” Once you´ve established a clear sense of what´s important, you should make that information stand out clearly from the rest.| [Few, 2004]}}
As mentioned already we want to draw the reader’s attention to the violence dreams. But the data shows as well the interesting point that depressive dreams are underrepresented, at least concerning this survey, in dreams.
There are some ways to prioritize the data. For this example we think it is useful to concentrate on the hue or a lesser saturation of the depressive bar color.

=== Sequence the Data ===
The contents of a graphic should be clearly divided into columns, since readers will first scan the left-most column from top-to-bottom, then move to the top of the next column [Few, 2004]. Therefore the 3-dimensional view of the bar chart in the given grapic is unnecessary and even obstructive for the viewer. It should be replaced by a normal 2-dimensional bar chartwith proper labeling.

=== Text ===
Most of the text in the given graphic satisfies the rules of [Few, 2007]. The labeling of the bars is ok accept that the "%"-sign should be put directly next to the values of each bar. Furthermore the color of the "male"-bar hasn't been chosen very well since it has not enough contrast to the background. The title of the graphic could be improved also. It doesnt give very much information about the contains of the grapic. "Häufigkeit bestimmter Träume bei Frauen und Männern" would be a more informative title for example.

==Revised Graphics==
[[Image:traum.png]]

== References ==

[Few Article, 2004] Stephen Few, Elegance Through Simplicity, Article about redesigning graphs, http://www.intelligententerprise.com/showArticle.jhtml;jsessionid=N2ATDQWY5VYKSQSNDBGCKHSCJUMEKJVN?articleID=49400920, accessed 29.11.2007.

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 7 - General Design for Communication.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

File:Traum.png

2007-12-07T14:52:47Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

File:Whirlwind.jpg

2007-11-24T19:33:27Z

UE-InfoVis0708 0225966:

== Summary ==
Image of whirlwind display
== Copyright status ==

== Source ==
[Carlsson, 2006] Author Unknown, W. Carlson, A Critical History of Computer Graphics and Animation, Retrieved at: November 8, 2007. http://design.osu.edu/carlson/history/lesson2.html

File:Pov ray.png

2007-11-24T19:19:09Z

UE-InfoVis0708 0225966:

== Summary ==
An image created by using POV-Ray 3.6.
== Copyright status ==
Public domain
== Source ==
[Tran, 2006] G. Tran, English Wikipedia project, Retrieved at: November 8, http://commons.wikimedia.org/wiki/Image:Glasses_800_edit.png

File:Pov ray.png

2007-11-24T19:18:18Z

UE-InfoVis0708 0225966:

== Summary ==
An image created by using POV-Ray 3.6.
== Copyright status ==
Public domain
== Source ==
[Tran, 2005] G. Tran, English Wikipedia project, Retrieved at: November 8, http://commons.wikimedia.org/wiki/Image:Glasses_800_edit.png

File:Utah teapot.png

2007-11-24T19:15:08Z

UE-InfoVis0708 0225966:

== Summary ==
 
The Utah teapot.
== Copyright status ==
 
This image has been released into the public domain by its author, Finlay McWalter at the English Wikipedia project.
== Source ==
 
[McWalter, 2005] Finlay McWalter, English Wikipedia project, Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Image:Utah_teapot.png

File:Utah teapot.png

2007-11-24T19:13:47Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-24T18:57:19Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Goodchild, 2007]}}

==Subfields==
 
Computer Graphics may be divided into four major categories:
===Geometry===
The subfield of Geometry studies ways to represent and process surfaces. Boundary representations are most commonly used, because the appearance of an object depends mainly on its exterior. Although point-based representations have been getting more and more popular lately, polygonal meshes are still the most popular form of discrete digital approximation of surfaces. These representations are Lagrangian (the spatial locations of the samples are independent) as opposed to Eulerian surface descriptions (i.e., where spatial samples are fixed) which are mainly used for deforming surfaces which undergo many topological changes (e.g. fluids). A subfield of Geometry called Imaging studies the process of image acquisition and image editing.

===Animation===
This subfield of Geometry studies ways to represent and manipulate motion. Historically most interest has been focused on parametric and data-driven models, but in recent years physical simulation has experienced a renaissance due to the growing computational capacity of modern machines.
===Rendering===
This subfield of Geometry studies algorithms to reproduce light transport. It does so by converting a model into an image by simulating light transport to get physically-based photorealistic images, or by applying a style as in non-photorealistic rendering. Two basic operations in realistic rendering are transport (how much light gets from one place to another) and scattering (how surfaces interact with light).

==History==
 
[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
[[Image:Pov_ray.png|thumb|300px|Glasses (created by using POV-Ray 3.6).]]
 
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database] 
[http://www.siggraph.org/ ACM SIGGRAPH]
==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Goodchild, 2007] T. Goodchild, Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-24T18:31:29Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Wikipedia, 2007]}}

==Subfields==
 
Computer Graphics may be divided into four major categories:
===Geometry===
The subfield of Geometry studies ways to represent and process surfaces. Boundary representations are most commonly used, because the appearance of an object depends mainly on its exterior. Although point-based representations have been getting more and more popular lately, polygonal meshes are still the most popular form of discrete digital approximation of surfaces. These representations are Lagrangian (the spatial locations of the samples are independent) as opposed to Eulerian surface descriptions (i.e., where spatial samples are fixed) which are mainly used for deforming surfaces which undergo many topological changes (e.g. fluids). A subfield of Geometry called Imaging studies the process of image acquisition and image editing.

===Animation===
This subfield of Geometry studies ways to represent and manipulate motion. Historically most interest has been focused on parametric and data-driven models, but in recent years physical simulation has experienced a renaissance due to the growing computational capacity of modern machines.
===Rendering===
This subfield of Geometry studies algorithms to reproduce light transport. It does so by converting a model into an image by simulating light transport to get physically-based photorealistic images, or by applying a style as in non-photorealistic rendering. Two basic operations in realistic rendering are transport (how much light gets from one place to another) and scattering (how surfaces interact with light).

==History==
 
[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
[[Image:Pov_ray.png|thumb|300px|Glasses (created by using POV-Ray 3.6).]]
 
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database] 
[http://www.siggraph.org/ ACM SIGGRAPH]
==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 2

2007-11-21T13:30:42Z

UE-InfoVis0708 0225966:

== Aufgabenstellung ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe2.html Beschreibung der Aufgabe 2]

=== Zu beurteilende Tabelle ===

[[Image:tufte_2006_beautiful-evidence_funds.jpg]]

== Critics ==
=== Structural Components of Tables ===
{{Definition|Thoughtfully designed Data and Structural Components lead to clear and efficient communication.}}

{{Quotation|Tables generally work best when they also contain additional text that is used to complement the categorical subdivisions and quantitative values in various ways. In Chapter 7, General Design for Communication, we noted that additional text can do the following:
* Label
* Introduce
* Explain
* Reinforce
* Highlight
* Sequence
* Recommend
* Inquire
|[Few, 2004]}}

The table tries to explain its data with some text.

The title of the table should be clearly seperated from the table and maybe regrouped in a title and a sub title.

It states labels for the ASSETS and the FUND columns. These column headers label the information below them and should be separated from the data with a horizontal line.

The return values are clearly grouped with the spanner header RETURN. Maybe it should be stated that this is the return on investment.
Below the RETURN spanner header we find column headers which state the period for which the data is valid. These should be separated from the data with a horizontal line. Furthermore it is not absolutely clear what there meaning is, and the mixing of so different periods makes it more difficult to understand the table. For example it would be interesting which 3 year period the 3-YR column covers.

The dollar and percent signs should not be introduced at the first data line. Data definitions should be part of the column headers.

The table does not try to focus my interest to a special area, because no area is specially highlighted.

=== Delineating columns and rows ===
{{Quotation|The design process involves several decisions regarding the layout of columns and rows to provide a structure that is easy and efficient to read and understand. Readers should be able to scan quickly through the content to find what they need and perhaps make localized comparisons of related numbers. |[Few, 2004]}}
{{Definition|Columns and rows are delineated through
* White space
* Rules and grids
* Fill color
.}}

==== White space ====

{{Quotation|White space is the preferred means for arraning data into columns and rows. |[Few, 2004]}}

It is not possible to read the rows without difficulty because the vertical white space between them is pretty small. Therefore it is recommended that the vertical white space between the rows is increased.

As well the horizontal white space between the columns should be increased to ease the reading of the columns. From my point of view, the comparison of the funds is the most interesting information in this table. To lead the reader to scan down the columns, it is advisable to pronounce the white space between the columns more than the one between the rows.

To make a clear distinction between row headers and data, the horizontal white space should be increased between these two parts. As well the horizontal white space between the ASSETS and FUND column should be increased a bit to make a clear distinction.

==== Rules and grids ====

{{Quotation|Despite the uselessness of grids and the limited usefulness of rules to delineate columns and rows in tables, they are sometimes useful for grouping or highlighting subsets of data. |[Few, 2004]}}

In order to make the table more readable it is advisable to draw a line between the column headers and the data.

If the table is in its original context surrounded with some objects where there should be a clear distinction, thin lines could be drawn on each side. Remember to keep the lines as thin and light as possible.

A combination of horizontal and vertical rules could be used if there is an area of special interest.

==== Fill color ====

{{Quotation|When white space alone can´t be used to effectively delineate columns and rows in tables, fill shades and hues work better than grids and rules. |[Few, 2004]}}

Following this quotation the rows of the table could be separated with fill shades. It would also be possible to delineate the headers in the table as separate groups of information in using fill colors.

=== Arranging data ===

==== Columns or rows ====

{{Quotation|Some sequential relationships are more easily understood when they are arranged in a particular way, either horizontally from left to right or vertically from top to bottom. … We naturally think of time as moving from left to right, rather than down from top to bottom. |[Few, 2004]}}

Concerning the ranking relationships the table shows an easy to understand top-down ranking of funds regarding their assets in million dollars.

The time is illustrated from left to right, but the relations between the columns are not clear at all.

==== Groups and breaks ====
{{Quotation|It is often appropriate, and perhaps even necessary, to break sets of data into smaller groups. |[Few, 2004]}}

Since the changing time scale of the table is confusing, I would suggest to group the data for a given time scale.

For example make a table for the year 2003 till 2007. Or make a table showing the quarters in the year 2003. Everything is possible, but it should be consistent.

==== Columns sequence ====

{{Quotation|Columns containing sets of quantitative values that you want your readers to compare easily should be placed as close to one another as possible. |[Few, 2004]}}

Following this principle the table puts the values near together which should be easily comparable.

The table shows the returns in percentage and the reader can easily compare the percentages.

==== Data sequence ====

{{Quotation|When you need to sequence numbers, their quantitative order, either ascending or descending, is the only useful way to sequence them. |[Few, 2004]}}

The funds are listed descending concerning their assets. Since the asset of a fund is one of the most important characteristics and the assets are listed in numbers, it is useful to list the funds in their quantitative order.

=== Formatting text ===

==== Orientation ====
{{Quotation|As speakers of English, we are accustomed to reading language from left to right, arranged horizontally. |[Few, 2004]}}
The orientation of all text in the given table is optimal.

==== Alignment ====
In most cases convetions are used to determine the alignment of text. Few explains three of them as follows:
{{Quotation|
* Numbers that represent quantitative values, as opposed to those that are merely identifiers (e.g., customer numbers), should always be aligned to the right.
* Dates are best aligned to the left, using a format that keeps the number of characters in each portion of the date (i.e., month, day, and year) constant.
* Text that expresses neither numbers nor dates works best when aligned to the left. |[Few, 2004]}}
The given table satisfies the first rule. All numbers that represent quantitive values are aligned to the right, namely the columns 'ASSETS' and 'RETURN'. Also the thrid rule is satisfied since the text in the 'FUND' column is aligned to the left.

==== Number and date format ====
{{Quotation|
* Numbers include no unnecessary information (e.g., excessive levels of precision)
* They express the data using the format that is most familiar to its readers. |[Few, 2004]}}
The number format of the given table is very good. There is a comma to the left of the first three whole-number digits in the 'ASSETS' column. Also in the 'RETURN' column alls positive and negative values are tagged by a + or a - sign.
But there is a small shortcoming: The % and $ sign is only shown once in every column. This should be placed immediately next to every dollar or percentage value.

==== Number and date precision ====
{{Quotation|The level of precision should not exceed the level needed to server your communication objectives and the needs of your readers. |[Few, 2004]}}
The level of precision in the 'ASSETS' column is a little bit too high. The first two digits do not communicate very important information. When talking about 20- to 70-thousand dollars, fifty dollars more less don't make a noteworthy difference.

==== Fonts ====
==== Emphasis ====

=== Summarizing values ===
{{Quotation|Summary values give your readers an overview in a single glance, and if they wish, they can then dig into the detailed values.
This is a very powerful path to understanding, moving from general to specific, macroscopic to microscopic, summary to detail.|[Few, 2004]}}

This table currently does not contain any summarizing values.

==== Column summary values ====
{{Quotation|A value that aggregates an entire column of values is a column summary, which generally appears in a separate row beneath the last row of detailed values.|[Few, 2004]}}

For each column under the 'RETURN' spanner header it could be useful to provide the median of gain/loss values. It is unclear though, whether this information is desirable at all (due to lack of domain knowledge).

==== Row summary values ====
{{Quotation|A value that aggregates an entire row of values is a row summary, which generally appears in a separate column to the right of the last column of detailed values.|[Few, 2004]}}

The detailed values in columns beneath the 'RETURN' spanner header seem to be cumulative across a row (Assumption based on the cryptic column titles). That is why there doesn't seem to be much sense in providing a separate summary values for each row (i.e for each fund).
==== Group summary values ====
{{Quotation|Group summary values [..] summarize meaningful subsets of values rather than the entire
set of values throughout the column or row.|[Few, 2004]}}

Given only the information provided in the table, there is no plausible grouping possible. The only possible grouping, using only the provided data, would be one by intervals of assets (in Millions of Dollars) or gain/loss percentage intervals. However (possibly due to our lack of domain knowledge) these groupings don't seem reasonable.
==== Header versus footers ====
{{Quotation|When the summary values are more important to your message or to your readers than the details, and placing them below the details would make them
harder and less efficient to find, it often makes sense to place them in headers even though this is less conventional.|[Few, 2004]}}

In our case the summary values denote complementary information, therefore their position in the footer seems appropriate.
=== Page information ===
{{Quotation|Because of short-term memory constraints, effective table design requires that certain information be repeated on each new page. Otherwise, your readers may lose track of information that they need to interpret the table as they move from page to page. |[Few, 2004]}}

Our table is not split into multiple pages, therefore this aspect is not applicable here.
==== Repeated column headers ====
{{Quotation|When tables extend onto multiple pages, the columns are no longer labeled after the first page unless you repeat the column headers on each.|[Few, 2004]}}

The proper way of handling tables spreading across multiple pages would be to copy the table headers on top of each page. However, in our case this is not necessary.
==== Repeated row headers ====
{{Quotation|[...] even those of us who are careful to repeat column headers on each page seldom think to repeat the row headers as well, yet the problem is the same.|[Few, 2004]}}

This principle is applicable when multiple rows, which spread across multiple pages, are grouped together and have one title column where the title printed only for the first row of the group. The correct way of designing such a table would be to re-print the title on the first row on each page. Again, this is of no concern to our table here.
== References ==

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 8 - Table Design.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 2

2007-11-20T13:36:29Z

UE-InfoVis0708 0225966:

== Aufgabenstellung ==
[http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/infovis_ue_aufgabe2.html Beschreibung der Aufgabe 2]

=== Zu beurteilende Tabelle ===

[[Image:tufte_2006_beautiful-evidence_funds.jpg]]

== Critics ==
=== Structural Components of Tables ===
{{Definition|Thoughtfully designed Data and Structural Components lead to clear and efficient communication.}}

{{Quotation|Tables generally work best when they also contain additional text that is used to complement the categorical subdivisions and quantitative values in various ways. In Chapter 7, General Design for Communication, we noted that additional text can do the following:
* Label
* Introduce
* Explain
* Reinforce
* Highlight
* Sequence
* Recommend
* Inquire
|[Few, 2004]}}

The table tries to explain its data with some text.

The title of the table should be clearly seperated from the table and maybe regrouped in a title and a sub title.

It states labels for the ASSETS and the FUND columns. These column headers label the information below them and should be separated from the data with a horizontal line.

The return values are clearly grouped with the spanner header RETURN. Maybe it should be stated that this is the return on investment.
Below the RETURN spanner header we find column headers which state the period for which the data is valid. These should be separated from the data with a horizontal line. Furthermore it is not absolutely clear what there meaning is, and the mixing of so different periods makes it more difficult to understand the table. For example it would be interesting which 3 year period the 3-YR column covers.

The dollar and percent signs should not be introduced at the first data line. Data definitions should be part of the column headers.

The table does not try to focus my interest to a special area, because no area is specially highlighted.

=== Delineating columns and rows ===
{{Quotation|The design process involves several decisions regarding the layout of columns and rows to provide a structure that is easy and efficient to read and understand. Readers should be able to scan quickly through the content to find what they need and perhaps make localized comparisons of related numbers. |[Few, 2004]}}
{{Definition|Columns and rows are delineated through
* White space
* Rules and grids
* Fill color
.}}

==== White space ====

{{Quotation|White space is the preferred means for arraning data into columns and rows. |[Few, 2004]}}

It is not possible to read the rows without difficulty because the vertical white space between them is pretty small. Therefore it is recommended that the vertical white space between the rows is increased.

As well the horizontal white space between the columns should be increased to ease the reading of the columns. From my point of view, the comparison of the funds is the most interesting information in this table. To lead the reader to scan down the columns, it is advisable to pronounce the white space between the columns more than the one between the rows.

To make a clear distinction between row headers and data, the horizontal white space should be increased between these two parts. As well the horizontal white space between the ASSETS and FUND column should be increased a bit to make a clear distinction.

==== Rules and grids ====

{{Quotation|Despite the uselessness of grids and the limited usefulness of rules to delineate columns and rows in tables, they are sometimes useful for grouping or highlighting subsets of data. |[Few, 2004]}}

In order to make the table more readable it is advisable to draw a line between the column headers and the data.

If the table is in its original context surrounded with some objects where there should be a clear distinction, thin lines could be drawn on each side. Remember to keep the lines as thin and light as possible.

A combination of horizontal and vertical rules could be used if there is an area of special interest.

==== Fill color ====

{{Quotation|When white space alone can´t be used to effectively delineate columns and rows in tables, fill shades and hues work better than grids and rules. |[Few, 2004]}}

Following this quotation the rows of the table could be separated with fill shades. It would also be possible to delineate the headers in the table as separate groups of information in using fill colors.

=== Arranging data ===

==== Columns or rows ====

{{Quotation|Some sequential relationships are more easily understood when they are arranged in a particular way, either horizontally from left to right or vertically from top to bottom. … We naturally think of time as moving from left to right, rather than down from top to bottom. |[Few, 2004]}}

Concerning the ranking relationships the table shows an easy to understand top-down ranking of funds regarding their assets in million dollars.

The time is illustrated from left to right, but the relations between the columns are not clear at all.

==== Groups and breaks ====
{{Quotation|It is often appropriate, and perhaps even necessary, to break sets of data into smaller groups. |[Few, 2004]}}

Since the changing time scale of the table is confusing, I would suggest to group the data for a given time scale.

For example make a table for the year 2003 till 2007. Or make a table showing the quarters in the year 2003. Everything is possible, but it should be consistent.

==== Columns sequence ====

{{Quotation|Columns containing sets of quantitative values that you want your readers to compare easily should be placed as close to one another as possible. |[Few, 2004]}}

Following this principle the table puts the values near together which should be easily comparable.

The table shows the returns in percentage and the reader can easily compare the percentages.

==== Data sequence ====

{{Quotation|When you need to sequence numbers, their quantitative order, either ascending or descending, is the only useful way to sequence them. |[Few, 2004]}}

The funds are listed descending concerning their assets. Since the asset of a fund is one of the most important characteristics and the assets are listed in numbers, it is useful to list the funds in their quantitative order.

=== Formatting text ===
==== Orientation ====
==== Alignment ====
==== Number and date format ====
==== Number and date precision ====
==== Fonts ====
==== Emphasis ====

=== Summarizing values ===
{{Quotation|Summary values give your readers an overview in a single glance, and if they wish, they can then dig into the detailed values.
This is a very powerful path to understanding, moving from general to specific, macroscopic to microscopic, summary to detail.|[Few, 2004]}}

This table currently does not contain any summarizing values.

==== Column summary values ====
{{Quotation|A value that aggregates an entire column of values is a column summary, which generally appears in a separate row beneath the last row of detailed values.|[Few, 2004]}}

For each column under the 'RETURN' spanner header it could be useful to provide an average gain/loss summary in per cent. It is unclear though, whether this information is desirable at all (due to lack of domain knowledge).

==== Row summary values ====
{{Quotation|A value that aggregates an entire row of values is a row summary, which generally appears in a separate column to the right of the last column of detailed values.|[Few, 2004]}}

The detailed values in columns beneath the 'RETURN' spanner header seem to be cumulative across a row (Assumption based on the cryptic column titles). That is why there doesn't seem to be much sense in providing a separate summary values for each row (i.e for each fund).
==== Group summary values ====
{{Quotation|Group summary values [..] summarize meaningful subsets of values rather than the entire
set of values throughout the column or row.|[Few, 2004]}}

Given only the information provided in the table, there is no plausible grouping possible. The only possible grouping, using only the provided data, would be one by intervals of assets (in Millions of Dollars) or gain/loss percentage intervals. However (possibly due to our lack of domain knowledge) these groupings don't seem reasonable.
==== Header versus footers ====
{{Quotation|When the summary values are more important to your message or to your readers than the details, and placing them below the details would make them
harder and less efficient to find, it often makes sense to place them in headers even though this is less conventional.|[Few, 2004]}}

In our case the summary values denote complementary information, therefore their position in the footer seems appropriate.
=== Page information ===
{{Quotation|Because of short-term memory constraints, effective table design requires that certain information be repeated on each new page. Otherwise, your readers may lose track of information that they need to interpret the table as they move from page to page. |[Few, 2004]}}

Our table is not split into multiple pages, therefore this aspect is not applicable here.
==== Repeated column headers ====
{{Quotation|When tables extend onto multiple pages, the columns are no longer labeled after the first page unless you repeat the column headers on each.|[Few, 2004]}}

The proper way of handling tables spreading across multiple pages would be to copy the table headers on top of each page. However, in our case this is not necessary.
==== Repeated row headers ====
{{Quotation|[...] even those of us who are careful to repeat column headers on each page seldom think to repeat the row headers as well, yet the problem is the same.|[Few, 2004]}}

This principle is applicable when multiple rows, which spread across multiple pages, are grouped together and have one title column where the title printed only for the first row of the group. The correct way of designing such a table would be to re-print the title on the first row on each page. Again, this is of no concern to our table here.
== References ==

[Few, 2004] Stephen Few, Show Me the Numbers: Designing Tables and Graphs to Enlighten, Analytics Press, 2004, Chapter 8 - Table Design.

== Links ==

* [[Teaching:TUW_-_UE_InfoVis_WS_2007/08|InfoVis:Wiki UE Homepage]]

* [http://ieg.ifs.tuwien.ac.at/~aigner/teaching/infovis_ue/index.html UE InfoVis]

*[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09|Gruppe 09]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 2

2007-11-20T10:57:52Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 2

2007-11-20T10:33:19Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-09T11:37:57Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Wikipedia, 2007]}}

==Subfields==
 
Computer Graphics may be divided into four major categories:
===Geometry===
The subfield of Geometry studies ways to represent and process surfaces. Boundary representations are most commonly used, because the appearance of an object depends mainly on its exterior. Although point-based representations have been getting more and more popular lately, polygonal meshes are still the most popular form of discrete digital approximation of surfaces. These representations are Lagrangian (the spatial locations of the samples are independent) as opposed to Eulerian surface descriptions (i.e., where spatial samples are fixed) which are mainly used for deforming surfaces which undergo many topological changes (e.g. fluids).

===Animation===
This subfield of Geometry studies ways to represent and manipulate motion. Historically most interest has been focused on parametric and data-driven models, but in recent years physical simulation has experienced a renaissance due to the growing computational capacity of modern machines.
===Rendering===
This subfield of Geometry studies algorithms to reproduce light transport. It does so by converting a model into an image by simulating light transport to get physically-based photorealistic images, or by applying a style as in non-photorealistic rendering. Two basic operations in realistic rendering are transport (how much light gets from one place to another) and scattering (how surfaces interact with light).
===Imaging===
This subfield of Geometry studies image acquisition or image editing.

==History==
 
[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
[[Image:Pov_ray.png|thumb|300px|Glasses (created by using POV-Ray 3.6).]]
 
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database] 
[http://www.siggraph.org/ ACM SIGGRAPH]
==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-09T11:05:32Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Wikipedia, 2007]}}

==Subfields==
 
Computer Graphics may be divided into four major categories:
===Geometry===
The subfield of Geometry studies ways to represent and process surfaces. Boundary representations are most commonly used, because the appearance of an object depends mainly on its exterior. Although point-based representations have been getting more and more popular lately, polygonal meshes are still the most popular form of discrete digital approximation of surfaces. These representations are Lagrangian (the spatial locations of the samples are independent) as opposed to Eulerian surface descriptions (i.e., where spatial samples are fixed) which are mainly used for deforming surfaces which undergo many topological changes (e.g. fluids).

===Animation===
Studies with ways to represent and manipulate motion
===Rendering===
Studies algorithms to reproduce light transport
===Imaging===
Studies image acquisition or image editing

==History==
 
[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
[[Image:Pov_ray.png|thumb|300px|Glasses (created by using POV-Ray 3.6).]]
 
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database]

==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-09T10:34:29Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Wikipedia, 2007]}}

==Subfields==
 
Computer Graphics may be divided into four major categories:
===Geometry===
Studies ways to represent and process surfaces
===Animation===
Studies with ways to represent and manipulate motion
===Rendering===
Studies algorithms to reproduce light transport
===Imaging===
Studies image acquisition or image editing

==History==
 
[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
[[Image:Pov_ray.png|thumb|300px|Glasses (created by using POV-Ray 3.6).]]
 
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database]

==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

File:Pov ray.png

2007-11-09T10:28:24Z

UE-InfoVis0708 0225966:

== Summary ==
An image created by using POV-Ray 3.6.
== Copyright status ==
Public domain
== Source ==
http://commons.wikimedia.org/wiki/Image:Glasses_800_edit.png

File:Pov ray.png

2007-11-09T10:26:45Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-09T10:08:54Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 

==Definition==
{{Quotation|Computer graphics broadly studies the manipulation of visual and geometric information using computational techniques. Computer graphics as an academic discipline focuses on the mathematical and computational foundations of image generation and processing rather than purely aesthetic issues.|[Wikipedia, 2007]}}

==Subfields==
Computer Graphics may be divided into four major categories:

*Geometry: studies ways to represent and process surfaces
*Animation: studies with ways to represent and manipulate motion
*Rendering: studies algorithms to reproduce light transport
*Imaging: studies image acquisition or image editing

[[Image:whirlwind.jpg |thumb|200px|Whirlwind displays aircraft positions and auxiliary information.]]
==History==
:In the 60's, Jack Bresenham published how to draw lines on a raster device. He later extended this to circles. Larry Roberts pointed out the usefulness of homogeneous coordinates, 4x4 matrices and hidden line detection algorithms. Steve Coons introduced parametric surfaces and developed early computer aided geometric design concepts. The earlier work of Pierre Bézier on parametric curves and surfaces also became public.

:In the 70's, rendering (shading) was discovered by Gouraud and Phong at the University of Utah. Turned Whitted developed recursive ray tracing which became the standard for photorealism. One of the first displays of computer animation was Futureworld (1976), which included an animation of a human face and hand — produced by Ed Catmull and Fred Parke also at the University of Utah.

:In the 80's, Jim Blinn introduced blobby models and texture mapping concepts. Binary space partitioning (BSP) trees were introduced as a data structure. Loren Carpenter started exploring fractals in computer graphics. Postscript was developed by John Warnock.Steve Cook introduced stochastic sampling to ray tracing. Video arcade games took off.

: In the 90's, Mosaic, the first graphical Internet browser was written. OpenGL became the standard for graphics APIs.Dynamical systems (physically based modeling) that allowed animation with collisions, gravity, friction, and cause and effects were introduced. Surface subdivision algorithms were rediscovered. Wavelets begin to be used in computer graphics. Image based rendering became the area for research in photo-realistic graphics.
==Application==
* graphs and charts
* computer-aided design
* virtual-reality environment
* data visualisation
* education and training
* computer art
* entertainment
* image processing
* graphical user interfaces

== External links ==
[http://www.imdb.com/title/tt0074559/ Futureworld at the Internet Movie Database]

==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

File:Whirlwind.jpg

2007-11-08T21:25:53Z

UE-InfoVis0708 0225966:

== Summary ==
Image of whirlwind display
== Copyright status ==

== Source ==
http://design.osu.edu/carlson/history/lesson2.html

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T21:17:10Z

UE-InfoVis0708 0225966:

File:Utah teapot.png

2007-11-08T21:15:51Z

UE-InfoVis0708 0225966:

File:Whirlwind.jpg

2007-11-08T21:03:15Z

UE-InfoVis0708 0225966: Image of whirlwind display

== Summary ==
Image of whirlwind display
== Copyright status ==

== Source ==

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T20:57:36Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T20:30:47Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
==Definition==

{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 
==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Wikipedia, Computer Graphics. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Computer_graphics.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T20:29:14Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
==Definition==

{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 
==References==

[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965. 
[Wikipedia, 2007] Finlay McWalter, Utah Teapot, Wikipedia. Retrieved at: November 8, 2007. http://en.wikipedia.org/wiki/Image:Utah_teapot.png.

File:Utah teapot.png

2007-11-08T20:22:17Z

UE-InfoVis0708 0225966:

File:Utah teapot.png

2007-11-08T20:10:27Z

UE-InfoVis0708 0225966:

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T20:04:58Z

UE-InfoVis0708 0225966:

[[Image:utah teapot.png|thumb|300px|The Utah teapot.]]
==Introduction==
 
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 
==References==
 
[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965.

File:Utah teapot.png

2007-11-08T19:59:57Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T14:29:28Z

UE-InfoVis0708 0225966:

==Introduction==
 
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1965]}}
 
==References==
 
[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965.

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1 - Computer Graphics

2007-11-08T11:42:42Z

UE-InfoVis0708 0225966: New page: ==Introduction== {{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer program...

==Introduction==
 
{{Quotation|Perhaps the best way to define computer graphics is to find out what it is not. It is not a machine. It is not a computer, nor a group of computer programs. It is not the know-how of a graphic designer, a programmer, a writer, a motion picture specialist, or a reproduction specialist.
Computer graphics is all these – a consciously managed and documented technology directed toward communicating information accurately and descriptively.|[Fetter, 1966]}}
 
==References==
 
[Fetter, 1966] W. A. Fetter, Computer Graphics in Communication, McGraw-Hill Book Company, New York, 1965.

User:UE-InfoVis0708 0225966

2007-10-29T10:54:49Z

UE-InfoVis0708 0225966:

[[Image:VladimirD.jpg|right|Vladimir Drienovsky]]
{|
|''Nachname:''||'''Drienovsky'''
|-
|''Vorname:''||'''Vladimir'''
|-
|''Matrikelnummer:''||'''0225966'''
|-
|''Studienkennzahl:''||'''533'''
|-
|''E-mail Adresse:''||'''e0225966_at_student.tuwien.ac.at'''
|}

User:UE-InfoVis0708 0225966

2007-10-29T10:52:45Z

UE-InfoVis0708 0225966:

[[Image:VladimirD.jpg|Georg Prohaska]]
{|
|''Nachname:''||'''Drienovsky'''
|-
|''Vorname:''||'''Vladimir'''
|-
|''Matrikelnummer:''||'''0225966'''
|-
|''Studienkennzahl:''||'''533'''
|-
|''E-mail Adresse:''||'''e0225966_at_student.tuwien.ac.at'''
|}

File:VladimirD.jpg

2007-10-29T10:52:02Z

UE-InfoVis0708 0225966: New page: == Summary == == Copyright status == == Source ==

== Summary ==

== Copyright status ==

== Source ==

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09

2007-10-29T09:44:53Z

UE-InfoVis0708 0225966:

Dies ist die Gruppenseite der '''Gruppe 9''' der Lehrveranstaltung
[[Teaching:TUW - UE InfoVis WS 2007/08|UE Informationsvisualisierung WS 07/08]] .
== Gruppenmitglieder ==
[[User:UE-InfoVis0708_0200905|Kremmel, Thomas]] 
[[User:UE-InfoVis0708_0325904|Prohaska, Georg]] 
[[User:UE-InfoVis0708_0225966|Drienovsky, Vladimir]]
== Aufgaben ==
[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 1|Aufgabe 1]] 
[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 2|Aufgabe 2]] 
[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 3|Aufgabe 3]] 
[[Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09 - Aufgabe 4|Aufgabe 4]]

Teaching:TUW - UE InfoVis WS 2007/08 - Gruppe 09

2007-10-29T09:33:59Z

UE-InfoVis0708 0225966:

User:UE-InfoVis0708 0225966

2007-10-29T09:32:37Z

UE-InfoVis0708 0225966: New page: {| |''Nachname:''||'''Drienovsky''' |- |''Vorname:''||'''Vladimir''' |- |''Matrikelnummer:''||'''0225966''' |- |''Studienkennzahl:''||'''533''' |- |''E-mail Adresse:''||'''e0225966_at_stu...

{|
|''Nachname:''||'''Drienovsky'''
|-
|''Vorname:''||'''Vladimir'''
|-
|''Matrikelnummer:''||'''0225966'''
|-
|''Studienkennzahl:''||'''533'''
|-
|''E-mail Adresse:''||'''e0225966_at_student.tuwien.ac.at'''
|}