Web Multimedia

1
Web Multimedia

• Usability And Testing

2
Why Test?

• To see if it works
• To see if it suits its purpose
• To see if it is useable
• To see if the user understands the navigation
• To see if the web interface works
• To see if it hits its target - what it aimed to
  do
• To see if its accessible

3
What is Usability?

• The measure of a product's potential to
  accomplish the goals of the user.
• In IT, the term is often used in relation to
  software applications and Web sites.
• Some factors used in determining product
  usability are ease-of-use, and visual
  consistency.

4
Recap on accessibility
5
What is accessibility?

• "The power of the Web is in its universality.
  Access by everyone regardless of disability is an
  essential aspect." -- Tim Berners-Lee, W3C
  Director and inventor of the World Wide Web
• For a website to be accessible, its content must
  be available to everyone, including people with
  disabilities.

6
Accessibility Means Dull

• WRONG!!!!!!
• An accessible page is NOT a dull, plain boring
  text
• WAI (www.w3.org) guidelines tell you how to do
  things accessibly, they dont say Dont do it
• Web accessibility is not about restricting your
  multimedia/graphical design it's about enhancing
  it!

7
Font size

• The W3C recommends that you let users set the
  base font size in their browser and that you set
  all variations using the "em" unit.
• An em in the Web context is the same as the font
  height, which makes it a relative unit and
  therefore flexible.

8
Colour Blindness
9
Seizures

• Seizure disorders
• Triggered by visual flickering or audio signals
  at a certain frequency
• To use the Web, people with seizure disorders may
  need to turn off animations, blinking text, or
  certain frequencies of audio

10
Photosensitive Epilepsy

• allow users to control flickering, avoid causing
  the screen to flicker
• allow users to control blinking, avoid causing
  content to blink
• allow users to freeze moving content, avoid
  movement in pages
• provide the ability to stop the refresh, do not
  create periodically auto-refreshing pages
• provide the ability to stop auto-redirect, do not
  use markup to redirect pages automatically.
  Instead, configure the server to perform
  redirects.

11
Back To Usability
12
Typical problems

• What type of information is on this site?
• Assumes you are familiar with the content
• What type of information will this link lead to?
• Need to explain links
• Unexpected links off site
• Distinguish off site links
• Media does not work
• Make sure they get a choice and make sure links
  to plugins are clear

13
How do you evaluate

• Decide what you are evaluating
• Decide how you are going to evaluate it
• Decide who is going to evaluate
• Perform the evaluation
• Measure reactions / results
• Analyse results
• Report on results

14
Meeting The Needs

• Identify the audience (intended users)
• Gender / Age / Enthusiasm
• Meet the needs of the intended users
• What is the purpose of the site?
• Who is the site for?
• What will attract users and meet their needs?
• provide quality in use
• Efficient in an acceptable time
• Satisfied in comparison to expectations

15
The Content

• Is it pitched at the right audience
• Is the user satisfied with the content
• Is anything learned and how long does it take
• What parts / sections do they use the most
• Is the content jargon specific / Is this relevant?

16
What is Usability Testing?

• A method by which users of a product are asked to
  perform certain tasks in an effort to measure the
  product's ease-of-use, task time, and the user's
  perception of the experience.
• Can be done formally, in a usability lab with
  video cameras, or informally, with paper mock-ups
  of an application or Web site.
• Changes are made to the application or site based
  on the findings of the usability tests.

17
How?

• Introduction for participant
• Give the user realistic goals
• Something they will do on the site play some
  media
• Ask the user to find the information using the
  links
• The navigation
• Is it easy to understand
• Is it easy to follow
• Do they get lost in hyperspace
• Watch and record behavior (take notes, tape)
• Interact with participant
• Debriefing - Identify areas of difficulty and
  improvements

18
(No Transcript)
19
Measuring usability

• Does the user make lots of mistakes
• Can they reach their goal
• Watch the progress they make and the routes they
  take
• Watch where they are slow
• Find out how they use the system
• Ask them their opinions

20
Recap - Create a Usable Flash Site

• Flash receives a great deal of criticism from
  usability and web standards advocates which are
  valid.
• What the critics fail to understand is that the
  designers are usually responsible for the lack of
  usability.
• Flash has the capacity to create usable sites,
  but requires that designers follow the
  guidelines.

21
Adobe Developer ConnectionUsability Topic Centre.

• http//www.adobe.com/devnet/topics/usability.html
• Remember user Goals
• User typically come to a site with a goal in
  mind.
• Remember Site Goals
• Site design should reflect business or client
  needs.
• Avoid unnecessary Intros
• While intro animations are exciting, they often
  delay the users access to the information they
  seek to get to another area

22
Provide logical navigation and interactivity

• Remind users where theyve been.
• Give users an easy exit from each major section
  of the site and an easy return to their starting
  point.
• Clearly indicate each links destination.
• Keep navigation structures visible rather than
  hiding them until the user has triggered an event
  
• Make sure your buttons have well defined hit areas

23
Support back button navigation.

• Using built-in browser forward and back
  navigation
• Separate Flash movies into logical chunks
• Place them on individual HTML pages
• Or set up the movie to include a Flash-based Back
  Button that the user can use to return to a frame
  or scene that represents a logical previous page.

24
More Tips..

• Design for consistency
• Dont overuse animation
• Avoid unnecessary animations.
• The best animations reinforce the site's goals,
  tell a story, or aid in navigation.
• Repeated animations on text-heavy pages distract
  the eye from the message of the page.

25
More Tips..

• Use sound sparingly
• Sound should enhance your site but not be
  indispensable.
• TARGET Low-Bandwidth
• the smaller the download, the better.
• The initial screen download should be no more To
  reduce download time, use smaller vector-based
  images (unless the image is a complex bitmap),
  and use the Load Movie action only when the user
  specifically requests a file.

26
More Tips..

• Design for accessibility
• Make your content available to all users,
  including those with disabilities.
• Highly descriptive Alternate Tags allow your
  content to be interpreted by assistive
  technology.
• The magnifying Smart Clip for zoom is another
  easy-to-use Macromedia Flash feature that allows
  more users to see your content.
• http//www.adobe.com/accessibility
• Test For usability
• Have someone else test your site to make sure it
  accomplishes both user goals and site goals
• Re-test you your site when you make changes

27
Intuitive Navigation

• Most people visiting a site, whether it is a
  Flash site or other, will be there for the
  content and no other reason.
• If they can't find it, they will leave rather
  than spend the time to look for it.
• Images for navigation buttons are nice, and will
  enhance the look of the site, but it will help if
  you provide an explanation of where clicking will
  take the visitor.

28
Communicate With the Visitor

• The visitor should always know what's and
  happening or where the site is taking them.
• This is probably the leading usability problem
  with Flash sites.
• After the site is created, find someone who isn't
  web savvy to test it.
• Watch as they are navigating and pay attention to
  where they click, where they hesitate, or
  anything else that confuses them.
• This will help in making your site more usable
  for future visitors.

29
Web sites For Design Hints

• http//www.webstyleguide.com/
• http//www.clickz.com/experts/ad/lead_edge/article
  .php/838701
• http//www.usableweb.com/
• http//www.useit.com/alertbox/20021125.html