CRAIGSLIST REDESIGN
UX RESEARCH | UX DESIGN
PROJECT CONTEXT
Role: Lead UX Researcher, UX Designer
Team: Elizabeth Kim
Timeline: October 2022 - December 2022 (2 months)
Tools: Figma, Adobe Photoshop, Miro, Google Suites
SUMMARY
Craigslist is an American classified advertisements website founded in 1995 by Craig Newmark where you can find listings for jobs, housing, items, pets, and much more.
The website receives around 250 million internet visitors every month yet many people have found Craiglist’s user interface to be outdated and thus hard to navigate through.
COMPETITOR ANALYSIS
Facebook Marketplace
eBay
We started our process by understanding the marketplace by conducting a competitor analysis. Through this, we’ve found that the biggest competitors to Craigslist are Facebook Marketplace and eBay. When analyzing these two competitors they all have aspects incorporated that Craigslist lacks which are distinct categories, clear information hierarchy, images, a recognizable logo, and information/reviews on the seller.
HEURISTIC EVALUATION
We then decided to investigate the application by performing a heuristic evaluation and rating from most to least severe according to the following scale:
Cosmetic problem
Minor usability problem
Major usability problem; important to fix
Usability catastrophe; essential to fix
USER INTERVIEWS
We surveyed 17 people (ranging from 18 - 60 years old) on their experience with navigating around Craigslist (specifically to the pet listing page) and gathered input on what could be improved. Below shows the commonalities we’ve found between the responses.
CORE GOALS
USER PERSONAS
Based on the survey responses and markets in which Craigslist can further expand in, we constructed two personas.
USER FLOWS
Buyer User Flow
Seller User Flow
To help us visualize the path and patterns the user will take when navigating through Craigslist, we diagramed two user flows to fit the two user types: the seller and the buyer. One of the concerns among our surveyed respondents was around the credibility and safety of buying and selling on Craigslist since the actual interaction and payment processes are outside Craigslist. To build up credibility around the seller, we decided to implement internal messaging between the buyer and seller as well as a process of reviewing for both the buyer and seller.
LOW FIDELITY MOCKUPS
The design process began with sketching out the low-fidelity wireframes on Figma where we focused on the general organization and primary functions of the homepage, item profile page, and the item listing page.
Homepage
Item profile page
Item profile page - messaging
Listing categories page
Listing page - item description
MAKING IMPROVEMENTS
Looking at the listing page where the user will input the item description and photos, we found our original mockup to be clunky and archaic with only being able to add in one image. To improve the design we incorporate the option to add multiple images and a way to preview the listing along with the seller’s information.
Refining the item description listing page
Pop-ups for action confirmation
Through our heuristic evaluation, we’ve found that Craigslist lacks a back button forcing users to have to restart when they make a mistake. To improve the heuristic principle of User Control and Freedom, we added a way for users to ‘exit’ or confirm when committing certain actions.
STYLE GUIDE
THE FINAL REDESIGN - HIGH FIDELITY MOCKUPS
Personalized homepage content
Simplified posting process
Building trust among buyer and sellers
We made the navigation bar more distinguishable with the top bar having the actions of searching, creating a listing post, and accessing the profile page or signing up/logging in. The secondary navigation bar has easy access to the original Craigslist main categories as well as a link to the help page. We also included the ability to follow other users and track their postings on the homepage which allows the user to customize their homepage experience.
Before users had to go through multiple steps and pages to post a listing. Rather than having to multiple steps of identifying the type of listing they are posting, they will choose from the main 6 and will later get to specify further if they choose. With the implementation of internal messaging, we remove the need to include and share personal information like phone number, email, and address to the general public which increases safety. In the posting process, the user will have the ability to preview what the final posting will look like which will help users catch small errors.
As mentioned earlier, having an internal messaging system within Craigslist removes the need to have personal information floating around the site for anyone to view. Keeping the interactions between buyer and seller within the site will also allow Craigslist to have a record of the interaction in case something does go wrong. The implementation of reviewing both buyers and sellers allow for credibility and weeds out the scammers and bots.
USABILITY TESTING AND EVALUATION
We recruited 5 undergraduate college students (ranging from 18-21 years old) to conduct an usability testing so that we could gauge the learning curve for users. Examples of tasks given to complete were making a listing post and messaging a seller inquiring about a post. Based on the feedback, these are the actions we took:
Feedback
Changes
“When I am making a post, what if I don’t want to continue? How can I exit the process when I’ve already started making a post?”
“How do I search for something even if I am not on the homepage?”
“Is there a way to know when the seller has responded to my messages?”
Added exit options that will allow the user to leave the process of making a posting. They will be shown an exit action popup that will let the user confirm that they wish to exit.
Included a search icon in the top navigation bar that will expand into a search bar for easy access.
All unread messages will show up bolded in the messages box and have a number indicating how many unread messages there are. Users can know when another user is active on the site through the green dot next to their profile picture.
