the graphics teaching tool dana tenneson anne spalter brown university
Post on 21-Dec-2015
216 views
TRANSCRIPT
![Page 1: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/1.jpg)
![Page 2: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/2.jpg)
The Graphics Teaching ToolThe Graphics Teaching Tool
Dana Tenneson
Anne SpalterBrown University
![Page 3: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/3.jpg)
Digital Visual LiteracyDigital Visual Literacy
• The world is becoming increasingly filled with visual digital media.
– Impacts workplace and daily life
• A “literacy” of digital media is required.
– Essential for “critical readings” of media
![Page 4: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/4.jpg)
Digital Visual Literacy in the Job MarketDigital Visual Literacy in the Job Market
• Skills listed in resumes– Photoshop
– PowerPoint
– Illustrator
• But is there an understanding of the concepts beyond the specific applications?
• Can people move to new applications when needed?
![Page 5: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/5.jpg)
Education ShortcomingsEducation Shortcomings
• Self Taught: Number of options in commercial software is overwhelming
• Tutorials: Focus on the “How” but not the “Why”
• Conceptual courses: Aimed at tech-savvy students
![Page 6: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/6.jpg)
Pedagogical IdealsPedagogical Ideals
• Visual learning for visual material
– Lectures are not enough
– Constructivist
– Make underlying models explicit for more accurate schema development
• Simple Interface
• Integrated Environment
– Expose the differences between data types
![Page 7: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/7.jpg)
The Graphics Teaching ToolThe Graphics Teaching Tool
![Page 8: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/8.jpg)
The Graphics Teaching ToolThe Graphics Teaching Tool
• A learning-oriented 2D and 3D environment
– Tools chosen to reduce clutter and reinforce conceptual understanding
• Inspection tools “Look under the hood” at your data
• Math and algorithms present, but simplified
– color = (α * new color) + ((1-α) * old color)
– “Higher alpha means more solid color.”
![Page 9: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/9.jpg)
The Graphics Teaching ToolThe Graphics Teaching Tool
• Multiple data types side by side
– Raster, 3D, Vector each is a plug-in
• Java-based application
– Optimized for use over web and desktop installation
• Powerful, if not commercial-grade
– Students have enough power to be expressive.
– Stepping-stone, not replacement
• It’s free.
![Page 10: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/10.jpg)
Raster GraphicsRaster Graphics
• Pixel-Setting Tool
– Brushes, Pens, Erasers, Spray Cans, etc
– User-defined alpha mask
• Filtering Tool
– Blur, Sharpen, “shift”
– Define your own kernel
![Page 11: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/11.jpg)
Raster GraphicsRaster Graphics
• Data Inspection
– Numeric ARGB merged with “Fat Bits” pixels.
– Set data by hand
![Page 12: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/12.jpg)
Raster GraphicsRaster Graphics
• Area Selection, Cloning, and Multi-colored Pixel-Setting Brushes also available
Left image courtesy of Jessica Xian at SIGGRAPH 2005
![Page 13: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/13.jpg)
3D Graphics3D Graphics
• Use primitives (cube, sphere, cylinder) or load .obj files
• Adjust parameters of lights and the camera
![Page 14: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/14.jpg)
3D Graphics3D Graphics
• Data Inspection to create basic scene graphs of objects
– Experiment with order of operations
– Group objects together
![Page 15: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/15.jpg)
Vector GraphicsVector Graphics
• Primitive shapes
– Square
– Circle
– Triangle
– Text
• Data Inspection
– Adjust scale, location, rotation
![Page 16: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/16.jpg)
Other Plug-insOther Plug-ins
• Renderers
– Data and its representation are kept separate
• Tool Sets
– Additional specialized tools for existing data types
![Page 17: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/17.jpg)
Use in the ClassroomUse in the Classroom
• Brown University’s Visual Thinking/Visual Computing course
– Started with “Make your own brush” task
– Students became enthralled with GTT
– Test results showed a high level of understanding of raster graphics
![Page 18: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/18.jpg)
Use in the ClassroomUse in the Classroom
• Artemis Project
– Summer program at Brown for 9th grade girls
• GTT to be included in lesson modules created for Maricopa Community Colleges
– Modules part of an NSF ATE grant project targeting Digital Visual Literacy
– Hundreds of students near-term
– Potentially many thousands long-term
![Page 19: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/19.jpg)
Coming SoonComing Soon
• Embedded lesson modules
• Web deployment kit
– Customizable lessons
• Open Source
– Roll your own tools, renderers, and data types
![Page 20: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/20.jpg)
ThanksThanks
• Andy van Dam
• Emil Sarpa & Sun Microsystems
• Ken Perlin & Konrad Rieck
• Undergrad Development Team
– Janete Perez
– Julie Kumar
– Ilya Medvedev
– Nong Li
– Jeffrey Cohen
![Page 21: The Graphics Teaching Tool Dana Tenneson Anne Spalter Brown University](https://reader030.vdocuments.net/reader030/viewer/2022032522/56649d6d5503460f94a4d0e0/html5/thumbnails/21.jpg)
DownloadDownload
• http://graphics.cs.brown.edu/research/gtt
• …or just Google “Graphics Teaching Tool”
• Feedback appreciated.
– How you’ve used it.
– The impact it has had.
– Bugs you’ve discovered.
– Features you wish it had.