SNOWSWAPS PROTOTYPE
An interactive Prototype Design for SnowSwaps, an online digital marketplace for upcycling snow gear.
CHALLENGE
SnowSwaps wants to advance the usability of their current Gear Marketplace Design.
METHODOLGY
SOLUTION
• The current SnowSwaps design was evaluated through a cognitive walkthrough to establish research goals. These goals were then used to establish a usability test protocol.
• Our research team conducted 3 remote contextual inquiries to observe participant’s unique context and how they applied to the Snow Swap’s current design and goals.
• The results from these inquiries were used to create a design focus for my interactive prototype design.
I designed an interactive prototype for an updated version of SnowSwaps with the Upcycled Gear Buyer’s needs in mind. I added advanced features for browsing gear, contacting sellers, and making a purchase. I also focused my design around advancing navigation functions to make it easier for all buyers, sellers, and organizers to use.
Role: UX Researcher & Designer | Deliverable: Interactive Prototype, Touchpoint Tour
METHODS
1 Usability Evaluation: Cognitive Walkthrough
2 Affinity Diagramming
3 Findings Report
4 Usability Testing: Contextual Inquiry
5 User Stories & Scenarios
6 High Fidelity Interactive Prototype
ATTRIBUTIONS
• Photos: SnowSwaps, UnSplash
• Logo & Branding: SnowSwaps
• Typeface: Lobster, Poppins
• Contextual Inquiry Script: Prime
• Icons: Material Design
HOW I GOT THERE
About the Project
Snowboarding can be an expensive sport, but it doesn’t have to be. This idea is what inspired Zach Lulavy to create SnowSwaps, a digital marketplace for used sports equipment. Zach’s intention was to bring the benefits of in-person gear swaps into the digital sphere in a way that current marketplace options like Facebook, Craigslist, often miss. The expense of equipment, combined with the time/confusion of searching online for affordable gear, often causes a big barrier to entry that prevents people from learning or advancing in snow sports.
Goal
To “help close the access gap and increase the circulation of used snow-sports equipment” with SnowSwaps, a website/app where people can organize gear swaps, search for gear, sell gear, and keep good gear in use and out of landfills or collecting dust in garages.
Design Opportunity
The SnowSwaps website is currently in development and preparing for a launch. They want to advance their usability and design before launching. They’ve asked our team to evaluate the current usability of the site and create an interactive prototype modeling proposed changes.
SnowSwaps Current Website Design (Displayed on Mobile). Showing Login page and Create Swaps page.
Overview 1: Prototype Screens
Overview 2: Prototype Screens
SITE GOALS
• 1. SnowSwaps is intended to be a mobile-friendly online marketplace for members of snow-loving communities to browse, buy, and/or sell used snow-sport equipment.
• 2. Increase access to the sports by increasing availability of the equipment needed to participate and lowering the barrier to entry by providing used-gear options to those who may not wish or be able to invest in new gear each season.
• 3. Create a virtual environment for “swaps” where others can browse listed items. Buyers can contact sellers to negotiate prices and a location to meet. Swaps can be public, or they can be private requiring a passcode to interact with the swap.
KEY USERS
Primary users:
•Individuals looking to facilitate the upcycling of used equipment
e.g., club owners, shop owners, resort owners
• Individuals looking to upcycle used equipment
e.g., parents of minors in youth sports
Individuals looking to save costs on equipment
e.g., parents of minors in youth sports, snow-sports enthusiasts
User levels within SnowSwaps:
• Admin — can grant permissions to Super Users
• Super User — can create and manage swaps
• Base User — buyer/seller
KEY TASKS
Primary tasks:
• Create a swap
• Edit a swap
• Join a swap
• List gear for sale
• Browse listed gear
• Filter listed gear
• Favorite listed item
• Contact a seller
• Purchase an item
• Mark item as sold
Future Wishes
1) In-app messaging 2) Email verification 3) Ticket printing for in-person swap item tagging 4) Admin: Include recommended locations to meet
THE METHODOLOGY
RESEARCH
Usability Review
To test the current site and understand areas for improvement, I evaluated the current SnowSwaps build in a cognitive walkthrough.
This evaluation explored the key tasks outlined by the SnowSwaps team and the subsequent necessary steps to understand how the site was performing across the categories of mental model, visibility/hierarchy, mapping/consistency, and feedback.
Raw Data was synthesized by the research group.
Contextual Inquiry
To understand more about what users in the snow community would want to see in a swap, we went straight to the source. Our research team performed a series of 3 explorative contextual inquiries with members of the snow-sport community. We interviewed one snow club owner/director, one person who sold a lot of used equipment, and one person who bought a lot of used equipment. Their unique contexts and expertise provided us with valuable insights into the needs and goals of a potential SnowSwaps user, including how they currently access in-person swaps, use digital swaps, buy gear for themselves or others.
We observed how users interacted with the current SnowSwaps site and then synthesized the raw inquiry data using the affinity diagramming method on a collaborative Invision freehand board.
RESEARCH GOALS
Uncover the degree to which the app offers the same perks and benefits that are offered in in-person swaps.
Better understand what features users enjoy the most in the apps/websites/tools they currently use.
Understand the problems SnowSwap was built to solve.
REMOTE TESTING PROTOCOL
Our research team conducted 3 remote contextual inquiries.
My role: Tech Lead, Note Taker
Tests were 45-60 minutes and were conducted over Zoom using screen sharing. Each used zoom to recording audio/visual, macbook Pro for screenshots, Otter.ai voice transcription, and live note-taking.
*All participants were volunteers who agreed to be recorded.
Our 3 remote tests were asked to show us how they currently engage with online selling or buying of used snow sports gear.
We dedicated 30 minutes for user discovery and exploration of their current tools. We also dedicated 30 minutes to introducing the user to SnowSwaps and asking them to explore it for their own primary use, as well as asking them to walk through a directed scenario. Scenarios were crafted to fit the user’s unique context, whether they were a buyer, seller, or organizer.
Example of notes taken from our Upcycled Gear Buyer.
FINDINGS
Evaluation Findings
The evaluation revealed that the minimalist design of the site might be too simplistic. Of the 34 steps evaluated, the most common issues came down to a simple theme: the user will need more context to perform these the site’s key tasks well. The site’s usability would improve by advancing the navigation/guidance for each task and advancing sorting/categorizing options.
Explorative Findings
During contextual inquiries we learned exactly what type of features users thought needed further consideration:
• Product/swap descriptions and categorization
• Improved search/sorting functions for swaps and items
• Adding locations/context to each swap/item, and more clarity and help to complete transactions such as in-app messaging/notifications/payment options
• Conventional transaction options for buying items and communication between buyers and sellers
• Adding seller profiles to improve transparency
Elements to Consider
• Add a second level of navigation for key features
• Improve navigation with labels on key buttons and advancing navigational buttons to move forward and backward throughout the site
• Increase detail and consistency on swap and item descriptions
• Advance options for item/swap filters: include sorting options for both sellers/buyers
• Transactions: Users may also want to see more advanced features for buying items and selling items.
• Internal messaging system: enable transactions to take place on the site
These findings were used to create user stories and define the scenarios for my prototype.
USER STORIES
Upcycled Gear Buyer:
I want advanced options for browsing gear and contacting sellers so I can quickly and simply find the best gear to fit my needs and budget.
User Goals:
• I want more options for filtering swaps/products and an improved search so I can quickly find items; guidance/direction through labels and hover functions, and a search bar with advanced categories and filter/sorting options.
• I need more detailed descriptions and photos for items/swaps so I know exactly what I’m viewing and buying
• I need smoother navigation and guidance on the site over, through items like 2nd level navigation and navigational elements like a consistent close button on all windows.
•I’d like a “How To” guide so I can access how to use the site.
• I’d like in-app alerts/texts so I don’t have to use my personal email, or, at least some email masking that auto-populates the email with the item I’m looking at.
• I’d like to be able to make my purchases right in the app
PROTOTYPE SCENARIO
The prototype was designed around the needs of an Upcycled Gear Buyer. I created a scenario that covered their key tasks:
Scenario: A “Gear Buyer” who is using SnowSwaps for the first time. Our buyer is interested in purchasing a specific ski size and has been invited to the first digital version of her favorite Swap: The St. Paul Ski Team Swap. This swap benefits the team that her family is a part of.
1. Login/Set-up: She is logging in right before the start of the swap so she can be there when it opens for the best chance at finding the best fit skis for her needs. She logs in, updates her profile quickly, and navigates to a site “How To” to confirm she understands how to use the site.
2. Entering a Swap: She then takes a quick glance at the full list of swaps before navigating to the St. Paul Ski Team swap, entering the private access code, and searching for the ski size she needs for a family member.
3. Browsing Items: She sees 2 results that match, navigates the item that is the best fit, and sees that the quality and price are of great value. She also notices they’re being sold by someone she knows from their snow community, which adds trust to her transaction.
4. Purchasing Items: She sends an (optional) message, confirms the pick-up details and price, and purchases the skis online.
PROTOTYPE
The findings, user stories, and scenarios were used to build an interactive prototype.
• The prototype was built in Sketch
• The prototype was made into an interactive experience using Invision
Click on the video above for a sample of how the prototype works or click here to try the prototype yourself.
DESIGN FOCUS
Search & Filtering:
• Advancing options for filtering swaps/products
• Search bar with advanced categories
Navigation:
• Advancing the use of labels
• Consistent close options on pop-ups
• Detailed descriptions for items and swaps
• Adding a second level site navigation menu
• A “How To” guide on to use the site
Advance Functions:
• Internal messaging system
• Site payment processing
NEXT STEPS
The SnowSwaps prototype is ready for evaluation and testing.
The Invision SnowSwaps prototype is ready for client review.
The next step, pending a round of initial client feedback and approval, would be a round of usability evaluation.
Example: Contextual Inquiry Script
Sketch Notes from a Contextual Inquiry
Remote Contextual Inquiry Set-up
Sketch Architecture Diagram for Potential Focus Areas
Digital Wireframe of Potential Focus Areas
My personal notes as step one in a collaborative affinity diagramming process.
Low-fidelity Wireframes
Page View for Current SnowSwaps Design
Sample from Remote Contextual Inquiry Set-Up
