Hypermedia module
User System Interaction
This module runs from Monday 24th February until Friday 7th March
2003.
Note that I will be available in Eindhoven for help with the course on
Monday 3rd March. If you need help before or after this date then
feel free to email me at
Lynda.Hardman@cwi.nl.
Links to course materials
Links to related materials
Hypermedia module exercises
Exercise 1 (1 day)
Individual exercise
The goal of this exercise is to analyse the design of a state of the art
graphics-intensive Web site.
Explore the Rijksmuseum web site http://www.rijksmuseum.nl
.
First choose a language and then explore the Collection (3rd link from the
left).
Make notes on what you think is good graphic design, good use of links and
good use of media.
More importantly, think about what could be improved in these areas.
Think of some questions you would like the answer to from the site.
Write about your experiences in finding the answer.
Try using search facilities on the site.
Try exploring the site through navigation.
Write notes on what you find.
Discuss in the report what you would have liked the site to provide.
Publish written report in HTML of 4 pages (2000 words), including illustrations
if desired, on your web page and email the URL to
Lynda.Hardman@cwi.nl. If I have the URL on Thursday 27th
February I can
provide feedback (by email) on Friday 28th February.
Exercise 2 (2.5 days)
Group exercise (4 per group)
The goal of this exercise is to give you hands on experience with using
state of the art multimedia web technology.
Create a presentation in SMIL 2.0 using images and texts from the Rijksmuseum
site. You are also encouraged to find relevant material from other sources
and/or make your own audio recordings (e.g. language voice-overs in multiple
languages).
Make sure this runs in the RealOne player.
Create the same presentation in XHTML+SMIL (or HTML+TIME). Make sure it runs on IE
6.
You can use a plain text editor (e.g. Notepad, emacs, vim) or an XML editor
(e.g. XML Spy) to create the SMIL and XHTML+SMIL documents.
Some example SMIL presentations can be found at http://www.cwi.nl/~lynda/USI03/SMIL/.
Patrick Schmitz's HTML+TIME examples can be found at http://www.ludicrum.org/demos/H+Tdemos.html
(use IE 6 to view).
Publish your working presentations on your web page and email the URL
to Lynda.Hardman@cwi.nl
. Don't forget to state the names of the people in your group in the
email.
Write notes about the problems you had in creating the different formats.
Make a comparison of the two formats you used. In particular, timing
information, ability to include multiple languages, layout information, linking
information.
Publish a written report in HTML of 2 pages (1000 words) on your web
page and email the URL to Lynda.Hardman@cwi.nl
. If I have the URL on Tuesday 4th March I can
provide feedback (by email) on Wednesday 5th March.
Exercise 3 (2.5 days)
Group exercise (same groups as exercise 2)
The goal of this exercise is to design 2 or more interfaces to the Rijksmuseum
Collections tailored to particular user types.
Go to the Cuypers page, http://media.cwi.nl:8080/demo/
and explore the different presentations that can be generated on the
topic Rembrandt and Chiaroscuro. In particular, observe what happens
when selecting different screen
sizes and user types.
Make notes on the use of layout, timing and links in the different versions,
in particular when you feel this is appropriate or inappropriate for the different
cases.
Based on your notes, and on your own analyses in exercise 1, create design
sketches for at least 2 user types for 2 different devices (e.g. portrait
and landscape, or PC screen versus handheld device).
Exercise 1 was intended to give some insights into what to think about
when designing the presentation of information. While general
evaluation techniques are valuable, exercise 3 should focus on
three things:
- appropriate use of media;
- appropriate use of timing;
- different types of navigation structures, e.g. how much information should
be shown at a time, how complex should the linking structures be?.
While graphic design issues, such as use of colour and fonts, are
extremely important in a real-world setting, they are secondary in this
exercise. To emphasize the difference in the 3 aspects, use the same
colour schemes and same (or sub-set of) media items for both user profiles.
Important points to be included in the report are:
- explicit descriptions of the two different user profiles and
- explicitly argued design decisions for the two different user
devices.
Use the technology you feel most comfortable with for communicating
your designs. (Make sure I can access the result.)
Feel free to mail me with questions.
The following are ideas which are meant to illustrate what you should
try to come up with. Developing your own would, of course, be better:
- Use a voice over to point out details in a painting, compared with
using graphics to highlight parts of the painting.
- Use scrolling texts or add links?
- Use menus with thumbnail images or text descriptions?
Publish a written report on your design decisions in HTML of 2 pages (1000
words) on your web page and email the URL to
Lynda.Hardman@cwi.nl
.
Publish your presentations on your web page and email the URL to
Lynda.Hardman@cwi.nl.