For this hackathon I was placed in a team with 3 designers and 3 developers. We were prompted to build a MVP design that can help environmental sustainability. We chose to proceed with a marketplace app (rePlay) that allows parents and guardians to buy, sell, or trade unwanted children items. These items include toys, clothing, furniture, or baby products kids constantly outgrow. This is all in an effort to reduce the number of wasted materials sent to landfills, or that negatively impact the environment if not discarded properly.
Dun Dun Dun.... and we are the Hackathon Winners!! 🥇
The idea and concept is a huge success. Based on our usability test results, we scored a 100% vote in users seeing themselves use this app in the future.
Up to 100 million pieces of clothing and children toys are thrown away each year contributing to the release of greenhouse gases and toxins that enter our soil and water supply. Since a majority of this includes children’s clothing and toys, we focused our efforts to tackle this issue. We spoke with a few parents and discovered that there is a desire to buy, sell, and trade baby items in a sustainable way, especially at the rate their children grow.
Our goal is to provide a platform and local network for parents and guardians to buy, sell, or trade unwanted children items they are constantly outgrowing and give them a second chance. In addition to pushing sustainable efforts, this will only be a platform where transactions are done locally, eliminating the carbon footprint from shipping.
Due to our strict timeline, we approached this project by working with agile methodology. Time-boxing played a huge part in meeting our deliverables. We took the 1st day to plan and land on our idea and spent a couple hours getting to know each other’s working styles. We came up with a solid plan on what our focus should be for the MVP and then quickly jumped into sketching out our ideas. Since we only had 4 working days to create and build a functional product, the UX team needed to hand off our feature prioritization list on day 2 latest so the developers could get to building the back-end functions.
For our MVP, we created a very straight forward and simple user flow to help us establish our most important features. We needed our user Laura to creating and complete a listing.
We conducted a design studio brainstorming session as you see below different sketch styles. Our team started out with paper and pen first to get our creative juices rolling. Then we brought them into FigJam and collaborated in putting our favorite elements together to land the most intuitive design.
After finalizing on some of our ideas from the low fidelity sketches, we each took some screens and started building our mid-fidelity wireframes. We used the below refined wireframes to start conducting usability tests so we can gather feedback to make any improvements necessary.
We conducted 5 rounds of usability tests and had a success rate of 80% in task completion. With our user feedback, we aim to increase this percentage. However, we did receive a 100% vote in product retention as users see themselves using this app in the future. This helps us confirm that parents are excited to use the application.
Below are some improvements we made based off user feedback before we jumped into our high-fidelity prototype. As we continue doing our usability tests, we hope to see better results with these updates.
I created this style guide below to help speed up the process when building our high-fidelity. The Gambado Sans typeface really matched our brand’s playful and optimistic aesthetic so we chose to continue with this as our logo. This was useful for the team to have a color palette to play around with.
In order to build our MVP, we focused on some of our most important features. While we did focus on the user flow, we wanted to add some additional interactions to improve usage. On these below screens you will see how the user will interact with each task.
Creating an account is crucial for the user to get started on the app. The user will have the option to use single sign-on or create an account using their email. This screen will appear for first time-time users or if they are logged out. After creating an account, the user will be brought to the marketplace feed where they can browse.
To list an item, our user can hit the center button on the bottom navigation bar. It will direct them to the camera where they can either upload a photo or take a new one. However during our usability tests, we discovered the camera is an extra step if the user doesn’t need to take a photo. Our improvement would be to have the CTA go straight to create a listing page.
In order to complete the listing, the user will fill out necessary information regarding their item. This includes title, category, listing type, and description. While creating the listing the user also has the option to add tags to attribute their item, or save to drafts if they need to step away.
Once the listing has been posted, the user will have the option to view their listing from the pop up message or by clicking through the profile tab where they can also see their saved drafts. All user information will be in the profile tab which we are considering a next step for the future.
View clickable prototypeView githubThis entire hackathon was an incredible collaborative experience. Building a product in 4 days came with many challenges. I met all my teammates for the very first time and we all had to figure out each other strengths and weaknesses, as well as how to work together effectively. I’m glad I had this opportunity to exercise my leadership skills as I really pressured into time management and ensuring our roadmap was feasible for everyone’s schedule and skillset. I’m really proud of what our team had accomplished in this short time frame. We even took 1st place and the people’s choice vote!