Ecotour

Ecotour is an interactive, award-winning mobile app that helps people understand climate change within their local community. The app guides visitors on a walking tour through Paynes Prairie State Park and uses augmented reality to identify ecological threats, analyze historical events, and evaluate sustainability efforts. As a result, the app helps people make decisions about local environmental actions. To see the finished product, please visit Ecotourapp.com. 

Role: Lead Designer, Grant Writer, Instructor

Responsibilities: Research, Analysis, Storyboarding, Information Architecture, LX Design, eLearning Development, Prototyping, Grant Writing, Narration, Graphic Design, User Testing, Evaluation

Target Audience: Visitors to Payne's Prairie State Park

Tools Used: Adobe Illustrator, Photoshop, Premier Pro, HP Reveal, Unity/Vuforia

Approach

Bob.jpg
Friends of PP.png
BLUE+LOGO.png

Visitors come to Paynes Prairie from all over the world and with varying degrees of technical skill. Thus, the app interface is clear and simple. Minimalistic design helps users clearly identify augmented reality points of interest and breaks up information by geographic location. Since the AR components are primarily images/video, the navigation avoids images and instead uses large text with clear instructions to tap, swipe, or use the camera. The app provides users simple ways to navigate the area while minimizing distractions.  

 

Ecotour began as prototype at the University of Florida and then was fully developed in partnership with the Alachua County Conservation Trust, Friends of Paynes Prairie, and the Bob Graham Center for Public Service.

CONTEXT

Climate change is a big issue. People have a hard time understanding what they can do on a local level to impact their community. I decided to build a learning solution that would help people become more environmentally literate, bridging the gap between local ecology and the large-scale issues of climate change. 

PROBLEM

People often learn about environmental issues out of context - or at least off site. Pollution, flooding, and a host of other environmental issues become a set of facts rather than relatable actions. In addition, environmental learning tools tend to focus on grand narratives instead of local analysis and problem-solving.

RESULT

Instead of a desktop module, I created an immersive elearning experience that engages users with their surrounding environment - an educational mobile app that works in local spaces. Ecotour transforms learning about science, history, geography, and even social justice into a different kind of "fieldwork."

 

Ecotour started as an environmental literacy idea, was funded by the Bob Graham Center for Public Service, prototyped as part of a writing and technology course I was teaching at the University of Florida, and was fully developed by myself and a group of four designers. Ecotour is now available at Paynes Prairie State Park through the Park Ranger Station and Friends of Paynes Prairie. We are continuing to collect data from users to update the app or add new points of interest. At the University of Florida, the Ecotour project was also adapted by four additional courses to help teach design, writing, and environmental communication. 

 

Since the project involved making a mobile app while teaching others how to make a mobile app, Ecotour offers a unique example of learning experience design as well as instructional methods. The following sections detail the app from concept to completion.

Design Process

Research

  • Paynes Prairie State Park (the land, locals, and visitors)

  • Consult with local biologists, engineers

  • Analysis of environmental threats

  • Audit of information available at the park

  • Assessment of the physical space (boardwalks, paths, structures, signs, walkways, access points)

I began my research by consulting with local biologists, hydrologists, park rangers, engineers, and archives.

 

To understand the target audience, I conducted numerous site visits, interviewed people within the park, and analyzed the current signage and available resources. With a team, I collected drone footage of the area and evaluated information featured at Paynes compared to other nature preserves or sanctuaries.

Ecotour was also the final project for a course I was teaching at the University of Florida (How We Make). I began to work with teams of students, showing them how to research, conduct site visits, analyze data, determine knowledge gaps, and draft designs for a mobile app. We discussed experiential learning and how constructivist approaches help learners transfer and apply knowledge. Together, we designed and prototyped Ecotour over the course of six weeks.

Instructional Design

  • Develop learning goals

  • Map the learning environment

  • Identify trigger points and overlays

  • Sequence activities to build skills

  • Refine interaction patterns

  • Create recognizable icons

  • Design multimedia components

I began the design process by identifying the instructional goals: to help learners define local environmental issues and to evaluate how to take action. Since I was also teaching learning design, I decided to create learning goals with my students to focus the design phase of the project:  

  1. Identify environmental threats to the Alachua area

  2. Show how threats have changed over time

  3. Critique how history erases marginalized voices

  4. Define how local threats connect to larger environmental and social justice issues

  5. Connect learners to local action initiatives

We used our existing research to write content and design the look and feel of the mobile app - including how the app would use augmented reality technologies to integrate and respond to signs within the park. Learners would use the camera to trigger AR content. 

 

The tour was broken down into 15 modules, each a specific augmentation or "point of interest" that users would walk to and access in the park space. Points of interest included information about animals, plants, water runoff, indigenous peoples, human development, and current conservation efforts. Modules included audio, video, game, and evaluation elements.

LX Design

  • Storyboard/Sketches

  • UX/UI assessment

  • Accessibility testing

  • Build feedback mechanisms

  • Refine interaction patterns

  • Affective and Psychomotor evaluation

Seeing Experiencing is Believing.

 

More than merely interacting with a screen, I created a learning experience with an environment. Designs emphasized how learners interact with content in the field. Drafts considered the size of device screens, listening to audio outside, where sunlight might create screen glare, how visitors move along the walkways, where people might stop, the sequencing of activities (both in the app and in the physical space), how people might orient the screen, and the most accessible colors and fonts. ​I then focused on feedback mechanisms, and how we could address the needs of a diverse audience.

Students created storyboards and sketches and we discussed visual communication and interaction patterns in mobile design. Through drafts and wireframes, we decided on a central layout that would reduce distraction, minimize cognitive load, and create visual consistency.

 

Each learning module had image and text components with interactive camera orientations to trigger augmented reality pop ups. Within the 15 learning modules, we also sequenced in five videos with narration and three game activities that allow learners to practice identifying and responding to environmental issues.

Screen Shot 2020-06-23 at 2.40.02 AM.png
scuplt%20play_edited.png

Each activity was built using scaffolding techniques: learners begin with a step-by-step guide through the environmental issues, next they practice identifying issues with extrinsic feedback, and then on their own. After each activity, learners link to additional resources and local initiatives creating sustainable change. 

Finally, we added a children's tour module and linking "Kid's Corner" website so that younger visitors to the park could engage activities and participate in an animal scavenger hunt.

See ya later revised.png
Kids Corner.png
Field trip 2.png

The children's tour includes fours animated character guides (Billy the Butterfly, Hannah the Horse, Betsy the Bison, and Albert the Alligator) as well as links to lesson plans that help teachers integrate the tour into existing curriculum.

 

All activities within the children's tour add learning objectives that adhere to the K-5 standards for Florida state schools. The visual design remains consistent, but reduces text, moves phone triggers to kid height, and adds more colorful images and interactive elements like tapping/swiping to keep kids engaged.

Development

  • Prototype in Aurasma and HP Reveal

  • User test

  • Refine design and interactions

  • Prototype with Unity/Vuforia

  • Build accompanying website

Prototypes of Ecotour were built in two augmented reality platforms: Aurasma and HP Reveal.

 

These platforms provided a ready made infrastructure so that students could focus on elements of design and user testing instead of back-end development. In addition, the platforms were free, offering an accessible design and teaching tool. I conducted several rounds of user-testing with the prototypes, collecting data on design, learning objectives, feedback mechanisms, and rhetorical appeal to create summative evaluations.

Ecot%20final_edited.png
EcoTour%20final2_edited.png

After evaluating and refining the prototypes,  

I worked with colleagues to develop the stand alone app through Unity/Vuforia. We integrated all of the content, added an intro and conclusion video, and refined the look and feel to create a more consistent color scheme.

 

We then created an accompanying webpage in HTML5 to allow users to "visit" the prairie through an interactive map and videos. Iterations have been documented through several publications that detail how mobile AR interfaces can improve cognition, retention, experiential learning, and mastery. 

Evaluation

  • Formative and Summative evals

  • Interviews

  • Focus groups

  • Surveys

  • User comments

Evaluation happened through the design, making, and testing stages. While creating sketches and storyboards, students collected formative evaluations for each module as well as summative evaluations for the overall project using the Kirkpatrick method (Reaction, Learning, Behavior, Results).

 

We conducted interviews, focus groups, surveys, and gathered informal user comments from members of the community. Evaluation results drove each iteration of the modules to help refine content and design. Evaluation also shaped the learning metrics for the finished product. 

Ecotour wasn't designed to get learners to a point of mastery, but rather to introduce content, encourage critique, and connect users to resources. Additionally, the goal was to test out new methods of experiential learning and create a platform for new types of elearning modules and design thinking. Through beta testing and with the final product, learners consistently recognized environmental threats, could connect specific local problems to climate change, and were able to evaluate local initiatives. 

Ecotour is now available at Paynes Prairie State Park through the Park Ranger Station and Friends of Paynes Prairie. We are continuing to collect data from users to update the app or add new points of interest. At the University of Florida, the Ecotour project was also adapted by four additional courses to help teach design, writing, and environmental communication.