Habitat Network - Goals Addition

UX Design

Project Overview

Prior to launching into an overhaul of the user experience - an additional piece of functionality was requested to be added to the current Habitat Network application experience. The team needed to add a 'Goals' sequence representative of common overarching desires of our user base. As the project is migrating to an Angular 2 world, we needed to consider future goals as well as the current interface in creating and implementing the design.

Initial Steps

I began by navigating through the various possible user flows and thought paths a Mapper (a person who has created a map within the application) could go through and created wireframes to walk through those steps. The timeline was constrained and did not allow for user interviews regarding this added functionality - thus I consulted the copious amount of feedback from both the team and users regarding the overall design and functionality as well as surveys that provided us with the basic outline of the high-level 'goals' in which the user-base were interested.

The Process

After several rounds of wireframes, I migrated the designs into low-fi prototypes using UXPin to demonstrate the flow and basic animations that were desired. The prototype also allowed the team to gain a more comprehensive understanding of the userflow - which led to minor modifications in call-to-action verbiage as well as consolidating or removing several points of interaction.

After prototyping - we moved on to integrating the goals into the test application.

The Result

The final designs and prototypes were handed over to the developers of Habitat Network after several rounds of revisions and team edits. I assisted with styling edits remotely, as the components were integrated with Angular 2 into the application.

Watch a video of the final functionality addition.

Other Work