Paper Prototyping
Prototype photos:
The photographs below show the first iteration of the paper prototype. The prototype aims to test the interface for the following:
From Arjun (a parent back home who want to get an immersive visual experience of his son's stories)'s perspective
- ability to understand the interface in order to use it for making/receiving calls
- intuitively switch between different modes of location exploration
- view/post comments
- view shared tweets/posts/images etc..
From Raj (a professional who wants to communicate his experience to his parents)'s perspective:
- ability to understand the interface in order to use it for making/receiving calls
- view/post comments
- ability to guide parents in exploring location
- ability to share tweets/posts/images
|
|
|
 |
 |
 |
Main Screen
- Raj sees all his contacts with photos
- Hovering/Arrow gives call/text options
- Clicking on the photo by default starts a new call
|
Screen showing an incoming call (for Arjun).
- Name/Profile Photo shown (Raj is calling)
- Ability to accept/decline
|
Conversation Starts (In conversation View):
- In conversation
- Raj starts talking about MIT Charles river
- Raj is sharing the location to Arjun
- Arjun gets this prompt
|
 |
 |
 |
Interface for viewing the location.
- Arjun has clicked OK and views this location
- This is interactive 3-D view (see Navigation Control below)
- Arjun starts navigating by changing camera angle, height etc.
- He also sees comments (if Raj has put any)
|
Interface for adding a comment to a location.
- Raj wants to describe some specific things
- He can put comments and point it (like Entrance to MIT).
- When Arjun views/explores/navigates the location, he sees it.
- Arjun too can add comments.
|
Interface for viewing the notes.
- Arjun sees all the notes whenever he navigates the location
- (realtime as well as offline)
|
 |
 |
 |
Interface with multiple notes.
- '#' on a sticky note as an indicator of comments
- It can be expanded by clicking
|
Screen for viewing the tweets and links to the available
articles and maps.
- Raj has connect his twitter account with teleport
- Arjun can now see all Raj's tweets
- One of Raj's tweet is about Yosemite National Park
- Interface automatically suggests Arjun
- if he wants to see Yosemite National Park pictures
- or articles related to this location
|
Safety prompt window asking for a confirmation to change the viewing
mode.
- Arjun has clicked on pictures
- A prompt window to ensure that it wasn't an accidental click
- because it will change the mode
- user might get lost if we didn't ask the prompt.
|
 |
Image viewer.
- An efficient interface for picture navigation
- a preview below (thumbnail view)
- clicking on the preview shows the image in the actual window
|
Briefing:
from Arjun's perspective:
Purpose of application: parents and friends can recreate narratives of the stories their loved ones tell.
- You are a father named Arjun.
- Your son is Raj, a college student at MIT in Cambridge, MA.
- You are to talk to Raj and would really like to visually recreate the stories that Raj tells you.
- You will be using your home desktop computer to talk to Raj.
- You will use a system called Teleport that allows you to visually explore spatial locations as well as look through images and tweets that Raj uploaded.
from Raj's perspective:
Purpose of application: parents and friends can recreate narratives of the stories their loved ones tell.
- You are a son named Raj, studying at MIT.
- Your father is Arjun lives in India.
- You are to talk to Arjun and would really like to communicate your experience of living abroad.
- You will be using your home desktop computer to talk to Arjun.
- You will use a system called Teleport that allows you to store and share your experiences.
Scenario Tasks:
Task 1:
Raj wants to show you where he goes jogging. Accept the call and view the comment that Raj made.
Task 2:
You want to show Arjun Charles River and add a comment.
Task 3:
You want to find out more about Yosemite Park. Check if Raj added pictures or tweets and look through them.
User testing observations (Round 1):
User 1:
Observations
- User ignored panning and altitude controls.
- Navigate icon was mistaken for a button.
- When looking through tweets the user tried clicking on the text to view additional information rather than using the text input box.
- User ignored aggregation panels: map, articles.
Feedback
- Was not obvious how to exit a mode.
- Found the voice transcription natural in the context of application though generally the user does not like it.
- Got irritated with the pop up window.
- Suggested that direct manipulation with a mouse would seem more natural than using the provided controls.
User 2:
Observations
- Likes exploring the interface, testing different navigation controls.
- Had difficulty finding how to move from the image viewing mode to reading tweets mode.
- Does not move directly to address the task but takes extra steps to explore the interface. For instance instead of directly viewing the location, goes to the tweets tab first.
Feedback
- Suggested it would be easier if mode change buttons were located within the main active window, not only from the bar above.
- No option to decline an invitation to view a comment. Interface becomes overcrowded with small windows.
User 3:
Observations
- Confuses navigate symbol for a button (bad internal consistency).
- Likes navigating, using different control buttons.
- No feedback that message has been saved. When adding a comment is concerned if the comment was saved or not.
- Easily finds exit buttons.
Feedback
- Wished there were smoother transitions between high-level and low-level navigation.
For instance, when taking a street view low-level navigation seems more natural. However, our interface provides only high-level mode change controls.
- When hitting exit would like to see a confirmation that the comments added have been saved.
- Suggested that dragging with a mouse when exploring the street view would feel more natural than using some of the buttons we provided.
Feedback summary
Inconsistency with expectations:
- Users ignored panning and altitude controls.
- Some description elements mistaken for buttons.
- Modal navigation in top panel not clear.
- Users ignored aggregation panels: map, articles.
- No feedback that message has been saved.
Consistency with expectations:
- Users found it easy to receive and accept calls.
- Took the time to explore locations in the google earth mode.
- Gave positive feedback about being able to interactively view the location, while talking.
Prototype iteration:
When testing the first prototype which combines high and low-level navigation styles we found that once in a low-level navigation mode users found it difficult to switch back to high-level navigation style. Our second prototype aims to provide more accessible low-navigation control for the three exploration modes: google earth view, images and tweets. Additionally, the second prototype removes internal inconsitencies between labels and buttons; adds safety pop up windows to facilitate adding/saving messages and exiting modes; minimises the number of icons and controls. Although we did not encounter issues with the interface being overcrowded, knowing that our targeted user group is mainly elderly we want to maximise the easy of navigation by minimising cognitive load.
Changes for Round 2:
- Labels look significantly different from buttons.
- A high visibility save button added to the type comments window for saving input.
- A pop-up window asking "Would you like to save your comment?" appears when user attempts to exit the comments mode.
- Low-level controls for switching between modes are added to the main active window.
- The left panel showing contacts and history is collapsed when user enters an exploration mode. The panel can be expanded by clicking an icon in the top left corner. The motivation behind this addition is to reduce cognitive load and maximise exploration area.
User testing observations (Round 2):
User 1:
Observations
Feedback
User 2:
Observations
Feedback
User 3:
Observations
Feedback
Issues to consider/resolve before moving forward: