We designed a Buy Nothing Sell Nothing app, which allows users to give away items they no longer need to others in their community who could benefit from them. By facilitating a culture of giving and sharing, our app aims to promote sustainability, reduce waste, and foster a sense of community and generosity among its users.
For a week-long hackathon, our team had to select a social cause or a nonprofit organization we care about and design a mobile or desktop experience that addresses an aspect of this issue.
Before creating the app, we did some research to see if it is something worth building. We learned that consumerism creates a lot of waste and wanted to make a platform that helps people exchange their unwanted items to reduce waste.
We interviewed 3 people and asked them 10 questions around their donating habits, and the struggles and pain points associated with them. Here are some key questions and responses which helped define our product strategy and design decisions.
We looked at a range of direct competitors including: Freecycle, Swop It, Offer Up. In terms of comparative research we took inspiration from Instagram and Tiktok as to how the UI should be designed.
People like donating unwanted items but don’t like traveling far.
People like to know their unwanted items are going to good use.
People don’t like waste and it’s effect on the environment.
Cheryl was created as a result of the insights we gained from the discovery phase.
Nursing student
Pittsburgh, PA
Average tech literacy
Cheryl is a nursing student who spends most of her time in the lab or training at the hospital. She has plans to move to a new apartment soon, and is looking for ways to downsize, sustainably.
She tries to minimize her impact on the environment by eating a vegetarian diet and is always mindful of her consumption and waste.
She shops at thrift shops and repurposes her clothes and housewares, whenever possible.
Cheryl wants a trustworthy, easy to use, way to unload unwanted items to people in her community who may be in need, as well as minimize her environmental impact.
How might we facilitate a convenient and efficient method for people to donate their gently used items to those who may need or want them, rather than discarding them in landfills?
Creating a site map was an essential step in the develop process - by outlining the hierarchy of pages and content, we were able to visualize the overall structure of the app and ensure that our design decisions aligned with the user's journey and needs.
We mapped out the two main flows: listing an item and claiming an item. This helped us identify potential pain points and areas of confusion in the user experience. By refining our user flows through multiple iterations, we were able to create a seamless and intuitive user experience that meets the needs of our target audience.
We then created a mid-fi prototype for the two flows so that we could test our design and its intuitiveness.
Feedback from 15 people included two quotes about the placement of the 'create a post' icon on the app's navigation bar. We had initially placed it in the center of a 3-icon bottom nav bar, but after adding a fourth icon, the placement was affected which we overlooked.
To make room we moved the ‘messages’ icon to the conventional placement in the top right corner of the header and changed the icon.
We then asked the following direct question and got the helpful response below which we decided to implement.
Pre-populated messages
We also watched someone take the tests. They gave us the following advice:
“Integrate a common theme and more colloquial, playful language and tone which familiarizes the user and encourages a sense of curiosity.”
It was at this point we decided on the name of the app - Loot Swap. Then we thought we would continue with that theme and have playful pirate themed ux writing.
Below are the different iterations of logo before we arrived at our final design, which was created by Stable Diffusion.
We followed Adam Frost’s Atomic Design methodology to create intuitive and user-friendly interfaces. This methodology starts with the basic building blocks of design, called atoms, and then builds up to increasingly complex components: molecules and organisms.
We selected a color scheme with a main palette of Rich Black and White Smoke, complemented by our secondary color Blue de France, and accent colors Ruddy Blue and Fandango. The use of primarily neutral colors helps to maintain a clean and easy-to-read interface, while the calming blues were chosen for their aesthetic appeal. Fandango was also added to further enhance the visual interest of the design.
We chose to use Avenir throughout the app as it is a clean and modern sans-serif typeface that aligns with our design goals of simplicity and clarity.
Avenir
Aa
Heavy Medium Light
Our app follows a spacing convention in which units are measured in increments of 10 throughout the design.
This approach simplifies the design process by establishing a clear and repeatable structure and makes it easier for users to understand the hierarchy of elements on each screen.
Below are video loops of the main features in the hi-fi prototype.
Icon, splash screen and login.
Industry related stats on a delayed carousel.
Find stuff near you.
Use the map view to see what’s available nearby.
Use your location, or input a custom one.
If you’d rather not have strangers coming to your house, set a new location for the drop off.
Pinch to zoom.
Look at all that more stuff!
Curious about an item.
Check the comments to see if someone had a similar question, or ask one yourself.
Bag your loot.
When you see something you like, get it
I’ve used the MoSCoW method below to help ensure that the next steps are clearly defined and prioritized.
A user-friendly and intuitive interface to promote ease of use and engagement with the app
Ability for users to create and manage their own profiles to personalize their experience and facilitate trust-building within the community
In-app messaging system to allow for easy communication and coordination between users
Integration with social media platforms to allow for broader reach and community building
Option for users to create and join interest-based groups to facilitate targeted exchanges and build a sense of community
Ability to set up alerts for desired items in order to be notified when they become available in the user's local area
Integration with payment processing systems to enable monetary transactions between users
Integration with shipping providers to facilitate long-distance item exchanges
The value of user research: Conducting user research was critical in identifying user needs and pain points, which informed our design decisions. We conducted user interviews and usability tests to gain insights and feedback, which we used to improve the overall user experience.
The importance of collaboration: Working with a cross-functional team taught me the value of collaboration in creating a successful product. By leveraging each other's skills and expertise, we were able to create a cohesive and effective design.
The power of prototyping: Creating mid-fi and hi-fi prototypes helped us test and iterate on our designs, leading to a more user-friendly and intuitive platform. Prototyping also helped us communicate design decisions to stakeholders and gather feedback.
The challenge of balancing user needs with business goals: As a marketplace platform, we needed to balance user needs with business goals, such as facilitating transactions and generating revenue. This taught me the importance of understanding both user needs and business objectives, and finding ways to meet both.
The need for continuous iteration: Design is an ongoing process, and there is always room for improvement. We continuously gathered feedback and data on the platform, and used that information to inform ongoing iterations and improvements. This taught me the importance of being open to feedback and constantly striving to improve the product.
