In questi ultimi anni ogni persona che vive o frequenta Milano ha sentito parlare dell’evoluzione del quartiere Isola. Prima dell’apertura della linea 5 della metro, questa zona viveva a metà strada…
This medium post serves as the design document for the first module project for INFO213, Introduction to HCI. Our team members are Emily Aiken, Jonathan Gong, and Vibhor Sehgal. The design document is split into the following sections:
We began our design process by brainstorming issues we encounter in our everyday lives that engage with friction. The below image captures our initial brainstorming list of problems.
In the end, we decided to explore visual methods for increasing the level of recycling and composting on campus (or, from a friction perspective, making it harder to be an “optimistic recycler”). We decided to explore the way visual cues on the recycling/compost/trash bins and on the packaging of materials can be leveraged to streamline the recycling and composting process (Zero Waste 2020!). This problem is particularly challenging because many consumers are unaware or confused about what packaging materials are recyclable. We discussed some of the materials we ourselves were confused about, including non-recyclable plastic bags, compostable silverware, and soiled food containers. We decided that a key component of our design would have to be clarity, making it easier for consumers to quickly understand what packaging is and is not recyclable.
We next considered specific ways we could engage with friction to create designs that solve issues relating to recycling and composting. A few of our ideas are listed here:
Since this module was a short one, we used our own team members for needfinding. We brainstormed a list of ideas of why people struggle with recycling and composting, pulling for the most part from our own experiences:
In the ideation phase, we brainstormed specific design ideas that would either increase or decrease friction to help increase recycling. Our ideas are listed below:
Increase Friction:
We also brainstormed different “visual design” entrance points:
We then sketched out several of our ideas. Those sketches are included below.
We evaluated our potential design concepts based on 1) their potential for interesting engagement with visual design, and 2) their engagement with friction. We settled on a combination of the concepts presented in sketches 3 and 4: redesigning packages materials to clearly communicate — through color and through icons — whether packaging is recyclable, compostable, or neither. In particular, we decided to color-code packaging according to its status: blue for recyclable, green for compostable, and red for neither. In addition to color-coding, we decided to add large icons relating to the recyclability status of the packaging, down-playing the branding of the product and instead emphasizing its sustainability. Our design engages visually with friction to prevent “optimistic recycling:” red is a color traditionally associated with danger, so bright red packaging for non-recyclable materials will increase friction at two important times: first, when consumers are choosing to buy the product (the red color will draw attention to the fact that the product is not sustainable), and second, when the consumer is disposing of the packaging (the red color will make the consumer think twice about recycling or composting the packaging).
We next created a mood board for our design concept, keeping in mind our target audience: average grocery store shoppers in America (not necessarily the sustainability-minded shoppers you find in Trader Joe’s in Berkeley!). Our mood board is included as a picture below, and encodes emphases for our design: simplicity and sustainability.
Once we had decided on our design and mood, we created mock-ups of our new packaging ideas in Figma. In working with Figma, we went through three phases: a) prototyping in grey scale, b) specifically developing the icons for recycle, compost, and trash, and c) putting everything together for a color prototype.
a) Greyscale Prototypes
b) Iconography
c) Final Figma screens
The below four pictures contain these mock-ups, with text describing consumer interactions in the captions.
Our design engages with several techniques that we have covered in INFO213. These include:
We believe in making good into Meaningful good. Targeted and Sustainable good. We believe in making ideas into reality. Ideas are with everyone. And so are the stories. They come from anywhere. At…
Jika Anda memiliki bisnis yang layak di ruang Anda dan memiliki situs namun tidak ada lalu lintas ke situs, maka tidak ada keuntungan dari sebuah situs. Hiburan berbasis web dimulai dengan membuat…
In your organization, some problems seem to recur, they are difficult to fix using the tools, tricks and practices you developed over the years as a manager. Maybe this problem is different and the…