Prototype
Screen 1 - Home screen This is the home screen of the app. It is simple and straight forward. It has the logo of Torch and two buttons for the user. The first one brings the user to screen 2 (the tour search screen), and the second one brings the user to screen 9 (the tour creation screen).
Screen 2 - This is the tour search screen. It is a map view, with a search field and two tabs at the top. The user starts in the "View Map" tab. The "view tours" button on the bottom starts out greyed out, and there is a bit of explanatory text to help the user.
Screen 3 - When the user selects a landmark it looks like this. A picture and the name of the landmark appears and there is an "add to tour" button. Touching this adds this landmark to the list of landmarks that definitely be in tour.
Screen 4 - Selected landmarks appear as highlighted pins. When at least one landmark is selected, the text at the bottom has changed, and the "view tours" button is clickable.
Screen 5 - This is the other tab of the search interface. It lists the landmarks you have selected. They can be easily removed from this screen using the "x" on each of them.
Screen 6 - Once the user selects "view tours" they see a list of all the tours that contain their selected landmarks. The list items can be selected to view more detail and be chosen as the tour to follow.
Screen 7 - This is the detail view of a tour. It lists the landmarks that are part of the tour and there is a "begin tour" button to start when the user is ready.
Screen 8 - This is the screen to follow a tour. It is a split screen with a path highlighted in the map on the top half, and the list of landmarks in the bottom half. Selecting one of them will pull up a third party app (wikipedia or yelp, likely) to give info about that landmark. The arrows in the middle step through the steps of the travel route.
Screen 9 - This is the create tour screen. It is a map view similar to the search for tours screen. The bottom has a "save tour" button, which is partially obscured in this image. Adding landmarks to the tour is done the same way are selecting this when searching for a tour.
Screen 10 - As landmarks are added to your tour, the path is automatically created.
Screen 11 - To edit the tour, you can go to list view to rearrange them (by dragging the textured area of the left of each list item) or delete them using the "x".
Screen 12 - This is the screen to save your new tour. The fields are all editable and then saving the tour adds it to the tour database.
Briefing
Torch is a mobile application designed to help users find and follow walking tours of notable landmarks and attractions. Users can also create and submit their own tours.
...
- Find a tour of MIT's campus.
- Follow a tour around MIT's campus.
- Make a tour of MIT's dorms that includes Baker, East Campus, and Burton-Conner.
Observations
(right now these are the direct notes; we need to analyze/summarize them)
Observations of Original Interface
The list below is a summary of our observations from user studies. For more information, view the paper prototyping notes that we took during the trials.
- User 1 Task 1: Find a tour
- The home screen was not confusing, users knew what they wanted to click on.
- When presented with a blank map, users were unsure what to do to find a tour.
- Users thought that selecting landmarks for a tour felt like building a new tour. It was unclear that they were choosing search criteria.
- It was not clear that users should switch tabs to remove landmarks from their criteria.
- The "View Tours" button should be greyed out to indicate that it is not enabled at the start
- Tapped on the general area of MIT, but there was no response
- Tapped "View Tasks", but there was no response
- Tapped on a landmark (Killian Court), and the info popped up
- Thought that he was searching for tours, but the text "Add Tours" makes it seems as if he was creating a tour
- Said there was not enough visibility on the original screen of what's in the database (i.e. display something on the map)
- Should grey out the "View Tour" button if it's not active If there's 1 tour with the landmarks chosen, should it go straight to the tour details instead of the list view?
- The "Begin Most users found the "Follow Tour" button is not visible (wanted to click on the landmarks to start the tour). Consider moving to the top?
- Keep scale in mind - will the list of landmarks be scrollable, etc.
- Why can't I start the tour where I am? Or at another place of my choosing?
- How can I reorder the landmarks on the tour?
- Thought the arrows would change the view to show different maps/tours
- There's a problem in the mental model of the arrows between left/right and up/down
- Maybe we should highlight the nearest landmark
- When do you click the arrow, there is no feedback in the list to show that it has advanced Maybe if you embed unique icons into the map, users would see a relationship between the list and the mapeasily, although one thought it should be more prominent
- Don't see any way to exit the current view, except the standard Android back button. Users don't like to use that if they're deep in an app
- Maybe add a "modify tour" button so users can just alter a pre-existing tour
- Take advantage of the mobile app - maybe allow the user to make a tour as they're walking around to each landmark
- Same "Add to Tour" text as when finding a tour, but a different effect - confusing
- Added landmarks to the tours in the wrong order, at first unsure how to reorder
- "If I want the tour to backtrack... how do I do that?"
- Liked the list interface for reordering the tour
- Consider combining the list and map views onto one page, although you may have to drag landmarks far (and that would be inconvenient if the screen was split)
- "I don't know estimated time", maybe we should provide distance/time/stops
- Also could provide distance/time/stops feedback on the screen as the user is building the tour
- Users remembered the "Create a tour" button on the home screen, and mostly knew to use the Android back button to get there. One user also wanted a virtual back button.
- Some users thought they might want to start with an existing tour and modify it, instead of starting a tour from scratch. Our application does not currently support that feature.
- One user added the landmarks in an inefficient order, but did not realize that the order you add the landmarks was also the tour order until the map drew the tour path. It was also not clear to the user to switch tabs in order to remove/reorder landmarks.
- The affordances on the landmarks in list view did communicate to the users that they could reorder the list.
- When adding a landmark that the users did not know the location of, it was clear to the users that they could search to find it.
- Some users felt that the list view and map view should be combined into one view, because they're so closely linked.
Observations of Revised Interface
The list below is a summary of our observations from user studies with a revised paper prototype. For more information, view the paper prototyping notes that we took during the trials.
- User 2 Task 1: Find a tour
- Users wanted to see a list version of all tours and have a way to filter that list, rather than start with the landmarks and then filter
- Users wanted to see routes shown/made based on user's location
- In the revised interface, users were not confused about how to find a tour, and they knew what to do
- At first, wanted to select an area on the map (by dragging an area with multitouch) to define where the tour was going to take place
- When that didn't work, tapped directly on map and added landmark to tour
- Didn't understand what "adding" a landmark to the tour did until he saw the help text
- Pressed "View Selected" to see what it did, realized that it was to edit what he had already selected
- Once the 1 tour was returned, he knew the arrow meant to click it to select it
- "All the things listed are in the tour" Wanted to remove things from the tour - it included landmarks he hadn't selected
- Task 2: Follow a tour
- Found Users found the "Follow Tour" button easily
- Clicked arrows immediately... didn't like the result, but he knew how to undo it
- Confused by what the arrows mean in general
- "I walk up to the Media Lab... what happens?" and knew what to do when following the tour (which was not the case before the revisions)
- Users felt that the tour should react to user's location and give directions based off of geolocations
- Users felt that there should be an easy way to modify tour once they had started following Wanted to see an arrow leading him to the start point of the tour
- Hit Users remembered the "BackCreate a tour" button repeatedly until he saw on the home screen
- Clicked on the landmarks he wanted to add, seemed familiar with the interface
- "I'm familiar with the campus so it's easy to locate" landmarks
- Very averse to typing or using voice to search, would much rather click on places
- "This isn't the shortest path", tried to drag the path to modify it
- Saw the "Save Tour" button when he wanted it, and clicked it
- It might make sense to put the map/list view on the same page
- Task 1: Find a tour
- Clicked "Find a Tour"
- Initially looked at the map a long time, looked unsure what to do
- Later commented "I was hoping to see landmarks to choose from"
- After selecting two landmarks, he hit "Find Tour"
- We asked him what he expected to see, he said he expected to see a list of tours that include those two locations (help text probably assisted on that one)
- Task 2: Follow a tour
- Found and clicked "Begin Tour" immediately
- Expected a path from current location to the beginning of the tour, or "wherever I'm supposed to go"
- Touched the Killian Court list item because he wanted to go there, did not have the expected effect
- "I walk to Killian... then I follow the path to Kresge"
- Only interested in the landmarks he chose, did not want to have to stop at the others
- "I would expect it to tell me where to go" (as in specific instructions)
- Not sure what the arrows are, maybe there are more/other landmarks to look at
- You could also show other interesting stuff on the way to a landmark, and show more info about the landmark when you get close to it
- Task 3: Create a tour
- "Keep hitting back until I see the home screen"
- Didn't know where Burton-Conner was, but he knew to search for it
- We asked what he would do if he wanted to change the order, he said he would try to drag the path, or look to the bottom for an "edit" button next to "savE"
- When he went to the list view, he realized he could drag the order around
Prototype Iteration
(we need to do this)
To Do
- , and mostly knew to use the Android back button to get there.
- Users, however, thought it might be useful to have a quick button to get to home from other screens
- Users wanted to add custom locations
- Users wanted to take already known landmarks and add their own descriptions
- Users asked if there was an easy way to detail the expected spent time at each stop when creating a tour
- , and mostly knew to use the Android back button to get there.
Prototype Iteration
First Round Changes
- Screen #2 - Changed text next to "View Tours" button from directions to a display of the number of locations selected and the number of tours that contain those selections.
- Accomplishes the goal of letting users know the purpose of selecting landmarks from the map in a more efficient manner by providing useful information and eliminating the need for explicit instructions
- Screen #2 - Populate the map with all the available landmarks.
- Users now have the ability to see what landmarks are available and no longer have to guess places on the map.
- Screen #8 - Removed the arrows intended to move forward/backward between steps in the directions. User can now select which location they wish to go to by selecting it from the list.
- Arrows were confusing for users and did not provide that much benefit. This change accomplishes the same task in a more intuitive manner.
Second Round Changes
- Screen #3 - Changed button to "Select for Tour."
- "Add to Tour" was giving users the wrong message. This new wording points them in the right direction.
- Screen #3 - Add "Average Time Spent Here" to pop-up info when landmarks are clicked.
- Useful information for users.
- Screen #7 - Added a "Modify Tour" button that takes users to the create tour area with the selected tour's landmarks already in place.
- Allows users to modify preexisting tours (add desired landmarks, remove unwanted landmarks, reorder landmarks) without having to create a new tour from scratch.
- Screen #8 - Added and "Edit" button that allows users to reorder the landmarks in the tour.
- Feature for users that do not wish to follow the landmarks in the predetermined order. Useful if starting location is far from the start of the tour
...