Seattle Department of Construction and Inspection website

Web Design /// Art Direction /// UX+UI

The Department of Construction and Inspection (SDCI), an agency of the City of Seattle, reached out to my firm to redesign it's website dedicated to helping Seattlites find a place to rent and rent vacant units . 

three-screen-mock-up

Problem + Solution
The old site looked dated and did not have clear information architecture leading to confusion and a poor user experience. I was tasked with creating a site that equally served those renting in Seattle and landlords/property managers, work with team members to create custom illustration to be showcased on the site, and ensure the design fit the web guidlines established by Seattle IT.

Reseach + Data  
SDCI provided us user personas (i.e. first time landlord, unhappy apartment dwellers, and non-native english speakers seeking resources) to help shape the information architecture. I performed a comparative analysis by reviewing apartment finder apps and websites, I also assessed similar govermental sites. Most of the appartment hunting apps were aggregators spitting out long lists of results that could be narrowed further with filters. Many of the agency sites were difficult to navigate and required multiple clicks of the 'back' button to find the service I was seeking. To avoid the shortfalls I'd run into my design had to have easily digestible content, clear information hierarchy, and still be visually appealing.

Wireframes
With established brand guidelines and pre-existing layouts, I was able to build wireframes quickly. This expedited the approval procces and made transitioning to design seamless. Working this way allowed edits to be made very quickly and resent to the client after receiving feedback. During the process I remained in contact with the Seattle IT running ideas by them and working with them to create custom features. Finalizing those features in this phase saved down the road and ensured product viability.

The user flow below demonstrates a renter navigating from the home page to learn about eviction are available resrouces to help.

 

Home Page

SDCI_wireframe

Renter's Resources page

SDCI_wireframe2

Default page template

SDCI_wireframe4

Design
The new design adheres to the updated City of Seattle brand standards and showcases new custom illustrations created another team member. The checklist page is a newly designed feature, unique to the Seattle Department of Construction and Inspection website. 

The site utilizes two parallel user flows, one for renters and a second for landlords and property managers. visitors to the site are immediately funneld into of the two categories and taken to their respective landing pages. Buttons on the home page address the common request and allow user to circumvent levels of navigation, placing them on the appropirate webpage. As each user's visit will be unique, secondary pages include links to related material. This allows users to continue their search for the most appropirate resources to them, even if SDCI does not offer them. Dealing with renters and landlords can be stressful and the new design reduces that stress with clarity and transparency.

Additionally, a UI toolkit and styleguide was created. The guide directs the client on matters including page layout, color use, typography, iconography and the intention behind site design.

Home Page

SDCI_site_design

Renter's Resources page

SDCI_site_design2

Default page template

SDCI_site_design4

 New interactive checklist 

SDCI_site_design6