An Introduction page to the UI project of Voluntopia.  You can choose your area of service and pick an activity to do.  As you complete activities, your city will build.
The Challenge of the app design of Voluntopia:  
1.  to facilitate quick volunteering actions.
2.  to connect young professionals who enjoy volunteering with other like individuals.
3.  To implement gamification and reward theory and show how individual contributions make a difference.
Persona Screen:  Meet Jessica
Jessica is extremely busy but wants to volunteer.  She needs to feel that her time is valued.  She wants to make a positive impact on her community.
Stats showing volunteering in the United States in 2017
77 milion voluteered through an organization.
Market researched looked at companies such as Nano, Local Guides, Catchfire' Charity Miles, Chummy, Point, and GiveGab
Image shows that affinity mapping and visual competitive analysis was used to begin the case study
Gif that shows that a fun and interactive interface is needed
Our team used 3 design principles.
The first was minimum design meaning  that the design needed to be streamlined by the users constraints.  The design needed to minimize visual distractions and the design needed to ha e a clear purpose for each element.
The second principle of design is guide the user.  Give visual clues to make it easy to complete a task.  Include only essential elements so the user always knows the next step.  Use large CTA buttons to increase conversion rates.
The Third design p[principle was Recognize the User's Contributions.  Which meant that we needed to appreciate the user for their contributions and visually show how the user makes a difference. including any stats that are available.
THe first Design stylke is called Playful, Urban Nature.  It is a collage of brown and blue nature and people images including a couple of whales, a man on a suspension bridge, a blue and green illustrated bird which eventually became the app's mascot.
A style tile for the first design style of Playful-Urban-Nature.  It contains a grey silhouette of background city buildings and a park with a pond in the foreground.  Button elements are displayed along with font choices.
Image of people having fun in night scenes.
The second style design is dark blue with computer-like elements in yellow and white.
THird Design Style is Fun, Modern, and Playful.  It has childlike elements and a light blue, light green, yellow  and pink are the prominent colors.
The third design style tile which portrays yellow and grey graphic background with light blue circles.  Buttons and various UI elements are shown.
A/B Testing was used to improve the given wireframes.

Screen Iterations

Users guide the Screen iteration of this 'How it Works" page
iterative screens of civic tasks
4 progressive mock screen designs for an app that rates places on wheelchair accessibility
Iterative screen design for an interactive map


Image of prototype on an Iphone
%d bloggers like this: