UX take-home assignment

JING.C
Bootcamp
Published in
5 min readApr 24, 2022
Credit: unsplash.com

Hello guys, here I am again to share another UX take-home assignment that I’ve done recently with a green-tech start up company in Paris. This company works with different garment brands to help measuring their social and environmental impacts from raw materials till transportation till production. As I’ve worked for fashion brands before, I know that this industry really has bad impacts on environment and luckily now there’re more and more pioneers focus on ecological production and fair trade. So I’m really motivated to join them as I’m totally agree with their missions.

For the first interview, I talked with the CTO for around 30 mins and several days after he sent me this assignment to do and I’ve one week for it. As their business model is more like B2B2C, they create this kind of product impact certificate for their clients, and this certificate will be showcased on brands’ website so that the final clients will be informed about the product impact that they’re going to buy.

The challenge

To create an interactive widget showcases some important elements from the impact certificat that their clients can directly integrate it into their e-commerce website.

Some market research

Although I’m very passionate about protecting our planet, but I have to admit that I really have limited knowledges on it. So I started by doing some market research on the ecological or environmental friendly brands. I created this website feature comparaison chart below.

These 5 brands they all have a showcase of product impact on their e-commerce website, some are personalised to show the impact of certain products some only shows general impacts.

Survey by EY and IFOP in 2021

Then I searched online for consumers’ opinions, I found some interesting data from EY and IFOP’s survey on durable development in France from last year.

82% of consumers are concerned about the durable development.

79% of consumers say they lack good information to decide to act or choose in favor of sustainable development.

68% of consumers believe companies should ensure that all their suppliers meet high social and environmental standards.

credit: unsplash.com

Quick interviews

With some assumptions in head, I then did a quick interview with 4 people. Here’re some key findings:

Low knowledge of product impact that they consume.

The price is the main obstacle to consume more ecological.

They need an intuitif and visual evaluation showcase system, not just some numbers.

The evaluation scale should be transparent.

3 main personas

In the assignment, they provided me 3 main personas that they want me to take into considerations. With the qualitative and quantitative data that I’ve got, they meet the same pain points and needs like these 3 personas below.

Problem statement

Consumers need to find a way to be informed of the environmental and social impacts of the products they buy because they don’t have much knowledge about those impacts and they want to be informed.

Low fidelity sketches

I then drew a low fidelity version of widget, I chose 3 main elements from their certificate: traceability, environmental impacts and recyclability. I also used an environmental score as proposed by the European Commission, this is an easy way for consumers to have an idea of the product impact.

Visual analysis on competitors

Before moving on to the mid-fi, I did a quick visual analysis on those direct and indirect competitors, we can see that Decathlon uses this environmental score on their product as well but the showcase is not interactive.

Mid-fi wireframes

This is my first version mid-fi, the three overlays are for the hovering state when mouse enter the three icons. For people who has little knowledge, these overlays show complete information in a lisible way. Under each icon, there’s the score and yes or no for the recyclability, consumers don’t need to go far to see details in the full report to be informed about the total impacts.

I then did 4 user testings on this first version, and I got some really helpful feedbacks:

I love the idea of these overlays, I think they’re clear and intuitif.

I like the illustration on the first overlay but there’s too many texts on the third. Also the numbers on the second one mean nothing to me.

I don’t get the score B, is it out of ABC or ABCDE? You need to give me a parameter.

High-fidelity prototype

On my high-fi, I added this environmental score display proposed by European Commission, I changed the 3 icons into animation and I also changed a little bit the 3 overlays to more visual.

Key learnings

My biggest takeaway during working on this case is that even though consumers express a desire for environmental information, but only about half seek it out. The information must therefore be obvious (impossible to miss) and explicit (impossible to misunderstand).

Also another thing really important is that people are more sensible to visual creations than listed data. They literally don’t get it when seeing 1.2kg of CO2 emissions. So rather than giving this numbers directly, it’s always better to use visuals to express the data.

--

--