# UpLabs Craigslist Redesign Part 3: Design

This is part three of my Uplabs (opens new window) Craigslist redesign challenge. You can read post one and two which cover some basic overviews of the Craigslist site as well as a Persona, Scenario, and Journey Map I will use today.

# Design Goals

Now that we have some artifacts to design with, I can set some high-level goals. These goals will help keep my designs in check.

  • Our journey indicates that it is difficult to correctly make selections in some of the interfaces. We should make those more touch-friendly.
  • Our journey has some inefficiency around the map. Sam had to switch to a list view to filter and then had to navigate back to continue his search. We should work to reduce the effort here.
  • Our journey shows some dissatisfaction with the way information is presented on the screen using the map view. We should work to make the information presentation better for navigating and getting into the details of the postings.

# Sketching

I did some quick sketches to think through how I might do this (in order by step). Sam is new to the area and will want to understand roughly the location of this property so he can make an informed decision.  I was partially inspired by the material design of Google Maps mobile.

[gallery ids="2528,2529,2530,2531,2532,2533,2534,2535,2536,2537" type="slideshow"]

# Mockups

Going to high-fidelity mockups is a step I frequently skip in the office because I work so closely with developers. Since this is a design challenge, I wanted to take the prototype to the next level. This mockup was created using Adobe XD. If you are interested in clicking around in the prototype, you can visit my Craigslist Redesign hosted by Adobe XD. (opens new window) Below are some of the screens from my XD mockup. Click on the images to see my caption commentary.

[gallery ids="2553,2554,2555,2561,2556,2558,2559,2560" type="rectangular" link="none"]

Overall, this was a fun and rewarding redesign! Come back next week for something completely different.