top of page

Recycle ATL

This is a high-fidelity prototype for a website intended to help Atlanta citizens recycle easier. It gives guide for what is recyclable as well as where to recycle peculiar items. We made our initial prototypes on paper and in balsamiq, and finally created in illustrator and linked together in InVision.

​

In this project I had fun doing user research & testing and the opportunity to design a project from beginning to end. I really enjoyed the full experience of making a color scheme, illustrating icons and choosing the flow of interaction.

​

Low-fi prototypes

User evaluation & feedback

To evaluate our prototypes, we used the Heuristic evaluation method using 10 heuristics to identify weak points in the design.​ To evaluate, we created one composite prototype that tied combined the functionality of the other prototypes.

Prototype used

From the user testing, we found flaws such as:

  • Home page logo was not clickable

  • Hard to move backwards

  • Can't select multiple items to donate, people donate a variety of things at once

  • Tabs on either side of the logo is confusing

  • Unclear what self-reporting service is

Based on this feedback, we made changes when creating our high-fidelity prototype. Here are some of the things we added:

Home page icons

homepg icons.jpg

Color scheme

color scheme.png

Dispose page icons

icons_dispose copy.png

Donate page icons

icons_donate copy.png

Recycle page icons

icons_recycle copy.png

With the addition of visual elements, we began constructing our final high-fidelity prototype using Illustrator to make the pages and used InVision to link them together to create an interactive prototype. This gave our prototype a more professional feel over a tool like Balsamiq, which is restricted to its graphical style.

Final prototype

Homepg final.png

Process book

process book still.png
bottom of page