Unify the Brand Simplify the Message

Research: Design

The design team began the project reviewing the Urban Teachers existing website. They referenced the site’s analytics and studied the web architecture of competitors’ sites. The original site navigation had an extensive array of categories and subcategories, many were unnecessary and overwhelmed users. Urban Teacher's had tried to talk to too many people at once. Conflicting hierarchies of information disoriented users and their help desk received a high volume of information queries.

Solutions: Design

Our principal solution was to minimize the site navigation. Typography and hierarchy would play a leading role in laying out the content and site navigation. Collaborating with the Urban Teachers team, our designers broke down the navigation and decided what pages to combine. From there we developed an intuitive UI, with a streamlined lead flow to drive potential recruits to the application page. We worked directly with the client to build the new site navigation and the Information Architecture page-by-page.

Easier Handling

Research: Development

Our development team initially researched an array of modern platforms to find an option with an accessible frontend for our client and a dynamic backend to execute the design. They decided implementation would require building responsive elements first, using relative units instead of solid pixels, and using a customized navigation drawer for the primary menu. They proposed the site rely heavily on modern, type-only movement. This would keep the emphasis on the content and ensure fast load times with a small data footprint.

Solutions: Design

We selected a combination of WordPress and WP engine to provide the control and customization Urban Teachers required. The development team built the majority of the front-end using CSS grids and re-used as much CSS as possible to keep the site light. Grids are a relatively new system for positioning web elements, but incredibly powerful and responsive. We styled images so the client wouldn’t have to crop or resize them by hand. The site’s content was built to clip after a certain length to make it responsive and mobile friendly. The development team worked to build in systems like these to ensure the client wouldn’t have to worry about their content updates interfering with the integrity of the design.