If you haven't seen the current Craigslist website, I'll just say that its design is questionable. So... I have completely redesigned Craigslist, focusing on and designing the screens relating to one user task: "navigate from the home page to a listing of a one or two bedroom apartment/house located in Clifton, Ohio".
FINAL CONCEPT
Final Home Screen
PROCESS
To began this project I conducted two separate user tests, each one with a different person. Both tests involve the same task using the current Craigslist website, which was to "navigate from the home page to a listing of a one or two bedroom apartment/house located in Clifton, Ohio".
The purpose of these tests are to gather information about how new/old users navigate their way around Craigslists and how I can use this information to create a new design that maximizes navigation and usability.
User Flow #1
User Flow #2
After completing user tests and collecting more data about Craigslist' design, I worked on a heuristic analysis and created a list of design problems/violations the current Craigslist design has and how severe these problems/violations were and if they needed to be worth considering in my redesign.
Heuristic Analysis #1
Heuristic Analysis #2
Now, knowing all the design violations that could be hindering a website, I next worked on benchmarking and studied two separate websites with better designs and noted what parts of these websites make their design better. I viewed a direct competitor (Trulia.com) and an indirect competitor (Etsy.com) regarding Craigslists apartment/housing shopping feature.
Benchmarking #1
Benchmarking #2
Next, I created an information architecture for the current Craigslist website as shown here below:
Current Craigslist Information Architecture
With research and data collection completed, I began to start producing some designs. I started with a few sketches shown here below:
Sketch #1
Sketch #2
Sketch #3
Sketch #4
Moving forward with my sketches above, I created a digital wireframe prototype shown below:
Wireframe #1
Wireframe #2
Wireframe #3
Wireframe #4
Next, I started adding color, design elements, and finalized my design and prototype. I began with this style guide then went on to complete my redesign of Craigslist all shown below:
Style Guide
ADDITIONAL FINAL SCREENS
Final Home Screen
Final Listing Screen
Final Map Listing Screen
Final Housing Info Screen
To view my entire process and Craigslist redesign, click the link below:
