Web designNew work

How New York City redesigned its website

The city of New York's public service website has just undergone a major overhaul. We find out how it was made.

For the first time in over a decade, NYC.gov has undergone a major overhaul, developed by Brooklyn-based digital design agency Huge, the New York City Mayor’s Office of Media and Entertainment and the Department of Information Technology and Telecommunications.

We spoke to chief experience officer at Huge Michal Pasternak about the redesign...

Q: What was your design approach on this project?

Our vision was to do two things very well: First, create an experience that is a true resource for New Yorkers. An experience that enables users to quickly and easily complete simple tasks. Second, to provide a way for the mayor and the city to share all of the initiatives they are doing in more compelling ways. There are so many great things the city is doing for its citizens that are buried in press releases every day.

We used a very iterative design process working in collaboration with the City

We used a very iterative design process working in collaboration with the City. While part of our team worked on the content strategy and information architecture, another group created design concepts to get the main interactions and look and feel right. Then we moved into detailed design, building out interactive prototypes and testing with real New Yorkers (who are never shy about sharing their opinions).  Finally we partnered with NYC's tech team to bring the site to life.

NYC.gov

Q: What did you use to develop the site?

To develop the responsive, front-end interface for NYC.gov, we used HTML5, CSS3 and Javascript. The City's Department of Information Technology & Telecommunications owned the integration and back-end work.

Q: How did you improve the site's usability and accessibility?

Our main goal was to create an experience that would make it easy for New Yorkers to accomplish tasks and find information they need. The old site was quite flat with thousands of pieces of content that were hard to find.

We organized the experience into eight buckets

So we organized the experience into eight buckets. From a development perspective, we designed templates that would work across those buckets with modules that could be swapped out in the CMS as needed.

This approach also helped us plan for the future; by developing templates with modular components, the city can then extend code framework and style guide across its many agencies to create a more unified look and feel across all of its digital properties.

We went with a responsive framework so that users could interact with the site on any device.

Q: Did you use any new or notable techniques to develop the site?

We used up-to-date front-end tools and frameworks such as Modernizr, SASS, Jquery, Javascript Mustache Templating, Compass, and Susy Grid to develop the new site.

The technique we had in mind was to create a standard modular template that can be reused, so that the city can grow and scale the system over time. The last redesign of the site was in 2003, and our hope is that this one surpasses that 10 year mark.

NYC.gov
NYC.gov

Liked this? Read these!

Have you seen any cool web design projects recently? Let us know in the comments.

Advert

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

site stat collection