UI Design

Zero Waste Schools

An app and web application for supporting the 0x30 campaign, to educate future NYC residents.

Role
Prototyping,  UI Design
Date
2016 , 2017
Overview

About the Zero Waste School - Social Networks

Zero Waste Schools is a social network that connects 2,000 public schools in New York City. This project we collaborated with the NYC Department of Education and NYC Department of Sanitation to support the 0X30 campaign. The New York city would like to involves all teachers and students within New York city to participate in the sustainability of our planet and they are encouraged to post their recycling activities' through the web and app.

Main Features

Start thinking about the Design Concept and Move from Wireframe to Visual design

Social Media Post

Teachers and students can post their recycling activities images and videos.

Zero West Contest

Creating a reduce waste contest for students to achieve the 0x30 campaign.

Teacher and students Users Management

Teachers are authorized to approve students account that registered for their school.

Web Design

 #1 New Landing Page with more Information and Download App Links

Mobile Design

#1 Student and Teacher Account Sign-up

Visual Design

Wireframe

Wireframe

 #1 Administrative and Contest Judge

Internal Administrative dashboard and contest judge dashboard for data export and contest evaluations.

Styleguide

Making the UI Guideline to Keep Design Consistent

Takeaways

Reflections

I worked on the most UI design and design assets for both website and apps. This was the first project I got when I worked at the GCOM software. I got the web and app wireframe and needed to transfer the wireframe to the hi-fidelity design. I followed on both Android and iOS UI guideline to keep the better usability and high quality visual design. The most challenge part for me was that the clients would like to have the both totally same looking style and features on both iOS and android UI. However, the user behavior was a little bit different between them. I tried to keep it balance between the stackholders' expectation and real users needs.