COAP:COAP-2100/Web design

The educational technology and digital learning wiki
< COAP:COAP-2100
Revision as of 11:25, 16 March 2012 by Daniel K. Schneider (talk | contribs) (moved COAP-2100/Web design to COAP:COAP-2100/Web design)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Introduction

Topics presented and discussed in class ...

General question one could ask about a web site (see homework 3)
  • Where and under what conditions will the Web site be used?
  • For what purpose will the site be used?
  • Who will use the site (the target audience)?
  • How will the site be used?
Usability

The general principles are: efficiency, effectiveness and satisfaction.

These principles can be detailed as:

  • easy to learn (task time)
  • efficient to use (task time)
  • effective to use (errors and task completion)
  • provides quick recovery from errors (errors and task completion)
  • easy to remember (task time)
  • enjoyable to use (subjective user satisfaction)
  • visually pleasing (subjective user satisfaction)

Usability.gov presents a similar list:

  1. Ease of learning - How fast can a user who has never seen the user interface before learn it sufficiently well to accomplish basic tasks?
  2. Efficiency of use - Once an experienced user has learned to use the system, how fast can he or she accomplish tasks?
  3. Memorability - If a user has used the system before, can he or she remember enough to use it effectively the next time or does the user have to start over again learning everything?
  4. Error frequency and severity - How often do users make errors while using the system, how serious are these errors, and how do users recover from these errors?
  5. Subjective satisfaction - How much does the user like using the system?

Summary:

  • Basically, usability testing means giving people tasks to do and observing them
  • Only user experience (satisfaction and related) is measured with questionnaires

We will look at the Short (informal) usability test report template (DOC - 216KB) template from usability.gov:

Landing page optimization

The five second test according to Oli Gardner

  1. What is it about?: How obvious is the core brand message?
  2. Do I care?: Am I interested? Does it speak to me?
  3. Is it trustworthy?: Does the design make me feel comfortable? Do they appear professional?
  4. How do I participate?: What am I supposed to do first? Is the primary call to action presented in a clear manner?
  5. Is it newsworthy?: Given today’s social web economy, how likely am I to want to share my experience? Is this facilitated in any way?

This test doesn't cover all usability issues, see the next item.

Contents of the landing page
Web site layout navigation principles

(Lynch and Horton):

  • No dead-end pages
  • Direct access
  • Simplicity and consistency
  • Design integrity and stability
  • Feedback and dialog
  • Bandwidth and interaction
  • Interface design conventions (picture)
Authenticity (real and perceived)
  • Sign and date contents. (on a blog create an "about" page)
  • ... is also influenced by user experience (even choice of fonts)
Wireframing - a first stage in proto-typing
  • Drawing a sketch for a "multi-boxed" web page (e.g. a portal). Demo of Mockingbird and Mockflow
  • Using a drawing tool such as Inkscape or a general-purpose on-line drawing tool. Demo of Inkscape (free drawing tool), Gliffy and Creatly.
  • Templating (very short introduction, this is more a self-study object for those who are able to dig into technical documentation and maybe some XML)

Reading

Read each of these texts. Total reading should be less than an hour. I am not requiring recall of details, but you ought to be able to locate information in these texts ....

Prototyping and wire framing (also tested in exam !)