CHPC New York

UX/UI Designer    Nonprofit Website    August - November 2017    Completed at Ironpaper

CHPC New York

  UX/UI Designer

•  Nonprofit Website

  August - November 2017

  Completed at Ironpaper

CHPC New York

  UX/UI Designer

  Nonprofit Website

  August - November 2017

  Completed at Ironpaper

CHPC New York

  UX/UI Designer

  Nonprofit Website

  August - November 2017

  Completed at Ironpaper

PROJECT OVERVIEW

In August of 2017, Citizens Housing Planning Council of New York (CHPC New York) brought in Ironpaper to lead the design and development of a brand-new WordPress website for their nonprofit organization. I worked with the team at CHPC to design and launch the new site in the lead up to a national exhibition at the National Building Museum in Washington DC.

CHPC develops and advances practical public policies that support the housing stock of the city by better understanding New York’s most pressing housing and neighborhood needs.

CHPC isn’t just a research organization or an advocacy group comprised of members with their own agenda: they perform original research that adheres to a more rigorous methodology than many academic organizations, approaching  subjects with no preconceived notions, ulterior motives, or special interests.

Based on the findings of their in-depth research, CHPC develops recommendations & potential solutions with the goal of benefitting the housing market as a whole.

OBJECTIVES

  • Make CHPC feel relevant, inspiring, helpful and accessible to key constituents.

  • Improve upon the aesthetics, messaging, utility and user-experience of the current site.

  • Create a website that supports CHPC’s research into relevant issues and shifts in the housing market. CHPC doesn’t react to trending topics in the housing industry: it creates them.

  • Honor CHPC’s rich history, which dates back to 1937, by highlighting archival gems an ensuring that all historical publications are available to the public. 

Original CHPC New York Homepage

chpc-original-homepage

THE APPROACH

Competitor Research

To get a better sense of the landscape within which CHPC New York operated, and to help inform our SEO strategy, I conducted competitor analysis around CHPC’s two key missions: research and advocacy.

chpc-competitor-research
Website Audit & Information Architecture

Using Screaming Frog and the existing sitemap.xml files, I crawled and exported the entire website contents into Google Sheets. I then used an updated taxonomy to determine which Categories should migrate to the new site and sort out where we expected each project to fit in the new site architecture.

chpc-audit

Based on the results of the audit, I re-architected the bulk of the site content within two key sections: “Research” (the broader categories of projects completed over the course of CHPC’s tenure) and “Impact” (an index of the various results of that research, including publications, policy advocacy, and interactive tools produced by CHPC’s team).

chpc-sitemap
Wireframes

For the new homepage, I wanted to balance emphasizing the key mission of CHPC New York with a collection of recent project and fundraising updates. Their current site had become a Frankenstein of tagged posts, carousels, and broken whitespace.

Initial Homepage Sketch

chpc-homepage-sketch

I wanted the new homepage to convey the prestigious legacy of this organization and provide easy access to the latest news and publications created by the CHPC team.

Additionally, I thought it would be a nice touch to add a visual representation of CHPC’s New York location by including a map of Manhattan in the footer.

Homepage Wireframe

Version 2

chpc-homepage-wire

For the main Research & Impact pages, I opted for an interface that would enable the user to browse CHPC’s large wealth of content based on topic, sort by post date, or search by keyword.

Research Overview

chpc-filter-listing

I used two methods to integrate relevant content into the Research projects: RSS feeds (most often used for project updates and relevant events) and flexible content areas (used to feature research publications, policy results, and interactive tools).

Research Project

Version 2

chpc-filter-result
User Interface & Visual Design

Before diving into the high-fidelity page layouts, I worked with my colleague Mark Edwards, who created a simple moodboard that reflected the visual patterns we wanted to explore with the new website design.

Website Audit & Information Architecture

Using Screaming Frog and the existing sitemap.xml files, I crawled and exported the entire website contents into Google Sheets. I then used an updated taxonomy to determine which Categories should migrate to the new site and sort out where we expected each project to fit in the new site architecture.

chpc-moodboard

Once we received buy-in, I carried the patterns established in our moodboard and homepage design throughout the patterns we created during the wireframe process.

We also contracted with a local illustrator to create a customized, striking visual for the homepage hero area.

Homepage   •   Research Overview      Research Project

KEY TAKEAWAYS

After the website launched, the client was thrilled. The project was completed on time and helped CHPC New York represent their brand at a high-profile exhibition opening. Sarah Watson, Deputy Director of CHPC New York, shared the following feedback with our team:

“I want to say what an extraordinary experience it has been working with your team on our website. Even though I can see it with my own eyes, I cannot believe that you guys were able to fulfil our incredibly tight timeframe and have it online in just over 3 months. The project management, communication, responsiveness, diligence, and warmth of your staff really is exceptional. We were even a little sad to finish working on it. We will be tweaking a couple of things in the next month but overall we are absolutely delighted with the result. From my initial phone call with you to the final handover of the site, it has been an absolute pleasure to work with your team – especially Nora.”

More Work

CHPC New York CityProject type

MobilewallaProject type

GZERO MediaProject type

JoynProject type