The ApartmentGuide City Page project was a joint effort between myself and the SEO team in which I was responsible for the entire design process from concept and wireframes, to final mockups, style guides and working with the developers to assure the final experience was pixel perfect. The goal of the city pages is to provide users with useful content on a particular city they're searching in while also giving search engine bots valuable content to crawl and boost search engine rankings. Because ApartmentGuide's primary business objective is to get leads from users contacting rental properties on the site, the city guide content was placed at the bottom of the search results page where there was the most traffic. The new city pages were launched in 20 test markets, causing a 30% increase in SEO rankings and were then rolled out to additional cities.
User Research and Survey
In user testing sessions I had learned that city page content was more valuable to users that were not familiar with the area they were moving to. I ran a survey with 1,177 participants to learn more about how many users were moving from out of town or out of state to determine how useful the city page content would be. Through my survey I found that 54% of users were moving to a new city or state. This was a significant finding and showed that city pages would provide value to at least half of our user base.
Concept and Sketching
I worked directly with the SEO Copywriter and SEO Director to sketch a few different concepts. The SEO team had figured out what sections of copy it wanted but needed help visualizing the layout. I worked directly with the copywriter in brainstorming sessions and sketched ideas on the white board to come up with a mutually agreed upon direction in very little time.
I then created high fidelity wireframes and presented a variety of directions to the SEO director and team. After we agreed upon a direction I then began designing visual mockups.
Mockup: Text Only
One limitation of the project was that some cities would have to use old SEO copy before getting updated content. The new layout had to work with the old content while providing another design for the new photos and copy.
Every detail was examined including icon exploration for a new "Did you know?" section. The section was a fun fact to get readers quickly into the content and I explored a variety of icons but ended up choosing the light bulb icon.
Mockup: City Page
After a series of different mockup design phases, I came to a final design with the team. The new page provided engaging content, neighborhood sections that took users to searches in specific neighborhoods and displayed featured rental properties in the area. After the design was done, I helped the SEO team acquire photos and trained the copywriter on how to edit and crop photos for final production.
Mockup: Rental Tips Module
It was important that the city page content was at the bottom of the search results page so that bots and users could find it easily. The search results were at the top of the page but what if users didn't scroll to the bottom of the page and missed the city page content? The solution was to provide a local rental tips module at the top of the page that allowed users to easily find local city content and learn more if they wanted to.
After the final mockup was approved I then created style guides for the developers to provide essential information on the layout and make the CSS styling more efficient. I worked directly with developers to assure the mockups and the final experience were perfect.