Developmental Process

Developing the Prototypes | Usability Testing

Developing the Prototypes Back Up

When developing software, it is extremely important to design different low-fidelity prototype.  In this light, our team designed two vastly dissimilar prototypes as a starting point towards a final design.  Here is a walk-through for the mockups.  For our usability testing we decided to test and improve upon prototype 1.

Registration Page

Overview

A registration page is necessary for two reasons.  First, the AARP finds it useful to track users’ access of their website.  One way to implement tracking is to have new users to provide self-identifying information through a registration process, and have returning users login on subsequent visits.  Second, having a registration requirement allows users to stop in the middle of the game and return later to continue without restarting.

Figure 11: Prototype 1 - Registration screen

Prototype 1

The first screen is a sample registration screen.  When registering, the users are required to provide a minimal amount of information.  Some information includes the user’s name, email address, and password.  These fields are required to create a secure, individual login for each person.  The user’s birthday is required only for statistical purposes, while the user’s zip code will be used in determining the location of a nearby AARP office.  The address of a local office is necessary because a prize will be awarded upon game completion, which may require the user to visit AARP.  The last secret question and answer field is provided in case the users forget their password.  After which they will be asked to answer their selected secret question and a new password would be sent if the question was answered correctly.

Figure 12: Prototype 2 - Registration screen

Prototype 2

This screen is the second sample registration screen.  When registering, the users are required to provide a minimal amount of information.  The only information requested here are the user's email address and a password.  This approach could be less hassle for users and might encourage more people to play the game.  The downside of this approach is that it doesn’t give the AARP as much information about who is playing the game.

Developing the final Registration Screen

Registering for the game was a procedure that many usability subjects were not satisfied with.  Our usability tests found that older people were reluctant to give out information like an email address or their home address to play a game.  After brainstorming several possibilities, our solution was to ask for only 3 pieces of information.  A username that could be anything the user wanted; a password that would stop other people from playing as them, and a security question to remind them of the password in case if they forget.

Login Screen

Overview

It is important to provide a simple, attractive login screen since it is the first screen any user will see upon accessing the game.  To log in, a user must provide his email address and registered password.

Figure 13: Prototype 1 - Login screen

Prototype 1

If the email/password combination is correct, clicking the “PLAY” button will log the user into the game.  Otherwise, a popup box will appear indicating that the login information was incorrect, advising the user to try again.  If the user is not registered with the system, clicking on “New Player” loads the registration screen (Screen 1).  Clicking on “Forgot Password” causes a popup box to appear asking the user for the answer to his secret question.

Figure 14: Prototype 2 - Login screen

Prototype 2

The second prototype less graphic, which decreases the time it takes for a browser to load the page and encourages users on slower modems to play the game.  All of the functionality described above is included on the screen.  For example, there also a link for new players, an email address and password textbox.

Developing the Final Login Screen

Our usability testing found that many people could not correctly log onto the game with our original prototype.  They never clicked on our link for “New Player.”  Our solution was to separate the login screen with physical space for the new user and the returning user.  We felt as though this approach would make it more intuitive for the users to use the game.

Puzzle Screen

Overview

The game will offer many different types of puzzles.  Each type of puzzle will require a slightly different layout.  For example, a puzzle asking for the next line in the lyrics of a song may have a link to download the song.  Another puzzle may not need an external link and only contain text or a picture directly displayed on the screen. Despite those differences, each puzzle screen will have the same general layout to maintain consistency.

Figure 15: Prototype 1 - Puzzle screen

Prototype 1

The word “PUZZLE” appears labels the screen to alert users that a question is at hand.  Clicking on the “Instructions” link directly beneath the header launches a popup box with advice on how to complete the puzzle at hand.  The contents of the puzzle appear in the darkened area.  To complete the puzzle, the user types the answer in the box provided and clicks “SUBMIT.”

Figure 16: Prototype 2 - Puzzle screen

Prototype 2

This puzzle screen provides some additional functionality.  First, it indicates how many puzzles are complete out of the set.  Second, it allows the user to return to the previous question, if they wish to do so.  Additionally, a “Hint” link appears which launches a popup box revealing a hint about solving the puzzle.  On the bottom of the screen, three links allow the user to bookmark the game page, check ranking against other users, and join a team of puzzle users.

Developing the final Puzzle Screen

Our initial usability test showed that people could solve the puzzles fairly well.  We decided to add a hint button and a logout button in our final design.  We also decided to include a progress bar showing how far the user was in the game.

 Prize Claim Screen

            Overview

            In order to motivate users to complete the entire game, the AARP plans to award users with a prize.  It is unclear whether the user will need to provide additional information at this point.  Ideally, local AARP offices around the country will have prizes at hand for users to claim.  If this is not possible, then the AARP will mail out the prize to individual winners.

Figure 17: Prototype 1 - Claim prize screen

Prototype 1

This interface assumes that AARP will have prizes at local offices.  In this case, clicking “CLAIM PRIZE” launches a popup box that lists local AARP offices which have prizes in stock.  Behind the scenes, the software will mark a boolean flag indicating that the user has completed the tasks necessary to be rewarded.  The flag will inform AARP employees to confirm the prize request.

Figure 18: Prototype 2 - Claim prize screen

Prototype 2

It is also possible that the AARP will mail out the prize to users who complete the game.  In this case, additional information from the user will be needed.  Since the system will already have name and zip code information, this screen asks for street address and city.  In addition, it provides the option of subscribing to the AARP newsletter and a health and well-being newsletter.

Developing the final Claim Prize Screen

Since, our final design only asked a few questions of the user in order to play the game.  We changed the Claim Prize screen to include an in-depth sample of questions to the users.  We ask for their street address, their zip code, and other information pertaining to where they live. 

Usability Testing Back Up

Prior to starting the usability test, the users were reminded that we were only testing the interface to the software and not them as individuals.  We performed a total of six usability tests.  One was a pilot test on a University student, one test was on a younger adult, and the remaining 4 usability tests on older adults over 45. Before testing we gave the test subjects a brief overview of how each test would proceed.  We assigned different tasks to the users.  The usability test tasks they completed are as follows:

Pre-Test

Before the test subjects were allowed to take the usability test, it was useful to collect a few pieces of person data to confirm that they fit certain criteria.  The information that we collected includes:

·        Age?

·        Computer Experience? (Options would include novice, intermediate, and expert.  We would include a description of each to assist.)

·        Vision or Hearing Impairments?

·        Member of AARP? (Options would include past member or current member.)

·        Average number of hours of computer use per week?

·        Average number of hours spent playing computer games per week?

·        Average number of hours spent online per week?

The questionnaire for these pre-test questions is included in Appendix A.

Post-Test

After the test subject completed the tasks required, general questions about the overall layout of the screens were be asked.  These questions included:

·        On a scale of 1-9 with 1 being repulsive and 9 being marvelous, rate the visual appeal of the interface in terms of color choice and contrast?

·        On a scale of 1-9 with 1 being repulsive and 9 being marvelous, rate the visual appeal of the interface in terms of font size and style.

·        What change(s) would you make to the general layout?  This can be color, font, layout, or anything else that comes to mind.

 

For each of the different pages (registration, login, puzzle, prize, logout), some additional questions were asked, including:

·        On a scale of 1-9 with 1 being very confusing and 9 being extremely clear, rate the ease of understanding the functionality of each page.

·        On a scale of 1-9 with 1 being repulsive and 9 being marvelous, rate the visual appeal of the layout of components.

·        List any changes you would make to the name of the page, buttons, and links that would help clarify its purpose and functionality.

·        List any unnecessary clutter that you would like to see disappear or moved.

·        List any additional links or information would you like to see on this page.

 

The feedback obtained from these questions helped evaluate the usability and visual appeal of not only the entire game as a whole, but of each page as well.  The questions are specific enough to pinpoint possible weaknesses of the design while not going into too much detail making the test subject frustrated with having to answer tedious questions.  The questionnaire for these post-test questions is also included in Appendix A.

Usability Testing Results

The usability tests exposed several problems with our design.  Early in the testing, some functional errors were found in our program.  One submit button did not work as expected; the only way to complete the task was to press the ‘Enter’ button on the keyboard.  Additionally, a second button intended to return the user from an instructions page to the game itself did not function as expected.  Since these problems were discovered early on, they were fixed for the final three usability tests.

Even after fixing these functional issues, the usability tests exposed some features that were not intuitive to the users.  To register for the game, we expected users to click on a “new player” button displayed next to an email address text box.  Two of the six players could not complete the registration task at all and no one was able to properly log in on their first attempt.

Our second task, logging into the game, worked well without any problems.

Our third task, completing a game puzzle, was found to have several problems.  Most users had a tough time guessing the answer.  Three of the six did not know how to complete the task at hand and did not immediately click on the instructions button.  Finally, some users commented that instructions on completing the puzzle should be on the main game screen, and not only accessible via the instructions link.

The fourth task, submitting personal information to receive a prize, was also met with skepticism and caution.  Many subjects were disinclined to give out their personal information on the internet.

Pre-test Questionnaire Results

4 of 6 test subjects were between the ages of fifty and sixty (the AARP suggested that we aim our game towards younger members of their organization ranging from around 50-60 years of age), the remaining 2 test subjects were in there 20s.  All members felt as though they were intermediate users with computers.  These test subjects had no visual/auditory problems with the exception of wearing glasses.  None of the test subjects were members of the AARP.  Five of the six subjects spent three or more hours on the computer per day and one spent one to two hours.  Five of the six subjects spent between zero and thirty minutes playing computer games per day, the remaining test subject spent 2-3 hours playing games.  There was an even spread on time spent online per day: one person spent 0-30 minutes, one spent 1-2 hours, two spent 2-3 hours, two subject spent three or more hours.

Post-test Questionnaire Results

Most users were satisfied with the visual appeal of our interface in terms of color choice, contrast, font size, and style.  Users gave these categories a 7 or 8 out of 9, which we feel shows that they were satisfied with the visual appeal of the interface.  Most users were satisfied with the visual appeal of our layout and rated it a 7 or 8 on average.  Users did not think that the prototype was easy to use.  One user rated this category with a 2, one rated it a 3, one rated it a 4, and three gave it an 8.  Ease of use was the biggest challenge for our team when designing our new improvements for the interface.  The users had problems accomplishing tasks with our prototype. 

Additional Online Survey Results

Thirty-two surveys were collected from older adults.  We used an online tool called Zoomerang to collect the surveys.  This link will display the online survey questions: Online Survey.  An additional text-based version of this survey is included in Appendix A.

 

Survey Results