University of Illinois, Urbana-Champaign
Educational Psychology 387
Computer Uses in Education
14 September 1995
Interactive Graphics / Interface Design
.
.
.
.
.
.
.
.
But first ...
- If you haven't already, send me a message telling me your personal web page is ready
- If you haven't already, send me the name of the file containing an example of Chip Bruce's
taxonomy
- Check your links.
- Internet and Web statistics
.
.
.
.
Interactive Graphics / Interface Design
.
.
.
.
Interactive Graphics
- "Clickable graphics"
- Blue line around it


- Simple whole graphic links
- graphic "maps"
.
.
.
.
Whole Graphic Links
- Just link the graphic link!
.
.
.
.
Graphic link: <img src="mygraphic.gif">
Linked graphic link:
<A HREF="GoHere.html"><img src="mygraphic.gif"></A>
or
<A HREF="AnotherGraphic.gif"><img src="mygraphic.gif"></A>
.
.
.
.
"Clickable" maps
- you go different places depending on where in the graphic you click
- Web66 example
.
.
.
.
.
.
.
.
Interface Design
- What makes a good web page?
- What makes a good personal web page?
- organization
- balance in amount of information
- visual attractiveness
- entertaining
- simple language
- readability
- ease of use
- updated repeatly
.
.
.
.
.
.
.
Design features
Consistency/simplicity/aesthetically attractive
........however
Match of interface to audience goals
Lin & Levin paper
.
.
.
.