Product Designer
Nuonu - An application to reduce fashion waste.
Industry
E-Commerce
Year
2021
NUONU is an application that is dedicated to addressing the issue of fashion waste and promoting environmental health.
The core focus of this innovative project was
1. To create an application that encourages users to adopt sustainable practices and reduce their fashion waste.
2. To provide a platform for charities and organisations to sell donated clothes online, amplifying their reach and impact especially during the challenging times of the pandemic.
With the help of NUONU it is a win-win situation for both the environment and charitable causes.
​
I collaborated with two other UX Designers. I was involved in User Research, Interaction, Visual design, Prototyping & testing
Research
Initially we came up with a concept to help environment by reducing fashion waste. We started by researching the social attitude towards sustainability. For this we did market research and found out following insights.
51%
People think that personal actions like donating, recycling or buying ethically can make a real difference in the world.
66%
Purpose driven consumer prefer to buy sustainable products compared to 30% value driven customers.
88%
People want their brands to help them to be more environmentally friendly and ethical in their daily life.
60%
The major action taken by people to lead a more sustainable life is in clothing and footwear category.
User Research
User Interviews
After finding some market data insights on social attitude. We interviewed 6 participants from which two interviews were conducted face to face and remaining four were conducted online through MS Teams. The interview took approximately 20 minutes and included topics to get to the core of what user wants, what motivates them and what are the problems they face. During the interview, we asked following questions:
-
Tell me about your experience of buying clothes from the charity shop?
-
How often do you make purchase from charity shops?
-
How often do you use clothing apps?
-
How do you feel about second hand clothing?
Key Findings
The interview was conducted with 4 women and 2 men aged from 25 to 47. All of them have experience with online shopping. Despite the amount of generated data, this was the most relevant information for decision-making in creating the solution:
50%
Prefer buying clothes from the online clothing app rather than physical store for convenience.
90%
Thought the notion of second hand clothes is essential, but they find it hard to find right size and right quality.
80%
Never purchased anything from the charity shop. One of the reason were related to good quality products.
What we see is that although 90% of users understand that buying second hand clothes is very essential for environment, whereas 80% of them never tried to buy from charity shop because of several reasons. Based on this we generated few key initial thoughts.
​
-
The price of the clothes will remain low as they are second hand but the way they are sold will look premium.
-
Providing video tips/ projects on how to be creative with fabrics.
-
Making it exclusive by allowing people to alter clothes through the app.
User Personas
It is important to have a persona because it allows us to bring the target user on the journey of designing a solution. Four personas were created, whereby each persona supports sustainability and has a belief in reducing fashion waste by helping charities and making efficient choices.
As well as one persona, in particular, having an impairment for the purpose of exploring accessibility was considered. Developing these personas helped us to refer back to the thoughts and feelings users had when I interviewed them.
Scenarios & HTA
Following the creation of the personas, scenarios and HTA diagrams were created to inform the development, layout and navigation of the application.
Scenario 1 - David Hunt
“David has found a shirt that he likes on the app but it is an extra-large size and he is a medium. He is unable to alter the size at home himself due to his disability. He would like to use the altering service to alter the clothing himself and purchase the shirt that will be tailored to his size.”
Scenario 2 - Erin Palmer
“Erin needs to create a collection of upcycled clothing for a new project but she has a budget of £20 and a limited amount of time to search for items. Erin wants to find a specific selection of clothing; two t-shirts, one plain and one patterned, in addition to something that is denim.”
Scenario 3 - Ava Davis
“Ava is a political consultant and therefore needs to offer suggestions that would benefit the Labour Party. She is currently working on what the party could do in order to support and promote sustainability within the fashion industry as this creates a lot of unwanted waste. Ava needs to find factsheets relating to how much fashion waste is accumulated every year and she is a great fan of The Great British Sewing Bee and would like to find out how to replace a zip on a leather skirt.”
Scenario 4 - Ava Davis
“Ava would also like to do her part in helping the planet. Ava likes shopping but sometimes doesn't like accessories on clothing such as buttons. She has found a dress she likes but the buttons are so small they are too fiddly. She would like to change them by using the alterations service.”
Scenario 5 - Jack Bing
"Jack needs a good quality shirt for a sustainable energy event at his university, but he wants it at a cheap price. He looked at other brand apps, but couldn't find anything affordable. He also visited charity clothing shops, but didn't like the old-fashioned options and lack of alteration services. Plus, he's not sure if the money he spends will actually go to charity."
Competitive Analysis
At the start of our low-fidelity process, we analyzed in depth a lot of different apps. Here is a selection of key ones that influenced the design process of our app.Inspiration was taken from Thrift (a retail app where users can buy designer charity clothing) for its simple gender categorisation, Pinterest for its floating navigation – allowing the user to see content beneath the navigation and search features, Oxfam for its donation display and slider, and Super T-shirt Designer for its ability to allow a user to create their own customized t-shirts.
Information Architecture
To further inform the structure and processes within the application, the card sorting technique was used, which allowed us to ensure we develop task processes within the app to how users expect to complete them.
Conceptualisation
Basic wireframe sketches were created to form the general layout we had in mind based on the scenarios, in which the idea was to merge familiar layouts and features from standard websites and applications.
Lo-Fi Wireframes
After the screens were concluded in the paper prototyping step, digital wireframes were created for a better visualisation of how the screens would look before hi-fidelity prototyping.
Key Findings
We came across few key findings after designing the lo-fi designs.
​
-
Removing Floating Navigation bar: Inspired by Pinterest we used floating nav bar, but we tested Pinterest floating nav bar using a screen reader which uncovered that the navigation no longer floated. It instead locked to the bottom of the screen. Possible reasons for this may be to allow the screen reader to easily tab through the content and also detect the end of the page.
-
Consistent Navigation bar: We concluded to use two navigation bars, because alteration section has different navigation bar which would lead to confusion and the floating navigation bar will obstruct the editing area in alteration section.
-
Making a 5 menu navigation bar instead of 4: To reduce the amount of buttons in the main pages of the application.
-
Removing the home screen: To simplify the process we decided to remove the home screen and let user have access to the shop sections.
Accessibility Considerations
When thinking about the design of an application we have to consider the accessibility requirements, and adjustments which can make all the difference with certain users. We have researched into Dyslexia, Low Vision and Colour Deficiencies.
​
-
Use sans serif fonts
-
Size: 12 / 14 point = 1- 1.5em / 16-19px (Some may need larger).
-
Avoid underlining and italicising.
-
Avoid text in all uppercase and small caps.
-
Contrasting Colour Palettes. In order to ensure this, we used contrastratio.com
The Solution
NUONU make it easy for user to purchase charity clothing online and create an original piece by using the tailoring, resizing, shortening and customisation of buttons services which serve as a unique selling point.
​
Helps user to learn about fashion waste and shows tips, tricks and idea on how to repurpose or repair clothing they already own preventing them from being part of a throw away society.
Alter Shirt Style
-
Select the shirt you want to alter.
-
Click on the alter button.
-
Go to quick resize.
-
Select the required size.
-
After that go to shorten length option.
-
Alter the style as per your need.
-
Confirm the selection.
-
Add to bag
Filter Search Results
-
Go to filter option.
-
select your spending limits
-
select between option 'wear now' and 'make something NU'
-
Select your inspiration.​
Find DIY Ideas & Facts
-
Click on idea button.
-
Find the video to replace a zip.
-
After that check the facts related to fashion waste.
Change Button Style
-
Select the clothing item.
-
Click on the alter button.
-
Go to change button option.
-
Select buttons style as per your liking.
Check Donations
-
Open profile section.
-
Check the total donation made.
-
Go to donation options.
-
Check the donations made to different charities.
Usability Testing
We conducted mixed method approach to ensure any obvious errors. We asked participants to perform tasks that aligned with the key features such as altering shirts, find DIY ideas and to check the donations.
Pre Test
DIY Walkthrough
To ensure that any obvious errors were rectified before user testing.
During Test
Think Aloud Protocol
Taking note of interesting observations, any barriers, issues or problems.
Post Test
SUS Data
To collect data about the user experience using the app.
Semi Structured Interview
Open ended questions to ask follow up questions.
Recruit Participants
Initially we started by recruiting participants and informing them about the aim of the project and their role in the research, for this we made user to sign a consent form. As the testing was conducted during the tough times of pandemic so majority of our participants were friends and family.
Participants Task
-
When you are on the shop page, select a shirt that is available for alteration. Once you have chosen the shirt, use the alteration service to change the size from extra-large to medium. After that shorten the sleeves during the same alteration process.
-
You are looking to buy 'street style' women clothing which should be less than £20. Using the filter option, filter your search to get the desired product.
-
You are looking for a skirt but you want to customise buttons on it to make a new look, so you select the skirt and customise the buttons to blue heart buttons.
-
You need to find video on 'how to replace a zip' so that you can replace the zip on your jacket.
-
You have purchased a shirt and want to track the donation made to Macmillan Cancer Charity based on your purchase.
Time Completion Timings
The testing was conducted informally by recording the think-aloud protocol. It was then used to provide indicative time length to complete each task.
​
* 2 participants were in older age bracket found using a trackpad difficult to use during the test.
Post-Test Interview Question
Post-Test Interview were taken after the task session are finished. Here are some questions that we asked:
-
How easy was it to complete the tasks you were set?
-
What do you think worked well with the app?
-
How do you feel the app could be improved?
-
What are your thoughts on being able to tailor clothes through the app?
-
Does this app change your opinion about buying second-hand clothes?
System Usability Scale (SUS)
We used SUS to collect quantitative data. The testing was done with 6 participants and the average SUS score comes out was 70.4 which is considered above average.
Key Findings
The insights from testing revealed key usability issues around alteration functionalities, profile layout, labelling of navbar, and the idea section that were amended in the following prototype iteration.
Participant's comments
Participant 1: 'Replacing the buttons and cutting the sleeves is really intuitive approach. Easy correlation between icon and function.'
Participant 2: 'Buying tailored clothing is a brilliant idea because I can't normally get anything that fits anyway.'
Participant 3: 'It would give you more choice if you could look for all clothes above your personal size because you know you can alter them.'
Participant 4: 'Being able to shop and up-cycle might remove the stigma of going into a charity shop.'
Future Considerations
-
Need further testing to understand if the new UI elements have improved the way the app is used.
-
Creating a responsive layout, that works across all the device.
-
Thinking on how app will work with more content.
-
Focusing on the design parts which were not focused in this project.
Reflection
-
Working as a team helped to bring in various Ideas and Creativity throughout the design process.
-
User testing with our product provided us with an outside perspective on our product's progress and helped us to make iterations based on the feedback.
-
With COVID19 raging throughout the course of this project and restrictions in place, I relied on friends and family to conduct interviews and usability tests.
Other Projects
Byte Exchange - KYC & Onboarding
Redesigned KYC onboarding, boosting registrations by 26.3% and cutting completion time by 65% for Himalaya Exchange users.
OneMDM - Enterprise Data Workflows
Streamlined complex data workflows, reducing errors and task time by 40% for enterprise users in Master Data Management systems.