%202.png)
SwapMe offers a simple, flexible, cash-free platform where users can access a variety of goods and services, and trade what they need.
A bartering platform for goods and services among community members
.png)
Project Overview
Problem
SwapMe is an app, available in App Store & Google Play. The founders needed a sleek, on-brand website to drive traffic in order to increase downloads, as well as build trust in the brand. They had a website that they made internally, but they were not happy with the aesthetic, layout, or the user interface / experience. They hired me to redesign their website for both desktop and mobile, and implement it using a website builder.
Method
Secondary Research, Competitive Analysis
Solution
Design a sleek, minimal, professional landing site that is on brand, outlines how the app works, shows reviews, an about us page, a contact form, links to Privacy Policy, Terms of Service, and social media
Role
User Researcher, Interface Designer
Redesign Website
in Figma
Validation with Stakeholders
Advising Stakeholders on Building Trust with UX
Implement Figma Designs into Website Builder
Design Mobile Version
Testing on Multiple Devices
Reiterate Designs
Testing on Multiple Devices
Website Builder Walk-Through with Stakeholders
Domain Transfer/Handoff
UX + UI Redesign Process
Primary Research
Competitive Analysis
Acquire Assets
Redesign Website
in Figma
Week 1
Week 2
Week 3
Week 4
I utilized assets such as the logo and applications’ UI screens in the desktop website design. Using only two colors across the design allowed me to create a minimal and sleek aesthetic. The “How It Works” section gives users a quick and easy to understand process of the app’s functions and capabilities. At the bottom, I added authentic user reviews from the App Store to build trust with prospective users that would therefore download the app.
The original website lacked a cohesive aesthetic
and used random images that did not reflect SwapMe’s brand or services. The App Store and Google Play buttons were very different sizes. Some of the text was hard to read and the layout of elements appeared amateur. Overall, it was unpleasing to look at and all the sections (About Us, Privacy Policy, etc) made it feel clunky. All of these issues would prevent the website from building trust with prospective users and not help the stakeholders achieve their goal of new users downloading the app.
New Website
Old Website
%202.png)
Footer
Instead of the Privacy Policy having a section in the body of the main page, I chose to link it in the footer. This would not only save space in the body of the main page, but also ensure that it is visible on the About Us and Contact pages. I encouraged the founders to also add a link to Terms & Services as it’s critical to include this information to build trust with prospective users. Additionally, I changed the Instagram link from the body of the website to the universally recognizable icon in the footer.
Menu Navigation Bar
The original website the founders made had all the information on one page. As a designer with website building experience, I decided SwapMe would benefit from separating the main info, “about us”, and the contact form. Organizing the website this way would facilitate a smoother experience viewing the site as a first time visitor. The blue color on the navigation bar indicates which page the user is on.
About Us Page
I encouraged the founders to send a candid photo of themselves as they wanted to include their bio on the website. A photo helps users connect with the story behind the company which they wanted to share. From our weekly Zoom meetings I was able to understand the mission of the company better and broke it down into 3 bullet points at the top of the page. The mission statement further builds trust with visitors to the website and therefore should help them foster SwapMe communities.
Implementing Figma Designs into a Website Builder
I used Wix to implement the Figma Designs. In order for the founders to be able to easily make edits after hand-off, I recreated the Figma designs within Wix. All the elements, shapes, copy writing, and layout was recreated and arranged on Wix so that everything is malleable and easy to move around, if they or future employees were to need to make edits. I gave them a thorough walk-through and tutorial of the back end on Wix so that they understood how to make changes.
Mobile Version
The SwapMe founders were very pleased with my work and asked if I was taking referrals for more clients! Overall, they now feel very confident in their desktop / mobile sites and feel it will reflect the values, mission, and brand of their company. They said it looks professional, modern, and up to date with current website trends.
Handoff and Completion
View more of my case studies!
.png)
.png)
.png)
%20(2).png)