Your freelance web design and Webflow partner - based in Finland
App/arel Concept
The Problem
Due to long supply chains and the amounts of energy used within production, the fashion industry is responsible for 10% of global carbon emissions, and that number is predicted to rise within the next 10 years. One of the best ways to reduce this is to stop consuming fast fashion and buy only sustainable and ethically made products. However this can get expensive and is not a very realistic solution for most people.
Over the past 5 years I have been very passionate about the sustainability movement, and I have been slowly transitioning to the eco-minimalism lifestyle. Through this journey I was learning more and more about the impacts that fast fashion has on the environment.
This project was my capstone for school and we were given no constraints at all.
Solution
App/arel is a phygital retail experience created to make thrifting clothes faster and more convenient to the average consumer. This experience allows users to use the kiosks located within the store to filter through clothing. The user is then able to add the items to a cart, which will then be sent out and received by an employee who will bring the clothing order to one of the dressing rooms. The user then receives a notification letting them know that they can proceed to their designated change room.
For this solution I created an app prototype, with original branding and an animated explainer video.
Research
Secondary Research
What is Phygital Retail?
Phygital could describe anything that attempts to cross the divide between the physical and digital worlds, but it is most commonly used to describe a retail experience or a marketing strategy.
There are advantages of both digital and brick-and-mortar commerce. Even though brick-and-mortar shopping is declining, there are still irreplaceable aspects of it that consumers continue to desire:
- Consumers enjoy the interactiveness of being able to see and touch products in a physical store and talk with sales personnel.
- Phygital has a strong appeal with Millennial and Generation Z consumers, who are highly digitally connected.
- Consumers already frequently combine brick-and-mortar shopping with digital shopping in two ways: reading product reviews online, then making well-informed purchases in a store, or touching and seeing products in a store first then ordering online.
Interviews & Personas
Based on the primary research that was conducted in the form of interviews, I created 3 personas. All three of these personas are from varying age categories within the Generation Z and Millennial category. These personas were created to better understand the potential users, and to better empathize with them. After the personas, a journey map was illustrated to show how one would go about shopping more sustainable and where they might give up along the journey.
Ethnographic Study
An ethnographic study was conducted at a value village, to learn how users interact with traditional thrift stores, and what the benefits and drawback are. Three users were chosen based on previous thrift store experiences:
- User 1 was a frequent thrifter, and tends to buy the majority of their clothing art thrift stores.
- User 2 was an occasional thrifter. This user purchases very little items from thrift stores, and would only go when other friends are going.
- User 3 has never thrifted before, and buys all of their clothing new from a store
Insight 1:
Traditional thrifting is better if you are experienced within it and know what you are doing.
Insight 2:
Thrift stores tend to be unorganized and there is no way to find very specific articles of clothing.
Insight 3:
Trying clothing on is a must. There are so many different brands, that have different sizes, so it is hard to tell when something will fit.
Market Testing
User testing was conducted on thred up, (an online consignment store) to see how user interact with parallel spaces that are on the market. It was noted that many people felt overwhelmed on the site, and that there were too many options available. There were also no mens clothing options, so user testing with males proved to be quite difficult.
Insight 1:
It took a long time for users to find specific articles of clothing because they did not use the clothing filters.
Insight 2:
Users likes the "Goody Box" and would be interested in getting it if they were unsure of what to buy.
Insight 3:
Users found the website to be too overwhelming with too many options. 2/4 users would not use it again.
Visual Design
Branding
The goal of branding was to create a visual image of this project that would convey a vintage, and minimal look and feel. the purpose is to create a recognizable and cohesive brand identity that would carry through all platforms.
Mood Board
A mood board was created in order to gain inspiration for the look and feel of the final design. Because I was designing a second hand phygital space I wanted a vintage feel, that was still clean, and not too overwhelming.
Style Guide
The colour palette was chosen based on the mood board above. The palette consists of very pastel colours with pops of bold colour in contrast. The typeface Madera was chosen because of its clean and easy to read design, and varying font weights. I wanted a typeface that was legible but also was unique and different.
Logo
This logo was created to have a very simple and luxury like feel. The monogram is made with two interlocking lowercase A's that represents the two worlds of physical and digital coming together, to form one integrated system.
Iconography
The iconography in for this project was very important, I wanted to display the options that users could pick from in a unique way that matched the simple and minimal branding. From the mood boards I was very inspired to create these icons using continuous line-work, this ended up portraying a doodle-like feel that I was quite fond of.
Illustrations
Illustrations were created for the walkthrough, home page, and loading pages of the app to guide users, and help with aesthetic usability effect.
Development
User Flow
A user flow was created in Miro to visually see how a user would interact with the system.
View User FlowWire Frames
When creating wireframes they were originally created for a mobile app, it wasn't until after version one of prototyping that I realized I should be designing for a larger kiosk screen
User Testing
There were a total of 3 major changes made after user testing the application. Two user experience changes and one user interface change.
Change 1:
On many of the screens some users found the text to be a little difficult to read, so some of the text was made larger and bolder.
Change 2:
It was found that during the quiz, users were unable to go back to the previous page, to fix this I designed the pages so that you can see what information is on the previous page and swipe up to access it.
Change 3:
The last change was made to the order summery page. When testing it was found that users had a difficult time navigating to the order summary page. My solution to this was instead of a page that has to load, I would create a tab that can opened and show the order at any time.
App Prototype
The final app prototype was created within Adobe XD. It consists of 25 different screens that are fully interactive. The prototype can be viewed below.
View PrototypeExplainer Video
Along with the app I created a short animated video using Adobe After Effects, that summarizes, the need for the App/arel and how it works.
