Craigslist-logo-square.jpg
A modern redesign for craigslist’s homepage while maintaining their design language.

Craigslist Homepage redesign

User Research, Interaction Design

 

CONTRIBUTIONS
Information Architecture, Interaction Design, Evaluative User Research

TECHNIQUES

Card Sorting, Interviewing, Usability Testing, Paper Prototyping, A/B Testing, High Fidelity Mockups,

OVERVIEW
This project aims to present a redesign for the Craigslist homepage to reduce confusion and intimidation for new users. This was a personal side project to demonstrate my process and how to improve the user experience while working within the constraints of an existing design language which eschews images, nondefault colors, minimal capitalization fancy typefaces and selector styles.


 Redesigned homepage

Redesigned homepage

USER RESEARCH

Based on interviews with users who preferred to not use craigslist, the website was described as "intimidating" and "confusing".

To analyze the effectiveness of the information architecture, I conducted a card sorting exercise to see how users would group the different categories and to see if the existing labeling was clear.

In terms of organization, the categories of gig, job, and services were generally grouped together. Furthermore, forums and community were grouped separately from the rest because they were not related to classifieds, as they did not involve offering or searching for something. I also found that the term "gig" was not universally understood.

 Original craigslist homepage

Original craigslist homepage


Paper prototype 1.jpg
 Paper prototype used in usability tests

Paper prototype used in usability tests

DESIGN

In order to simplify the homepage to make it more welcoming, the primary feature of this redesign was to replace the wall of hyperlink options with a series of dynamic drop-down selectors that guided users towards what type of service they were looking for. First they'd choose whether they were posting or searching for something. Then it provided the general areas to search through: professional, romantic, community, etc. The three types of professional work: gigs, services, and jobs, were consolidated into "professional", which were separated in a second drop down selector. Each selector generated another selector until enough detail was collected to send them to a specific board with their postings of interest. By showing only one or two selectors at a time, it gave greater focus on what the user needed to do. By simulating relatively natural language by framing the choices into a sentence e.g. "I am [looking for] an [item]: [computer]", it reduces ambiguity about what is going to show up next.
To reduce the number of clicks upon repeat visits, a history of the last 3 category searches conducted are kept underneath the selectors. Since repeat visitors are often doing the same thing e.g. selling similar types of items or searching for jobs in the same industry, this reduced repetitiveness of working with the selectors.
Elements such as the about section, the discussion forums, the career section, the Youtube channel link, etc. were relocated to the bottom. The discussion forums section was simplified into a single link that would be filtered further in the forums section.
The various location change elements along the top and right side, such as subsections and nearby cities, were consolidated into the top left corner. This allows the location context to be easily noticed while not detracting from the main screen. The only other elements along the top were the search bar and log in as they also helped with using the ads but were for more power users.

EVALUATION

In order to evaluate my intended design, I created a paper prototype to conduct usability tests with. The takeaways from the users were that there were too many selectors to get to where they needed to go. After testing different numbers of selectors, I found 4 selectors balanced the trade off between specificity and simplicity. I also relocated the location selector because it was considered too distracting since the default location should be where they were.