Flock Shop Industry Design Project
research | ux design | prototyping | usability testing
Role: UX researcher, UX/UI designer
Duration: 5 weeks
Tools: Competitor research, user personas, user flows, Figma design and prototyping, usability testing
Team: Tim Beemsterboer, Emily Nikolenko, Ariana Adili and Tianhui Wang
The Challenge
As part of my Springboard UX design certification program, my final project was called the Industry Design Project (IDP). I along with three other students, were matched with a start-up for a 4-5 week design project. I was matched with 'Flock' an up-and-coming e-commerce website. Flock aims to make group buying mainstream in the United States. In recent years, especially since the pandemic but also before, group buying has become huge in Asia. It's similar to getting a discount by buying in bulk except you share the products within a group of people. For instance instead of buying a bottle of perfume for $100, if three people each buy a bottle they each would only pay $90.
Flock had some high fidelity designs and flows but were not happy with the direction so they brought us in to take what they had, back track a little bit and come up with some fresh new ideas. From our initial call with Flock we learned that the scope for this project would include the home page, the product page and the group buying flow. We also learned that their target demographic was Gen-Z and younger millennials. They wanted us to create a site that users would spend a lot of time on and keep coming back to. Finally, they wanted it to be a mobile-web site with a light and dark mode for accessibility issues. Later they would plan to convert the site into native iOS and Android apps.
The Process
Competitor Analysis
We started the process by really familiarizing ourselves with the problem space. We did research about the history of group buying in Asia and each performed competitor analyses of apps in the same retail space such as Supergreat and Flip. We also looked at the biggest group buying app from China, Pinduoduo. We learned how these apps were functioning and performed heuristic analyses to see what was working and what was not.
We found that Pinduoduo and Flip had clean simple UI designs and good visual hierarchy. We noticed Pinduoduo's use of games and rewards to increase user visitations. We liked that Supergreat's onboarding started out with a quiz about your traits such as skin tone, type and hair color. We also liked that Supergreat's app was simple and only had two functions, 'watch' or 'shop.' We thought, however, that Supergreat's UI looked a little dated and had a lack of visual hierarchy.
User Interviews
Next we performed user interviews to get a better understanding of our user base. We wanted to know their habits for shopping for beauty supplies and find out any pain points they encountered that we could resolve. The most important things we learned were
• Most people were finding out about products from videos on TikTok or Instagram.
• People had issues knowing who to trust for recommendations. One user was very hesitant to trust any influencers because she knew a lot of them were sponsored by the products.
• Most people were unaware of or confused by the group buying idea, so we knew that was going to be a big pain point to work out.
• Users thought that group buying was only associated with cheaper and more questionable products
• Some users thought the group buying idea was too much trouble for them and they would rather pay full price.
• Most users spent a lot of time scrolling on TikTok and Instagram, mainly to take their minds off work or other things.
Ideation and Wireflows
Onboarding
We first created the short onboarding tutorial, we thought this would solve the problem of users not understanding the idea of 'group buying' and also give the users a better understanding of app in general.
Home Page
The business wanted the home page to keep users coming back and keep them scrolling so we designed:
1) Product cards showing featured products curated for them
2) Video reviews they could watch from the home page
3) A daily check-in bonus card the users could find each day to earn rewards points
4) The page being an endless scroll to keep the users busy
Product Page
For the product page we:
1) Put prices near the top so the user could see the discount they would be receiving by group shopping
2) Created a section for open groups and put the first group as a group that has only one spot and is ready to close. For the users that would rather pay full price than wait, we wanted to show them that they could save money and also not have to wait
3) Added a feed similar to Venmo to show group buys happening and get the user interested and excited about group buying
4) Created a tab system to allow the user to purchase alone if there were no groups available and they did not wish to start a group
5) Added verified video and written reviews so that the user could feel confident in their purchase and not worry that they were being swayed by sponsored influencers
Group Buy Flows
For the group buying flow the business wanted it to be as quick and easy as possible. In the purple flow, a user is joining a group with one spot left. To make the flow as quick as possible the confirmation page has their default shipping and payment options preloaded. The user can always change those if they wish on the 'ship to' or 'pay with' pop-ups. They will then confirm their order and their product will be on its way!
For the pink flow, the user is joining a group that won't close right away or starting a new group. After the confirmation screen, the user will get one more pop-up which shows their beauty buddies (friends within the app) that they can share the group with to try to close the group within the time frame. Once a group is created it must be filled within 24 hours to be closed and shipped.
Usability Testing
After I set up the prototype in Figma we performed usability testing with 5 users to see how well our app would be received by users. Users were tasked with looking through the homepage to find the daily check-in and completing a group buy purchase. From our testing we were able to make some changes for the final high fidelity mockups.
Users were confused by the group button circled here on the left. They thought it was multiple buttons and didn't know which one to push. We changed the look of the button to make it look more like one cohesive button. Users also wanted to know how much they would save instead of only seeing two prices so we added a line showing the percent saved. Some users had also already forgot what group buying was so we added the question mark button with a modal pop-up window to remind users.
Users were also confused about when to invite friends to their group during the group buy flow so we added the progress bar to remind them that step was coming up next.
The Final Prototype
Results
For my first group project this was definitely a welcome learning experience! I learned how and when to deliver constructive criticism and also how to better receive it. I believe users responded well to the project and people are ready for the group buying phenomenon to take off. If I had more time with this project I would have loved to interview more Gen-Z users. I don't feel that we got a full understanding of that piece of our target user group as well as we could have. I would also like to work more on the gamification and rewards aspects of the app and come up with more fresh innovative ways to keep users coming back.
%201.png){kind=small}
