about wander
Life’s moments are best captured as a story. Make sure you capture all the little moments in-between with an application that curates them into something beautiful. wander is a mobile application created to help collect your memorable moments and adventures into a story. Simply log into the application using your preferred social network, select a timeline and wander will do the rest. You can make your story even more memorable by choosing to share it with your family and friends.
wander collects your photos, tweets, and posts from a chosen timeline. It then outputs two versions of your journey, either plotted on a timeline or on a map. The application has a clean simple minimalist look that we feel will enhance the our user’s experience without causing distraction. It stands out from other journey-creation applications because it curates your photos for you and is a no-nonsense solution to sharing important moments from your life.
prototyping and iteration
After initial brainstorming we then sent out user surveys and began interviews for more needs finding. Using this information, we built our mid-fi prototype. This was to begin mocking out the look of the application, along with starting feature development and movement through the application.
We then performed user studies with the mid fi prototype. We then reiterated on the mid fi prototype and did a second round of testing. This round of testing was important to determine how to define more specific features, such as defining privacy and interacting with other users’ journeys. This information was extremely helpful in finding necessary features we had initially missed as well as making sure the application was fun and easy for users.
From this we created a storyboard to lay out the features that needed to be built. We walked through different users experiences; how they would start a profile, add a journey, edit a journey and navigate the main pages of the application. From this base we built our hi-fi prototype, done in Sketch. This was then translated into a mobile demo via InVision. Following are mockups of the different user experiences.
All of this led into the final development of the design of the application. Below are a few of the final designs made by the design team. Because we switched later to a web-based application, some of the features in these mockups have changed.
system components
The system is divided into two main components, the front-end and the back-end. When using Wander, the user will interact with the front-end of the system. We built this using HTML, Javascript and CSS.
In order to gain access the the user’s information, i.e photos, tweets and check-ins, we used application programming interfaces (api) provided by Facebook, Twitter, Foursquare and Google.
The Facebook API was used to provide access to the user’s photos; the Twitter API was used to provide access to the user’s tweets; The Foursquare API was used to provide access to any check-ins that the user might have made; and lastly the Google API was used to provide access to Google Maps which we offer as a view that the user can use to represent their story.
The user has no direct interaction with the backend of the system. The back-end was built using Django and hosted using Heroku cloud hosting. Heroku then interfaces with AWS which is where our database is hosted.