University of Illinois, Urbana-Champaign
Educational Psychology 387
Computer Uses in Education
13 February 1997
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 your vision of education in 2017
- If you haven't already, send me an exemplary personal web page
- Check your links.
.
.
.
.
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?
.
.
.
.
.
.
Personal presentation on the web
- multiple goals
- multiple audiences
.
.
.
.
Institutional presentation on the web
.
.
.
.
.
.
.
Design features
Consistency/simplicity/aesthetically attractive
........however
Match of interface to audience goals
Lin & Levin paper
.
.
.
.
.
.
.
.
For next week
- Read at least two style guides and use them to improve your own personal web page
- Read the set of "visions" from our class
- Look at the visions from last fall
- Look at the Open University (UK) web site
- Write a synthesis, comparing and contrasting the visions
- Add this to your own vision (with links to the others you reference)
- Write a proposal for your major project (send via email, send URL or turn in on paper)
- What question do you want to address or what goal do you have?
- What audience do you have for your project?