OutSmart Mobile App Prototype

Mind Mapping · Wireframing · Prototyping · UX/UI · User Testing

Concept: Locate the best spots. Join a dedicated community of outdoors-people and seasoned travelers who provide local intel and share outdoor adventures to support scientific research and outdoor recreation management.

Course: Mobile App Design and Prototyping - Rhode Island School of Design
Instructor: Bryan Rodrigues

Design Objectives: I designed this app with crowdsourced data collection in mind. All site reports, reviews, hashtags, and posts can be mined to support research aimed at protecting and restoring outdoor recreation spots. I drew inspiration from popular apps to create a pleasing space for end users to share their outdoor adventures and connect to followers.

 
 
 
 

Or check out my design process…

 

In my initial Mind Map, I sketched out initial concepts in Adobe Illustrator. I drew inspiration from Yelp and photo-rich Instagram. I brainstormed data needs for researchers, including reporting on water quality, litter, wildlife, flooding and tides, and sense of place.

 

I wireframed major screens, information hierarchies, and user navigation in InVision. This is the point in the design process where many seemingly disparate ideas begin to fit together nicely via thoughtful architecture.

OutSmart_Wireframe_Cap.JPG
 

Finally, I prototyped the app in Figma to develop out the user experience and user interface. The blue arrows are interactions that simulate the experience of using the app. I emphasized clean, intuitive architecture with design principles drawn from popular apps. Based on user testing, I swapped in a more intuitive rating system, made it easier to navigate “Home,” and added a Custom Report option.

OutSmart_Prototype_Cap2.JPG