Mobile App Development

CHALLENGE

What could be a way to reduce the impact of product packaging on the environment?


The main contributor to landfills in the United States is not products, but actually their packaging.

In absence of a coordinated governmental or industry policy, consumers could help by making informed decisions right at the point of purchase – the grocery store.


So GreenDot, a carbon footprint calculator App for consumer product packaging was developed.

MY ROLE

As the sole designer responsible for this project, I both led it and corresponded with our development partners while building out the designs. I conducted multiple rounds of research. I produced sketches, wireframes, and mockups. I delivered final assets and documents, supervised development, verified the live product, and iterated again for multiple rounds.

GREENDOT

A carbon footprint calculator App for consumer product packaging.

The path from login through outcome – getting an Environmental Impact Score.


Screens for scanning a SKU, checking a product's Environmental Impact score

then showing how, when a user adds a product to the database, they can share it on social media.

Product Submission screens, available in two ways – by adding the barcode's number or by scanning its image.


REQUIREMENTS & BUSINESS PLAN



USER RESEARCH

User Research to gather user requirements.


Features Research.


Essential Features – their importance denoted by box size, to guide development priority.


Analytics of feature use by demographic segment after the App's launch, to guide strategic priority decisions its next iteration


INFORMATION ARCHIE

VISUAL DESIGN SYSTEM

Typography specifications displaying font families used.


Typographic hierarchy and color specifications for light and dark modes.

GreenDot Visual Design System's specifications for color usage.

Iconography specifications.


USER FLOW

MINDQUE

A Brain Fitness App designed to monitor cognitive ability trends.

The various functions of MindQue – Testing, exercising, collecting information, connecting the user to resources and sending secure health data to healthcare providers

MindQue’s brain exercise screens, designed to keep the user’s brain in good shape and avoid cognitive decline

MindQue’s, screens for collecting information, used to correlate to performance on cognitive tests


BRIEF

Created to integrate with the Fitbit tracking device, MindQue amplifies its health monitoring capabilities to include brain health.

TARGET AUDIENCE

Directed to users diagnosed with early-stage dementia and/or Alzheimer disease, the app is designed to continuously measure the user’s cognitive health in order to provide a clearer, more accurate picture of the disease’s progress than could be achieved in bi-annual administrations of cognitive tests at consultations with their Neurologist.

MY ROLE

Information Architect, User Experience Designer, User Interface Designer

BUSINESS REQUIREMENTS

• A system that would collect and track the user’s physiological condition when taking a cognitive test.

• A way to store and parse the user’s cognitive test performance throughout time.

• A way to confidentially send the test performance data to the user’s Doctor.

USER REQUIREMENTS

• An easy, intuitive interface that allows users to self-monitor with minimal instructions.

• A set of brain games and tasks that can exercise areas of brain health vulnerability, with very low cognitive load.

DELIVERABLES

• Persona profiles

• Wireframes

• User Flow Diagram

• User Journey

• User interface that integrates with existing Fitbit UI

• App Style Guide

PROJECT DECK

Detailing problem to be solved, business goals, user goals, target audience, competitive analysis, UI interaction & feedback example, and performance metrics.

PERSONAS

Persona Profile 1

Persona Profile 2

Persona Profile 3

VISUAL DESIGN SYSTEM

Form Elements

Button Specifications

Button Specifications

Color Background Specifications – Research showed that highly stimulating colors had a positive impact in the length of user engagement with the App

Iconography and its states – Part 1

Iconography and its states – Part 2

Control elements – Checkboxes, Radio buttons, progress bar, etc.

Typography Specifications