COM 205Multimedia Applications

St. Joseph’s College

Fall 2003

Basic Software Design

Consider your audience

• Who?

• What?

• When?

• Where?

• How?

Technology

• Connection- 14.4K modems/ fast T1– Don’t over use graphics – too slow

• Monitor size– Put most important info at top of page– Don’t clutter screen– Don’t cause too much scrolling

• Browsers available– Netscape– Internet Explorer

• Plug-ins

Some Design Issues

• Speed ( of loading)

• Simplicity ( say more with less…)

• Clarity

• Consistency

• Easy of use

• Ease of navigation

• “Bells and Whistles”

Speed• Should load quickly• Choose text and graphics wisely– Not too many bitmaps!

• Balance text and graphics• Design for the disabled or those without

graphics– Use ALT tag in HTML– Blind will hear description of image with

synthesized speech– Some may choose not to load graphics and

can still understand the message

Simplicity and Clarity

• Use basic layout and themes

• Use only a few colors and fonts

• Choose clear consistent icons with universal meaning

• Include no more than 5 to 7 items on a menu

Consistency

• Provide and overview/summary screen

• Each link and page should have the same “look and feel”where possible

• Use same colors for hotlinks, etc…

Ease of Use

• Easy to read text and font size

• Use text appropriate to your audience

• Provide sense of “where you are”

• Check for dead ends- pages without links

• Use good navigational controls

Ease of Navigation

• Provide navigational controls– ( back, next, home, top, bottom)

• Button bars are often helpful– Include common links on each page• Home• Email• Back, etc.

“Bells and Whistles”

• Animation should be meaningful not distracting

• Don’t go over board- one screen is not meant to contain ALL you know or have learned

• Use special effects where they enhance your message…

Interesting Resources

• Web Page Design Guides– http://info.med.yale.edu/caim/manual– http://hotwired.lycos.com/webmonkey/design/?tw=design– http://www.killersites.com

• Virtual Computer Library– http://www.utexas.edu/computer/vcl/www.html

• Animation– http://hotwired.lycos.com/webmonkey/multimedia/

animation/tutorials/tutorial1.html