Eware

August 2020

Best projectUAH UI/UX graduation 2020

Eware is my graduation project, an app to reduce, reuse, and recycle Electronic waste.

My contribution
  • User Research
  • UI/UX Design
  • Prototyping
  • Copywriting
Tools used
  • Illustrator
  • Photoshop
  • Sketch
  • Blender 3D
  • After Effects

⁉️ Problem

Today, with the development of technology, the life cycle of electronic devices has become shorter. As a result, a massive e-waste amount is generated worldwide while just about 17 percent of that waste is officially recycled, others are discharged into landfills and the ocean (via The Verge articles: #1 #2). Realizing this, in my graduation thesis, I wonder how we can make a digital product or a platform to alleviate the E-waste problem. Eware came as an answer to this question.

🧠 Concept

Eware is a SaaS service connecting users and electronic shops and recycle centers to reduce, reuse, and recycle old tech devices or electronic wastes. The goal is to mitigate their negative effects on the environment.

Post Content Image

User Research

I surveyed more than 200 people in technology-related and environmental groups such as Tôn trọng trái đất (Respect Earth) to get some insights about their technology device usage behavior, their challenges and needs when recycling old devices. With that data, I came up with two personas that present two typical user types of this app.

Image of Tuan Website

Age

35 years old

Hashtags

#zero-waste #home-addicted #low-tech

Goals and challenges

  • Sell stuff for decluttering and upgrading.
  • Clean data properly when selling.
  • Don’t have much time.
  • Difficult in transportation.
Image of Tuan Website

Age

20 years old

Hashtags

#zero-waste #home-addicted #high-tech

Goals and challenges

  • Sell broken devices and buy second-hand stuff to save money.
  • Sell and buy with good prizes.
  • Don’t have much money.
  • Don’t know legit shops.

👀 Branding

Logo, Colors & Brand voice

Eware is a brand about tech & environment so I chose purple and green as primary colors with some supporting colors. The logo is clean, and simple but stands out enough.

The brand voice is bold, funny, and inspirational, which is presented by copywriting. The content uses punchlines, poems, and Vietnamese idioms to make it sound more trendy and intriguing.

Post Content Image
Logo
Post Content Image
Color Palette
Post Content Image
App Logo

Di động, tủ lạnh, tivi
Hỏng không dùng nữa vậy thì bán thôi

Cũ người mới ta, chẳng lo về giá

To tủ lạnh, nhỏ tai nghe
Nếu cần sửa chữa nhanh lẹ có ngay

Copywriting

Mascot & 3D Style

The brand has a character that makes it more friendly to users. Because of the tech vibe, I created it in 3D style, modeling in Blender. I also collected and created some icons in the same style to be used in the device categories.

Post Content Image
Modeling in Blender
Post Content Image
Character 1
Post Content Image
Character 1
Post Content Image
3D Icons

📱 Eware App Walkthrough

Onboarding & Login

The onboarding flow uses 3D animations and poem-style copywriting to introduce product features. The login flow prioritizes modern login/registration methods to minimize the number of inputs that the user has to fill.

Onboarding - 3 short 3D animations with poem-style copy
Login - Able to use Apple ID and Memoji

Repair/Sell Suggestion

The app makes use of modern technologies to recognize and suggest the best places with the average price to fix or sell electronic devices, based on their conditions, which could be indicated easily in this app.

Device Recognization - Input electric device model
Condition Indication - Pick or search for damaged parts

Booking & Rating

The app also provides a booking feature for repair/sell services, especially for large devices. After a transaction between users and/or electronic shops succeeds, there is a rating system to collect data to control the quality of that user/shop.

Booking
Rating

🛍️ E-Market

The market is where users and electronic shops can sell and buy electronic devices. The product list could be filtered by product model or category. Also, the user can save searches to receive notifications about their favorite products.

Post Content Image

Home and other supporting functions

The homepage also is an activity center that shows what's going on. Some other functions support the transactions or provide information, such as Inbox, Chatbot (Notifications), Recycle map, and E-waste news.

Post Content Image

🔥 Full App Demo

A picture is worth a thousand words. Watch the demo to understand the app easier.

The demo clip presents the main flows and screens of this app, including Onboarding & Login; Homepage & Maps; Repair/Sell Suggestions with booking and raking; Market, Chatbot and Inbox; and Account.o

🖥 Landing Page

I also design the landing page to promote this app. Inspired by Apple, it has the parallax effect, on-scroll 3D animation with some funny but meaningful content to raise people's awareness about the negative effects of E-waste.

⭐️ Credits

Shout out to my lecturer who has instructed and mentored me to complete this project. Thank Tam Le and An Nguyen for supporting me in some parts of this project.

  • Mentor: Mrs. Kieu-anh Tran
  • Stock Photos: Unsplash, Pixabay, Shutterstock
  • 3D Icon base: Superscene by Craftwork
  • 2D Icon pack: SF Symbols by Apple
  • 3D Model & Animation Support: An Nguyen
  • Character Development Support: Tam Le