SWAY
SUMMER 2018

small path winding through a forest

Interactions

Walks through user flows for scanning groves and finding hammock spots. Includes prototyping prep.

IN THIS SECTION

• Interaction Explorations
• Tap Spots
• Drag Objects
• Draw Line

• Find a Spot Flow
• Hammock Profile
• Prototype & Testing
• Participate

Interaction Explorations

There are multiple ways to get a virtual object to appear on screen, even before considering AR marker vs markerless implementation options. Some of those options include: 

• Drag object around screen until it fits into a place 
  
• Draw hammock line gestures on screen
• Tap trees where hammock spots appear
  

QUICK INTERACTION #1

Tap Spots

Tap on trees where hammock spots appear. User can walk through AR hammock lines.

• Trees with hang spots are highlighted
• User taps on a spot through the screen
• Sees connecting lines to other spots on trees
• Taps a line to see the details of that hang

PRO: Visibility in hammock spot options. Minimal gestures.

CON: Options are limited to spots the system finds.

KEEP: Selecting interaction for wireframes and prototyping.

QUICK INTERACTION #2

Drag Object

Drag a hammock-like object around the screen and drop it into place.

• Place hammock on screen
• Move hammock around 
• App highlights potential spots
• User places hammock in that spot to see details
  

PRO: Ability to scrub across an area to see spot potentials. 

CON: Increases need for content and assets. Forces the user to spatially assess the scene before making a decision.

DISCARDED: Lack of transparency in hang spot options and increased user movement.

QUICK INTERACTION #3

Draw Line

Draw a line from any point to another on the screen to see if a hammock will fit there.

• User drags their finger from one tree to another
• If they can hang in that spot, system provides positive feedback
  
• If they can't hang in that spot, system provides negative feedback
  

PRO: User has control of choosing potential spots.

CON: Requires too much trial and error to find a hang spot. 

DISCARDED: For difficult usability. Not a comfortable angle to hold phone and draw.

Spots

FLOW & SCREENS

Hammock Spots

This case defines the task of scanning a forested area for ideal tree matches, selecting a hammock line, and sending a hazard report. 

SCAN SCENARIOS

On a scan of the environment for hammock spots, a user may encounter any of the following scenarios:

• Finds spots, but no hazards
• Finds hazards, but no spots
• Doesn't find spots or hazards
• Finds spots and hazards

The scan scenario modeled in the following flow diagram includes finding spots and hazards.

MULTIPLE SCANS

Multiple scans of an area can be connected and mapped together. Requires user to allow GPS on their phone.

Start Scan

Lets the user know they are entering AR mode, and to be aware of their surroundings. Asks them to please be still while scanning, and app scans best in landscape mode.

• Trigger: Button
• User Action: User taps on button
• Response: Modal screen fades to real scene behind it

Tree Mapping

App begins scan of environment for applicable hammock spots.

• Trigger: Visual feedback
  
• User Action: User stands still in the middle of the woods
  
• Response: Visual feedback to user that scanning is happening

SCAN EXPECTATIONS

We want to let the user know what is happening during their scan, but too much detail isn’t useful.

Explore

Scan is complete and user can walk around the scene and view hang spots. Shows hazard alerts for trees that may not be safe.

• Trigger: Informs user scan is done
  
• User Action: User can select hang points from the app
  
• Response: Hang spots and hazards are visible and superimposed over scanned area

Tap from Point to Point

• Trigger: A hang spot is selected
  
• User Action: Taps on the hang point of another tree in the scene
  
• Response: Sees the connections being recalculated for the new tree

Multiple Spots on a Tree

User taps on a tree that contains multiple hang points overlapping one another. It is not uncommon for a single tree to be an anchor for multiple hangs, all within the same height range. When the crowded spot is selected, it is effectively selecting the tree itself, all hammock lines connected to that tree are highlighted.

• Trigger: Hang point affordance
• User Action: User taps on crowded hang point
• Response: Multiple hammock lines, originating from selected tree, are drawn to their corresponding hang points on other trees
  

Tap on a Hammock Line

User taps on a hammock line. Any other lines fade. Detailed measurements are visible for selected line.

• Trigger: Hammock line affordance
• User Action: User taps on hammock line
• Response: App displays measurements that overlay onto the tree trunk of a selected tree, showing precisely where to place straps and at what angle.

Visible measurements on line selection include hang point, distance between trees, hang angle, and tension. 

Tap Anywhere to Explore

When the user taps anywhere on the screen that isn’t an affordance, the scene returns to exploration view, with all hang spots and hazards in neutral.
 

Guided Overlay

Selected lines remain overlayed in a fixed postion allowing users to hang their straps and view through the app to check accuracy.

• Trigger: Real hammock straps
• User Action: User views hang point up close
• Response: Hammock line remains constant as a reference point

Report Hazards

App shows damage alerts for trees that may not be safe to hang from. Includes hollow spots and cracks. User can send report to tree database and, optionally, local park management.

Allowing users to report hazards instead of having hazards logged automatically aims to solve for two issues. First, it presents the user with a responsibility to the trees, and gives them a small task to perform, a helpful action for the environment. Secondly, reporting hazards allows for a human assessment of the potential hazard, reducing false positives, and helping train the system on hazard tracking.

• Trigger: Hazard icon appears, overlaying real one in the scene
• User Action: User can tap on hazard from the screen
• Response: Modal appears with information about the hazard, and allows user to share this hazard to database.

AR Menu

From here, users can edit their hammock model, toggle measurement view, or view their trip history. Hammock profile information can change for each trip, the contextual menu offers a quick way to adjust hammock length and sit height.

FLOW & SCREENS

Find Hammock Spots

Profile

FLOW & SCREENS

Hammock Profile

Holds the user’s hammock model and account details. Allows them to set their hammock length, strap length, base weight, and sit height.

Testing

prototype

Prototype and Testing

Wireframes are useful as a birds-eye-view of a system, and as a reference document for states and flows. Though, as testing and development proceed, wireframes can quickly fall out of sync with the evolving design.

For user testing an augmented reality experience, marker-based prototypes are quick and effective, even if the final product is markerless.

USER TESTING PLAN

This test focuses on the core functionality of the app: selecting hammock spots.

Prep a grove with AR markers, each attached to the trunk of a tree as a representation of a hang point. Users will be provided with a mobile prototype on their phones that is set to scan any markers that match their hammock model.

RESEARCH FOCUS

• How comfortable are users with AR in general?
• Observer how users move around a grove
• When do users choose to scan trees?
• What are their internal and external motivations?
  

NEXT STEPS

• Target Participants
• Testing Requirements
• Preparation
• Post-Interviews
• Prototype Requirements

NEXT

Conservation

ecosystem overview, leverage points, and behaviors