Nick Gassmann

Senior UX designer, The Harker School

Corporate Redesign

A MarCom Platinum-winning design that raised admission conversions by 18%.

My role
UX research lead, UI direction
Scope
Content strategy, information architecture, UX research, visual design
Award
MarCom Platinum
The Corporate Redesign shown on several devices(full size)

Results

After benchmarking, I set conversion goals tied to the school’s business objectives. Visits to the admission pages from prospective families grew 29%, and admission goal conversions rose 18% over the previous year.

The site won a MarCom Platinum award.

Home page design(full size)
Home Page Design A regularly updated background video, focused information architecture, easy-to-spot CTA and fully responsive design.

The Project

With a new division just launched and a slight pivot in the school’s business strategy, I took the chance to design a new responsive website, led by a user-first content strategy. That strategy ended up guiding the school’s marketing across every platform.

My Part

  • A discovery phase showed how prospective families saw the school, and where that differed from how the school wanted to be seen.
  • Personas and user flows for our target users shaped a new information architecture.
  • Several rounds of design deliverables led to the final, award-winning design.

I led the teams, deadlines and meetings, led the UX research, collecting and analyzing the data, and managed group and individual tasks. On the UI, I directed the visual design, including its video and photography, and got stakeholders to sign off on it.

Content Strategy

  • I reviewed the school’s data and documents to build personas and map solutions to its strategic concerns.
  • Stakeholder interviews covered overall messaging, new prospective audiences and the state of the website, and they showed gaps in the messaging.
  • A content inventory showed which pages visitors from outside the school community used most. It later backed up the new information architecture.
  • A review of local competitors showed how their websites told their stories.
  • Four personas, built from the discovery research, set the users the content strategy focused on.
  • Journey maps showed what each persona wanted and what content they looked for.
  • Qualitative and quantitative data supported an information architecture built around what each persona cared about most, which was content about their own children.
Sample user persona(full size)
Sample User Persona

Design

UX design started only after the content strategy was done.

I whiteboarded ideas, mapped them in wireflows and moved them to paper sketches.

Home page sketch(full size)Home page sketch(full size)
Sketches & Wireframes

Once we chose a direction, the sketches became higher-fidelity mockups and working prototypes that showed stakeholders how the design responded on each device.

Responsive example on a phone(full size)Responsive example on an iPad(full size)
Responsive Examples

Last came the UI: color, type and the rest of the visual design.

An inside page hero(full size)
Inside Page Heroes Most pages feature a hero image or background video that highlights how the school fulfills the interests and needs of the page’s/section’s targeted persona. A brief summary of the section is written according to the outlined content strategy.
A UI animation on an inside page(full size)
Tasteful UI Animations Some elements are highlighted with UI animations that do just enough to grab the attention of users.
Creative UI elements on an inside page(full size)
Creative UI Elements UI elements allow for detailed content to exist without it impeding the decision making of the user.