Reiterate, reiterate, reiterate
Jumpoffcampus website redesign
3-week sprint to improve the JumpOffCampus website for students
Tough lessons
I am not the user
I am not the user
I am not the user
The client wanted more students to use the website.
JumpOffCampus provides off-campus housing options for university students. However, their website design had not been updated since 2010 and was not getting new customers. It was also not mobile responsive.
How the original website looked across platforms
It’s all about the users
We researched a lot.
First, we conducted a heuristics evaluation and usability evaluation to specify why the site wasn't working.
We discovered the site lacked robust features, clear findability and transparency. Users didn’t know where to go or how to get there.
More research
Then, we created two surveys to gather information directly from users to drive our design solutions.
The first survey revealed that they mostly used Trulia, Apartments, Craigslist and Zillow. They were used to robust search and filter capabilities.
The second survey showed us what filter options were the most important for students: location, price and amenities.
User flows were super helpful for us in pinpointing and prioritizing our design decisions. We created user scenarios and documented both the happy path and the current user flow on the website.
After comparing the idea and the reality, we could see what wasn’t matching up. These pain points combined with our user research helped us identify where what issues we needed to address.
User flow currently on the website
User flow “happy path” for finding a housemate
Form follows function
We conducted a competitive analysis to see what other housing and roommate sites we're doing successfully. We looked at sites like Trulia and Zillow according to our survey results.
We knew it wasn't just about being pretty. For example, one of the biggest competitors was Craigslist which is not flashy or trendy looking at all.
The user drives the design
After user research, competitive analysis, business analysis data and card sorting data, we combined that with our user flows and scenarios to guide our wireframes.
We updated the top navigation to reflect our user research findings. We also added filtering options, added an overview page to check listings before publishing. Also, we tried to update the language.
Test, reiterate, repeat & repeat again
Usability test round 1
We tested our prototype to see if we were on the right track. We got a lot of useful feedback — positive and negative.
Navigation was improved, but the wording was still confusing.
The filters were great, but users couldn’t figure out how to post a listing from the top navigation.
Students felt that this page didn’t cover all their different housing situations effectively
usability test round 2
We updated our wireframes to reflect the feedback we got from the first test. We then tested the prototype in a second round of usability testing.
We were slowly improving, but there were still many details that needed to be ironed out. For example, users were not always sure how to fill out the housing question when they had a unique situation.
Deliverables
We showed our updated wireframes after the final usability testing and showed our client. After his feedback, we had time to update the wireframes one last time. We also created the mobile screens because the site was responsive so the client didn’t need a costly app.
After the sprint
After our 3-week sprint was over, I cleaned up the wireframes and made them higher fidelity.
Our client plans to implement the changes and update the website this coming summer.