Information Architecture and Design Final Project iSchool Capstone

advertisement
Information Architecture and Design
Final Project
iSchool Capstone Website
Jesse Martinez
Fall 2006
December 7, 2006
http://www.ischool.utexas.edu/~mjesse/385/project/programs/capstone/index.html
Presentation Structure
Organization
- Some basic information
Some Early Questions
Design Evolution
Results
- Hindsight is always 20/20
Organization
A website that should be familiar:
iSchool Capstone project page.
This project is a “ ‘capping’ experience” to all
iSchool Master’s candidate students.
To be completed in the final semester of study,
but should be aware of this much, much sooner.
This is a requirement for graduation.
Organization
Site information
- what kinds of projects are available
- practicum, internships, thesis/reports
- poster sessions
- how to apply
- large chunk on Professional Experience Project
Organization
Strait-forward purpose - instructions and information
Lots of content - needs good classification schemes!
Heavy on user browsing - needs good navigation!
1
3
2
Where are we? How do I get back?
Where are we? How do I get back?
Some Early Questions
iSchool Capstone site is part of the larger UT web system
- constrained to particular color and design schemes
- css files, content, and labels are all there . . .
- work on Capstone or work on entire site?
- alter the content, leave the style?
- alter the style, leave the content?
- alter both?
Timeline
Early sitemap layout
Label exercise
Early wire frame sketch
First design
Second design
Third design
Capstone Information
News
Calendar
Overview
Resources
Poster Session
School
Library
Practicum
Capstone Options
Preservation
Practicum
Conservator
Internship
Registration
Professional
Experience
Project
(Introduction)
Checklist
Guidelines
Most recent site map
Past presentations
Images from poster sessions
Templates for posters
Master’s
Thesis
Opportunities
Master’s
Report
FAQ
Some statistics
1 Template
1 heavily edited CSS file
40 HTML pages
(15 pages had real content)
More Results
- Original HTML code was not very compliant
- copy/paste compounded problems even more
- Still some issues remaining with compliance
- Almost pure CSS design
- Smaller page sizes = faster download
- Better labels = better navigation = better browsing
Hindsight
What I would have done differently
- spent more time in the design phase
- allocated more time for the verification stage
- used task flows and user scenarios more
- used Dreamweaver templates from the beginning
- incorporated a working print.css file
Resources Used
Dreamweaver 8 (Mac)
Meadhra, Michael.“How to do Everything with Dreamweaver 2004.” McGrawHill/Osborne,
New York: 2004.
Rosenfeld, Louis, and Peter Morville. “Information Architecture for the World Wide Web.”
O’Reilly: 2004.
Various CSS tutorials online:
http://www.dynamicdrive.com/style/csslibrary/item/wire-frame-menu/
http://icant.co.uk/csstablegallery/index.php?css=43#r43
http://www.spiffycorners.com/sc.php?sc=spiffy&bg=ff9933&fg=ffffff
Download