About derive
The derivewatch app is based on the concept of "derive" - where one drifts through an urban space in an unplanned manner taking cues/hints from surrounding areas to arrive at a predefined/new place all the while gaining a fresh and authentic perspective of the surroundings.
Design Features
Color choices:
I used the same color scheme - shades of green, grey across all the screens. I chose these colors because of their contrast and visibility. They are easy on the eyes and convey minimalism. Plus, all my icons are flat (because currently, flat design is in, skeuomorphism is out) and visually consistent across all the screens.
Fonts:
With my choice of font sizes and font weights, I have tried my best to establish good visual hierarchy. I used Helvetica, because it’s what apple uses in most of its products.
Animations:
The navigations and animations I used are simple and intuitive because I wanted to make the app more usable by exploiting users' familiarity with operating existing apps based on similar functionality.
Design Heuristics:
I tried to incorporate Nielsen’s design heuristics to the maximum extent by showing status visibility (curious mode et al), maintaining consistency and standards (fonts, buttons, interactions), user control and freedom (allowing users to customize, exit from undesired screens), flexibility and efficiency of use (used familiar design cues with regards to what users expect from interfaces like this), aesthetic and minimalist design (used flat design which is a lot cleaner than other forms of design, used minimum number of colors so as to not overwhelm the user while still making the interface visually striking and appealing).
Toward extra credit:
The app hides the final destination from the invitees by merely showing a category so that the users can make their decision to accept/decline.
Video of the smart phone part of the app
Video of the smart watch part of the app
Code:
Attributions:
Thanks to nounproject.com for the icons.
And much thanks to the three TAs who helped me with my Framerjs nightmares!
Comments