CSE 171, Spring 2006

User-Interface Design: Social and Technical Issues

Math Master! Sketching a Mathematics Learning Game Interface

by Fox Harrell

Math Master! should include the following:

  1. current math problem
  2. current score
  3. current unit information
  4. user name
  5. user input prompt
  6. get hint option
  7. change unit option
  8. user avatar
  9. previous problems list
  10. change avatar option
Element Representations:
  1. text, e.g. "3 x 2"
  2. text, e.g. "1 correct, 1 incorrect"
  3. text, e.g. "Unit 4: Times Tables"
  4. text, e.g. "Khadija"
  5. image, flashing box
  6. button, "get hint?"
  7. button, "change unit?"
  8. image, cartoon graphic
  9. text, e.g. "Previous: 4 x 8, 3 x 5"
  10. button, "change avatar?"

The element representations cannot be arbitrarily displayed on the screen. Poor design of the representations would result in an interface that is very confusing.

poor math interface

We need to convey the relative priorities of the representations, e.g. the current math problem is more important the name of the unit topic. Priorities can be expressed by the attributes, or data sorts, of representations such as color or size, e.g. the score can be depicted with the correct answers in green and incorrect answers in red. We also need consistency between representations according to the sorts of things they are, e.g. all buttons should share a resemblance. When deciding about trade-offs we often choose form over content, e.g. omitting display of previous problems to avoid screen clutter.

good math interface

Finally, we should ensure that the interface serves the stakeholder needs and values, e.g. using a more child friendly term like "pic" over the term "avatar." We should also enable the user to represent herself in a way that reflects her self image, culture, social values, and preferences.

Valid XHTML 1.0 Strict Valid CSS!