...
GR3 - Paper Prototyping
...
1. Scenario
Briefing
Two people with a kit arrive at the aquarium without a visit plan. They have limited time available because they are tourists in Boston. This web-based system is available through a mobile device to accomplish the most common tasks required by visitors.
Test
We asked a total of 7 users to solve a set of 4 tasks while pretending to be visitors to the Aquarium. We used two prototypes and some changes between user tests in order to improve the UI. The observations, changes, usability problems and prototypes are described bellow.
...
| The main screen has the options for searching for animals, buy tickets and see the Aquarium map. |
| Screen for buying tickets. The user needs to input the required information. We tried to ask for the minimum amount of information to speed up the buying process, specially because of the fact that this web-based UI will be used from a mobile device. |
| Confirmation Screen |
| Aquarium Map |
| Result of search query |
| Wiki Markup |
|---|
{html}</div>{html} |
3. First Round Prototype Testing
The first prototype was tested on 4 users. The results on usability issues are shown grouped by user-task:
3.1 User 1:
...
*Aquarium Map. This screen is intended to be contain all information. The map shows the location of all animals and highlights the events of the day near to the appropriate location. | |
| Result of search query. When a user inputs a search query in the home screen search box, the result is shown using this layout: information about the specie, its location and a button to locate it in the map (map screen), and a list of events related to this specie. |
| Wiki Markup |
|---|
{html}<div id="design2" class="hidable"></div>{html} |
User 1 - Observations:
Task 1: Buy 2 tickets
clicks Tickets
clicks text box, enters informations, tabs to go to next text box
repeats until form is finished, grabs ticket
Task 2: Find the location of the Little Blue Penguins
hit floor 2 look around
hit floor 3 look around
hit overview
hit floor 1
go to search type in ‘penguin’
go back to map
hit floor 2 and find it
Task 3: Find the schedule of events about Penguins
...
3. First Round Prototype Testing
The first prototype was tested on 4 users. The results on usability issues are shown grouped by user-task:
3.1 User 1:
| Wiki Markup |
|---|
{html}<a href="javascript:showhide('design2');" id="design2show">Show</a>{html} |
| Wiki Markup |
|---|
{html}<div id="design2" class="hidable">{html} |
User 1 - Observations:
Task 1: Buy 2 tickets
clicks Tickets
clicks text box, enters informations, tabs to go to next text box
repeats until form is finished, grabs ticket
Task 2: Find the location of the Little Blue Penguins
hit floor 2 look around
hit floor 3 look around
hit overview
hit floor 1
go to search type in ‘penguin’
go back to map
hit floor 2 and find it
Task 3: Find the schedule of events about Penguins
floor 1
click triangular symbol
click round symbol
tap outside floor 1
click triangular symbol
click round symbol
tap outside to close all bubbles
click triangular symbol, see info about session
“It was hard to not confuse triangles and circles, they look alike”
...
|
|
|
|
|
|
| Wiki Markup |
|---|
{html}</div>{html} |
3.5 Usability issues:
| Wiki Markup |
|---|
{html}<a href="javascript:showhide('design3s');" id="design3sshow">Show</a>{html} |
| Wiki Markup |
|---|
{html}<div id="design3s" class="hidable">{html} |
...
...
Being in the main screen, it was not obvious how to:
- Find events schedule
- Type "Penguin event" in search box?
- Are events in the maps?
- What is it possible to search for using the search option?
...
...
For Buying tickets:
- The price is not displayed!
- Better way to input the date, need of "today button"
- Confusing what information is for the user or the credit card identification
...
...
- Once the transaction was finished, the user felt afraid of losing the confirmation number
- Some users didn't understand why the tickets was shown graphically and if there is any different with the confirmation number
...
...
Regarding the map feature:
- The legend for types of information in the map was confusing. Is this a list?
- ALL users expected the map to show your current location, but this will require some technology installed in the building.
- Lack of home button.
| |
|
|
|
|
| Wiki Markup |
|---|
{html}</div>{html} |
3.5 Usability issues:
| Wiki Markup |
|---|
{html}<a href="javascript:showhide('design3s');" id="design3sshow">Show</a>{html} |
| Wiki Markup |
|---|
{html}<div id="design3s" class="hidable">{html} |
| Being in the main screen, it was not obvious how to:
|
| For Buying tickets:
|
|
|
| Regarding the map feature:
|
| Search result layout:
|
Feedback from studio:
- It's possible to assume that the Aquarium building has some technology to enable self-localization.
- There are plugins to capture the credit card information from a phone picture. This could save the time of typing all the information for buying tickets.
- For the task of finding the information of an unknown specie, it could be hard to identify form a set of small pictures.
- Search box and home button need to be in all screens.
The detected usability issues are addressed in the second prototype.
...
Search result layout:
...
| Wiki Markup |
|---|
{html}</div>{html} |
...
| Wiki Markup |
|---|
{html}<div id="design7" class="hidable">{html} |
Task 1 - Observations/Usability issues:
1. The user wants to know the price of each adult or kid ticket as well as who qualify as kids.
2. The word “Name” on page #2 is confusing when the user buying the ticket is not the credit card holder. .
3. One user asks why he needs to enter an email address and the corresponding privacy policy.
4. One user asks the difference between a confirmation number and ticket number. And she is unsure how to proceed to enter the aquarium.
5. There is no need to show ticket once inside the aquarium.
...
| Wiki Markup |
|---|
{html}<div id="design8" class="hidable">{html} |
Observations/Usability issues:
1.The user suggests that it might be unnecessary to go to homescreen since she asks “Do I need to go back to home to find blue penguin?”
2. It’s unclear what “Find in map” button does. Does it show only the specie location or all the related event location?
3. After clicking on “Find in map” button, the map shows no tank number.
4. There are two ways of finding events. Either by searching animal or by clicking on “Map& Events”. It’s unclear if the two resulted maps will show the same events.
...
| Wiki Markup |
|---|
{html}<div id="design9" class="hidable">{html} |
Task 4 - Observations/Usability issues:
1. It’s unclear if users could search “red fish” and find the fish info.
2. The individual tank shown on the map does not seem clickable since the user does not know that they could click on the tank to show the information of the species in the tank.
3. What does the button “Map&Events” on page #7 does? The user is confused by this button since she gets to this page through that button on home screen.
...