INTERFACE DESIGN CRITIQUE - COOLMATH-GAMES.COM GABRIEL DEFRATES HCI 450

Gabriel DeFrates
HCI 450
Assignment 4
November 19, 2013

               Coolmath-games.com
              Interface Design Critique

                            1

Introduction
Coolmath-games.com is an educational website that offers interactive games for
children to play. As indicated on the interface’s “About us” page, the website aims at
providing educational based games in not only mathematics, but other areas such as
reading, science, geography, and spelling.

Guideline 1 (slide 2)
Utilize headings.
(Hyona & Lorch, 2004; Hornof & Halverson, 2003)
This slide displays the Reading and Spelling Games page. For each of the games that
the interface lists, it provides an underlined, bolded heading that contains the name of
the game. By displaying the heading containing game’s name, users will not be
required to read through the short descriptions underneath the game screenshot to
determine the name of the game; which also likely suggests the core concept of the
game.

Displaying headings establish the topic of the following content and further reduces
scanning. The impact of use of this guideline the user is able to save time and energy
when searching a website for a game that he/she would like to play. It creates an
immediate awareness of the relevance of content in relation to the user’s expectations
and desires.

This design illustrates guideline 1.

Guideline 2 (slide 3)
Use a larger text size/design than is conventionally used for ages five (22pt; x-
height 4.2) to eleven (18-14 pt.; x-height 3.3 mm) year old
(Hughes & Wilkins, 2000)
On the Reading and Spelling Games, the descriptive content underneath each heading
is displayed in 10 pt. font, which is too small for children between the ages of 5 and 8.
According to research conducted by Hughes and Wilkins (2000), the reading speed of
children ages 5 to 8 decreased as text size decreased (below x-height 3.3 mm) resulting
from reading age increase, and also children ages 5 to 11 years old made more errors
on smaller text (below x-height 3.3 mm) that is conventionally used for their age range.

Children who are searching the website and trying to determine which game they would
like to play may be become frustrated and distracted when trying to read the
descriptions because the text is too small, creating the possibility for errors and slowing
them down. If the text was displayed in a more appropriate larger size, the children

                                             2

would be able to more quickly to read through the content and select the game if it
sounds like the game they are looking for.

This design violates guideline 2.

Guideline 3 (slide 4)
Create pages that are not considered cluttered by users.
(Rosenholtz, R., Li, Y., Mansfiled, J., & Jin, Z., 2005)
On the homepage of the website, the links, logo, advertisements, and other various
texts are all placed close with little or no variation in color. Further, the variations in
color that are illustrated appear to be arbitrary with no real meaning. For example,
some of the navigational links are green, and some are blue. Some are tightly placed
above the logo, some are placed below. The display presents a high concentration of
navigational and promotional text content, slightly varied in color, in the same area with
little known representation of relationship or action.

Displays with high amounts of text and little color variations are considered cluttered by
users. The user may become confused at which items he/she may interact, or may
even be unaware that certain items can be manipulated; overwhelming the user and
possibly motivating him/her to go to another website that presents a more organized
and less cluttered navigational structure.

This design violates guideline 3.

Guideline 4 (slide 5)
Use a font size that is more typical for use in five (5) year olds (22 pt., x-height 4.2
mm).
(Wilkins, Cleave, Grayson, & Wilson, 2009)
On the Reading and Spelling Games page, the text displayed below each game is
displayed in 10 pt. font. In children who are ages 7 to 8, it has been found that using a
text size that is conventionally used for 5 year olds (22 pt., x-height 4.2 mm) leads to
increased speed of reading comprehension. Thus, 10 pt. would be too small to produce
the most desired level of reading comprehension speed for this age range.

The impact of having text that cannot be efficiently comprehended may lead to the
possibility of distractions interfering with the absorption of the content, and also a failure
to thoroughly communicate the description of the game. This could create mistaken
perceptions of what type of game or the specific type of educational value the game
could contribute.

                                              3

This design violates guideline 4.

Guideline 5 (slide 6)
Use a text size no smaller than 24 pt. (x-height 3.3 mm).
(Wilkins, Cleave, Grayson, & Wilson, 2009)
Complex sentences like the ones displayed on the All Games page can be difficult for
children ages 8:9 when displayed in font smaller than 24 pt. (x-height 3.3mm). The text
on this page is displayed in 10 pt.

Research suggests that 8:9 year old children who read content printed in smaller than
3.3 mm x-height read at reading age 4 months younger than their actual chronological
age. A parent who is evaluating their 8:9 year old child read the text may perceive that
the child is having difficulty comprehending the content, when actually; the content has
been designed too small for maximum comprehension capability at that age. This
design could potentially create the illusion that the child is having difficulty
understanding the content. The impact could be that the child may skip over important
content and miss important information in the website.

This design violates guideline 5.

Guideline 6 (slide 7)
Organize related objects close together.
(Wertheimer, 1923/1938)
On the Memory Games page, the interface illustrates the game screenshot, heading,
and description, which are all related to one another, close together to represent a
relationship among them. The impact of illustrating this guideline is that user will be
conceptually group these items together for each game and perceive this as one game
with necessary descriptive content, and he/she will be able to make an accurate
interaction decision based on the content. Objects placed close together are perceived
as being related.

This design illustrates guideline 6.

Guideline 7 (slide 8)
Provide a Search option.
(Barsalou, 1983, 1991)
None of the pages in the interface provide a search option for the user to utilize to
locate a particular game that they are looking for. Research suggests that providing a

                                            4

search option to the user provides the user with a means locating their desired items
without trying to guess, or, browse the categories that they are located in.

The impact of not providing a search option on this particular website could create
problems in quickly locating games by their name or keywords. In some instances, the
user may have played the game in the past and may not remember the game’s name,
and would like to use a search option to try to locate the game by keywords that he/she
recalls from the game. Also, this interface provides a large amount of games, and a
search option could assist with cutting down the time that the user spends on trying to
locate the game.

This design violates guideline 7.

Guideline 8 (slide 9)
Provide numerous browsing categories.
(Barsalou, 1983, 1991)
On the homepage, and all of the other pages of the website, the interface illustrates
multiple browsing categories of games grouped by type of game (e.g. geography,
spelling, etc.). The categorization allows the user to identify which area of
gaming/education he/she would like to explore or play, and then browse the available
games. Research suggests that providing multiple browsing categories is useful
because it is unlikely that a single category will fit all of the objects.

The impact of providing multiple search categories creates an effective user interaction
because the user is able to isolate the items that he/she views by the area of
educational interaction that they desire. It will be more likely that the user will be able to
find the games that he/she was looking for.

This design illustrates guideline 8.

Guideline 9 (slide 10)
If achievable, fit content on individual screen with margins and space between
paragraphs.
(Rau et al., 2007; Bernard et al., 2000)
On all pages of the interface, content, especially the top navigation and logo are all
displayed with small margins and little space between objects. The impact of not
providing space and ample margins between content is that some items, like the game
browsing categories, may be mistakenly categorized together, or may not recognized
as an item altogether.

                                              5

Research suggests that less densely populated screens allow for more efficient and
navigating. In the current design, it could be possible for the user to completely
overlook areas of the interface that they would have intended to interact with. Less
content on the page with more spacing and margins would allow the user to digest the
content more easily and effectively interact with the objects as intended.

This design violates guideline 9.

Guideline 10 (slide 11)
Locate objects along a line.
(Wertheimer, 1923/1938)
In all of the categories of games, the screens shots and descriptive content are placed
along a common vertical line. Research suggests that placing objects in a line creates
the perception of relation or being of the same entity. The impact of organizing the
many games and descriptions in a line could increase efficiency when the user is
scanning for games that he/she would like to play. The lines of games create a
reference point for the user’s eyes to go return to after reviewing each of the games to
continue scanning the other games.

This design illustrates guideline 10.

                                            6