R3 - Paper Prototyping
Prototype Photos
...
Briefing
Discover.Me is a mobile phone application which we are developing. Its aim is to allow a user, such as yourself, to be able to find and locate an approved list of friends so as to be able to be up-to-date with their real-time location. The application will subsequently allow you to, based on the proximity of you and your friends, quickly and easily create an event; specify its time and select a location from the suggested list created by app based on your preference, and send invitations out to friends whom you'd like to meet with. The application will thus allow all participants to have a better knowledge about the geographical location of the event and facilities available over there, as well as easily view who the invitees and what their responses are (i.e. are they coming or not). Ultimately, we aim to make spontaneous, closely-located based events amongst friends fast to create, easy to disseminate and clear to invitees what the responses are.
Scenario Tasks
Finding a friend in your friend's list | Adding a friend to your friend list | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change In Time | Responding to an Invitation by Proposing a Change in Location |
---|---|---|---|---|
Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are Zoey, currently using Discover.Me. | Imagine that you are Zoey, currently using Discover.Me. |
Observations
Prototyping Round #1
| | | | |
| | | | |
| | | | |
Briefing
Discover.Me is a mobile phone application which we are developing. Its aim is to allow a user, such as yourself, to be able to find and locate an approved list of friends so as to be able to be up-to-date with their real-time location. The application will subsequently allow you to, based on the proximity of you and your friends, quickly and easily create an event; specify its time and select a location from the suggested list created by app based on your preference, and send invitations out to friends whom you'd like to meet with. The application will thus allow all participants to have a better knowledge about the geographical location of the event and facilities available over there, as well as easily view who the invitees and what their responses are (i.e. are they coming or not). Ultimately, we aim to make spontaneous, closely-located based events amongst friends fast to create, easy to disseminate and clear to invitees what the responses are.
Scenario Tasks
Finding a friend in your friend's list | Adding a friend to your friend list | Creating and Inviting Friends to an Event | Creating and Inviting Friends to a Closed Event (With Application Suggesting Locations) | Responding to an Invitation by Proposing a Change In Time | Responding to an Invitation by Proposing a Change in Location |
---|---|---|---|---|---|
Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are an individual named Alice, currently using Discover.Me. | Imagine that you are Zoey, currently using Discover.Me. | Imagine that you are Zoey, currently using Discover.Me. |
Observations
Prototyping Round #1
Overview of Usability Issues Observed
Finding a Friend in your Friend List | Adding an Individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change In Time | Responding to an Invitation by Proposing a Change in Location | General Comments |
---|---|---|---|---|---|
Users had trouble identifying the Action Bar icons as buttons, indicating a lack of affordances indicating that they were indeed buttons. Users were distracted by other buttons on the action bar and search bar, which surprised the user. This may have increased the time required by our user to make the correct selection. | Users wanted a shorter process for adding one or more friends. They found the disabled buttons on the "Add a friend" window to be distracting, even though they were place there to maintain consistency. Users remarked that "Show on map" presented an ambiguous meaning, indicating a lack of exerternal consistency, and likely that the user possessed a different conceptual model of what the application would do versus what they expected it to do. (i.e. Does it show a person's office location or their current location?) Users were surprised +when the application repeatedly returned to the home page. Users also suggested that the search feature should provide a better cue of its functionality, perhaps by presenting more +information scent as to how they ought to perform the query (i.e. search by name? or search by MIT username? or does it search all substrings and returns a set of possible candidates). In particular, they were unsure whether the search feature looked for a location or a person. | Due to the hand-drawn nature of the fields and buttons, users exhibited apprehension and some confusion about the affordances provided by them. In particular, some users preferred tapping on the fields, while others preferred tapping on the icons which were positioned at the right-most edge of the fields. The lack of hotspots contributed to this. Users also felt that there was too much detail to be entered when creating an event, indicating that it might become an efficiency issue should they end up using the system on a frequent basis. For example, the time zone and meeting end time are unnecessary for initiating an impromptu meeting. Users also found it difficult to update events, which indicates that our application UI lacks robustness to support slight user tweaks. | Users were surprised to receive another confirmation box after sending an RSVP. They also found that the event details page lacked any visual cues as to how to begin proposing changes to the various entries. As a result, users erroneously closed the window and began searching for another way to begin proposing changes in response to the event invitation, posing a safety error. | Users were not presented this task. | The system can be intuitive at times, but forces the user to make extra clicks. There is further ambiguity about the functionality of certain features, such as the back and close search bars. Users searching for friend names wanted to know the level of detail applied in the search feature. For example, this additional knowledge would help them in deciding whether to search for a friend by their nickname or email address. |
Detailed Observations
User | Finding a friend in your Friend List | Adding an individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change in Time | Responding to an Invitation by Proposing a Change in Location | User's General Comments | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
1 |
|
|
| ||||||||||||
User | Finding a friend in your Friend List | Adding an individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change in Time | Responding to an Invitation by Proposing a Change in Location | User's General Comments | |||||||||
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="f44a07d0-8440-474c-bd01-f7ec3bee07b6"><ac:plain-text-body><![CDATA[ | 1 |
|
|
| User was not presented this task. | User was not presented this task. |
| ||||||||
2 | |||||||||||||||
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="b068c8a8-596c-4237-87c9-fe2920e4bc90"><ac:plain-text-body><![CDATA[ | 2 |
|
|
| User was not presented this task. | User was not presented this task. |
| ||||||||
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="5a68e31a-76ae-4907-8dec-d8cdb1ed90ad"><ac:plain-text-body><![CDATA[ | 3 |
|
|
|
| User was not presented this task. |
|
Prototyping Round #2
User | Finding a friend in your Friend List | Adding an individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change in Time | Responding to an Invitation by Proposing a Change in Location | General Comments | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="46a25d9b-f384-45c0-8d88-4e331a340ae3"><ac:plain-text-body><![CDATA[ | 1 |
|
|
|
| User was not presented this task. |
| ||||||||
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="95ab26a8-7592-45f8-978b-5c8efba5871c"><ac:plain-text-body><![CDATA[ | 2 |
|
|
| User was not presented this task. |
|
| ||||||||
<ac:structured-macro ac:name="unmigrated-wiki-markup" ac:schema-version="1" ac:macro-id="67fb27d0-d3a3-4a45-929b-c15b24d25fb2"><ac:plain-text-body><![CDATA[ | 3 |
|
|
| User was not presented this task. |
|
|
Prototype Iteration
Prototype iteration
|
|
| User was not presented this task. | User was not presented this task. |
| |
3 |
|
|
|
| User was not presented this task. |
|
Prototyping Round #2
Overview of Usability Issues Observed
Finding a Friend in your Friend List | Adding an Individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change In Time | Responding to an Invitation by Proposing a Change in Location | General Comments |
---|---|---|---|---|---|
Users were able to identify the icons used in the Action Bar much better, due to the improved affordances provided by the images used, which resembled real-world buttons. | Users found the procedure to be intuitive. They also found it easy to complete the work flow by making selections on several consecutive pages. However, users were briefly confused when the application returned to the home page. They had expected some visual indicator in response to their selection, indicating a lack of feedback to confirm that the Add request was indeed sent. | The Notifications Icon in the Action Bar bore resemblance to speech bubbles, which made users think erroneously that it should be the way to "respond" to an event invitation. This indicated a lack of external consistency of the icon used. Users, however, would identify the Calendar Icon and correctly associate it with anything related to Events. Otherwise, the work flow was intuitive and enabled the user to complete all tasks. Some users indicated that more information could be provided by the application in helping them make a decision for selecting a location, for example, they wanted to know the distance between two locations marked on the map. | Users quickly understood how to respond to invitations, indicating good learnability. However, some users felt the UI was too simple. In particular, making the "Accept without changes" button available even after use made resulting changes prone to error. | The map feature lacked appropriate affordances, making it unclear how to change the selected location. Some users attempted to drag the pin to change location, while some tried to click on different location. These were a result of unclear affordances of the static images on the paper prototype. Others tried tried tapping on the name. | Users liked the ability to visualize their friends' location when creating new events. |
Detailed Observations
User | Finding a friend in your Friend List | Adding an individual into your Friend List | Creating and Inviting Friends to an Event | Responding to an Invitation by Proposing a Change in Time | Responding to an Invitation by Proposing a Change in Location | General Comments |
---|---|---|---|---|---|---|
1 |
|
|
|
| User was not presented this task. |
|
2 |
|
|
| User was not presented this task. |
|
|
3 |
|
|
| User was not presented this task. |
|
|
Prototyping Round #3
Overview of Usability Issues Observed
Finding a Friend in your Friend List | Adding an Individual into your Friend List | Creating and Inviting Friends to a Closed Event (With Application Suggesting Locations) | Responding to an Invitation by Proposing a Change in Location |
---|---|---|---|
Users no longer had problems identifying the top row of buttons as buttons they should be tapping on to launch sub-menus, indicating that they were providing better affordances as buttons. Users also were drawn to the search bar in order to identify if a friend was currently present in the Friend List. The idea that the search bar should be used to look for someone, and not simply check the Friend List indicated that the users had a different conceptual model as to how the system should be used. Some wanted the menu icons to perhaps have text, or better information scent, to make them confident that they were going into the right menu. The icons used were generally recognized as "Friends", "Calendar" and "Conversation", indicating that there was some external consistency in their usage. As a result, most users learnt by doing/exploring. | Most users had no difficulty identifying the "plus"-icon being the button that had to be used in order to begin adding a new friend. Their familiarity with the flow and usage of the menu indicated good internal and external consistency. | While some users made use of the suggested locations for the meetings, some preferred to specify their own locations, and were unsure of whether the system would support their actions, indicating a lack of affordance, and confusing the user. | Users found the instructions on the menu useful in accomplishing their tasks, though they did spend time reading it. We suspect that expert users will not experience the same lack of efficiency. Some were unsure about the behavior that would occur in order to propose a change to the event location, but were assured when they found the word "Propose" used. The "Revert Change" button being greyed out confused some users, and one user commented that changing it to "Undo" might be clearer, indicating a slight lack in external consistency, because we were not speaking the user's language. |
Detailed Observations
User | Finding a friend in your Friend List | Adding an individual into your Friend List | Creating and Inviting Friends to a Closed Event (With Application Suggesting Locations) | Responding to an Invitation by Proposing a Change in Location | General Comments |
---|---|---|---|---|---|
1 |
|
|
|
|
|
2 |
|
|
|
|
|
3 |
|
|
|
|
|
4 |
|
|
|
|
|
Prototype Iteration
Design | First Iteration | Second Iteration | Third Iteration | |||
---|---|---|---|---|---|---|
Action Bar Icons/buttons on home page | Action bar contains icons for Friends, Events and Notifications. these Icons are of the same color as action bar but in darker shade and are outlined. | Action Icons are replaced by prominent and easy to locate buttons. | Action bar design retained from the previous iteration. | |||
Default text Search bars to provide cue on what to search. | Search bar is location on the top of following pages:
| Search bars now contains a Cue about what can be searched e.g. | Default text retained from the previous iteration design. | |||
Confirmation Dialogue/ Message | A Confirmation Dialogue window appears after these three user actions:
| A Confirmation message appears for a short duration and fades away. | Retained from the previous design iteration. | |||
Completing a task takes user back to ... ? | Completing a task such as "Adding a friend" or "Creating an event" or "Checking notification and accepting/declining an invitation" takes a user back to home page. | Completing a task takes user back to the relevant pop up menu. | Retained from the previous iteration. | |||
Event page | Contains fields for data entry for:
| Simplified and now contains fewer data entry fields.
| A new options is added, to specify if the event is closed or not. | |||
Setting time of Event | Time is by default set to one hour later and can be changed using the numeric keypad | Taping on "Start Time" field displays a Ticker. | Start time is by default set to one hour later, and has the affordance of a click/tap, and when tapped will bring up the ticker. | |||
Time zone in Create Event page. | For consistency with other smart phone application "Time zone" field is there in "Create Event" page. It is by default set the user's current time zone and is un-editable. | Time zone field is dropped | Time zone field is dropped | |||
Setting location of Event. | Location can be typed in or selected on map | Location can only be selected on map. | The "Location" field in "Create event" page has affordance of tapping, and tapping it will bring out the map view. this map contains a point for all the friends listed in "Participants" field and 3 pins drops from the top on suggested buildings. | |||
RSVP work flow - View Event Details and Send RSVP | A button on View Event Details page takes user to a separate Send RSVP page. which then contains three options "Accept" "Decline" "propose Changes". | Event details and RSVP response buttons are on the same simplified page. | Page design retained from the previous iteration. | |||
Design | First Iteration | Second Iteration | Third Iteration (?) | |||
Action Icons/buttons on home page | Action icons were of the same color as action bar but in darker shade | Action icons are replaced by prominent and easy to locate buttons | Actions buttons are retained | |||
Extra buttons on home page | Extra buttons did not have any functionality attached to them at that time. | These buttons were removed. | in the "select location" page inside "create event" work flow now has a button on top right corner labeled "filter". | |||
search bar on home page | The search bar on is empty has a search button and a span button. | Search button is removed. the bar now performs incremental adaptive search. | retained from the previous iteration. | |||
help text as default text in search fields of | All the search bars had "Search" as their fragile default text. | the new fragile default texts are Home Page Search bar "Search for Friend by Name" | default texts retained from earlier iteration. | |||
close buttons on pop up opened on tapping the action buttons | Pop up menu can be closed by tapping the same button that was used to open it. | Pop can also be closed using the "x" button on top left corner of the pop up menu. | retained from earlier design. | |||
Confirmation dialog after adding a friend | a Dialogue box pops up when user adds a friend, asking whether they are sure or not. | Confirmation box is dropped. | retained from the earlier design. | |||
adding a friend takes you back to home page or search for a new person to add page ? | takes you pack to home page. | takes you back to search for a new friend page | takes you back to friend list | |||
event page | more fields for data entry | simplified | closed /open event option added | |||
setting time of event | time was automatically inserted, adn could be change using the numeric keypad | ticker was introduced, end time is set by default to one hour after the start time | ticker retained, but now it has a button "done" which when pressed will hide the ticker. | |||
time zone |
| dropped | dropped | |||
setting location | location can be typed or selected on map | location can only be selected on map showing all the invited friends | user can important considerations in selecting the location. app will highlight the suggested buildings on map. user can tap on building to see the details of meeting place options available in that building in a list sorted on the bases of facilities selected by user as important considerations. user can also browse through the un-highlighted buildings on the map check what facilities are available there. user can then select a meeting place and confirm to set it as "event location" | |||
rsvp confirmation page | contains 2 buttons "accept" "decline"confirmation box is omitted | confirmation box is omitted | rsvp page | contains event details only | contains event details and rsvp responses on the same simplified page | response page is simplified and affordances showing that user can edit event details and propose changes are added. |