DIGITAL AGENCY UX ASSIGNMENT

I was invited to tackle a take-home assignment for a UX Director position at NYC based Digital Agency. The assignment is designed to show how a candidate approaches and solves problems. It's based on an actual client assignment, but the name and city have been changed, for obvious reasons. I received the assignment on a Friday evening and had a scheduled appointment to present my work on Tuesday afternoon to the team.

THE BRIEF

THE COVER: 

"HI, HERE’S YOUR UX ASSIGNMENT
Thank you for agreeing to tackle this take-home assignment. This process will provide us with a glimpse into how you’d approach this type of project. We’re excited to see what you come up with!"

ABOUT THE CLIENT

"We’re working with a prominent graduate school called Lemarr School of Public Health located in Washington, DC. The School is a global leader in the development of science, policy, and programs that improve health and prevent disease and disability. Addressing everything from chronic disease to health care policy, the School tackles today’s pressing public health issues by translating research results into action. Pretty important stuff!"

PRIMARY TARGET AUDIENCE

"Our primary audience includes prospective graduate students interested in a career in public health. We know that prospective students already visit the site with the intention of enrolling, mostly due to the Lemarr School of Public Health’s great reputation.

Unfortunately, the current site is so unattractive and disorganized that after visiting they often think twice about applying. An important secondary audience includes members of the general public interested in gaining access to the latest high-caliber public health information. Members of the public want to learn about the latest news, research, and progress in a specific field, but when they visit the site they’re unable to locate useful information on all the great work being done and progress being made."

THE CHALLENGE

"First, craft a top-level navigation scheme that communicates how the Lemarr School of Public Health is on the pulse of public health today. The School spearheads incredible research that is positively changing the health of populations in its community and around the world, and the navigation structure should do a great job of telling this story. The navigation system should also include clear user pathways that make it easy for prospective students to get excited about the possibilities an education from a public health school provides.

Next, include the navigation scheme you create in an engaging homepage wireframe. The existing site content is lacking, so you’re encouraged to dream up new types of content that tell the School’s story in a captivating way. Also, please include a short brief that explains your thought process behind creating these deliverables, as we’d love to learn a little more about how you approached this assignment."

SOME INSIGHTS

• "Graduate students care deeply about the faculty who will be teaching them. Top-tier candidates often choose a specific graduate school so they can work side-by-side notable faculty members.
• Career path options for the field of public health are generally not well known. Because of this, students don’t understand what kind of future / career a degree from Lemarr could lead to.
• According to past research, “About” sections in the main navigation of university websites often get very little traffic. Users find very little value in them. After all, the entire site should be about the school, right?
• School websites often have similar top-level navigation items (Academics, Life on Campus, and so on). While this core content is often necessary, it’s important to give it a unique spin. Coming up with thoughtful (and appropriate) navigation labels can help shed light on what makes a school unique."

What I delivered

1. A document that showed my process, (below) from research to analysis, decision making and design.
2. A presentation on InVision that was essentially an executive summary of the process document.

THE COVER

"HELLO, HERE’S MY PROCESS DOC
Thank you for giving me a chance to solve this take-home assignment. This document will show the process and approach I took to solve the challenge. I’m excited to see if we share similar thinking and hope I can bring something extra to the table."

INTRODUCTION

The purpose of this document is to show how I typically work on a problem like the one you gave me. When solving a big website design or redesign, I like to learn as much about the client, their business & customers as possible. I then try to immerse myself in the world of their target audience. The best way to do this is to talk to real people and get a sense of their hopes, dreams, and desires. Then I can tell compelling stories, use the right language and ultimately sell our client’s product to that audience. What I did instead was research as much as possible online to find proxies.

First, I had to learn as much as I could about Public Health, Public Health graduate programs and the people who are passionate about “protecting and improving the health of individuals, families, communities, and populations, locally and globally.”1

I started with a competitive assessment to see who, if anyone, had a great website. The assessment allowed me to do a deep dive into the world of Public Health graduate programs and find a pattern for the prospective students user journey. The assessment also gave me a chance to find a client that best matches the brief.

I chose Harvard T.H. Chan School of Public Health to redesign. My criteria was simply a School, in a metropolitan area, whose website was in serious need of a redesign. I created a sitemap of the entire site, so I could understand the content, find patterns and hopefully a better way to organize it. This exercise could have been risky, because of the limited time to do the assignment, but I felt it was important, and there isn’t better way to find those hidden gems of content that could be up to a more prominent area of the site.

I wanted to know what the goals, concerns and motivations of the user were. Finding profiles of students, faculty and alumni online proved to be easier than expected. What I learned was the pursuit of higher learning in public health is based on professional or personal experiences that move one to transform their career from treatment to prevention.

I used this information to form my design decisions for the navigation scheme and the homepage wireframe.

I thought it would be a nice touch to use a template that matched the brief, my apologies if I broke some brand guidelines in my attempt.

 1 Association of Schools & Programs of Public Health (ASPPH)

COMPETITIVE ANALYSIS

I chose several sites to compare how they organize and prioritize content and navigation. My first choice was based on a general search for graduate schools, “any school of public health.” The result I chose was Indiana University Bloomington. I reconsidered my search criteria when I realized the School wouldn’t be a real competitor of Lamarr.

I then searched for “graduate degrees in public health,” and followed the “US News & World Report, Best Grad Schools.” Which appeared in this order:  

1. John Hopkins Bloomberg School of Public Health
2. Harvard University
3. University of North Carolina--Chapel Hill
4. University of Michigan--Ann Arbor (I somehow skipped this site.)
5. Columbia University
6. ...Etc. A total list of 44 schools.

I wanted to find an existing website that matched the brief; a prominent School of Public Health, with an excellent reputation, in a metropolitan area, that has a poorly designed web experience. I was hoping to work with real content. I then captured screenshots of the journey as I learn what a typical user experience is, and what sites do it well according to my assumptions and hypothesis. I looked for patterns to determine what works.

Skip to the last page in the section for my quick notes on each site.

Indiana University Bloomington  http://www.publichealth.indiana.edu/

John Hopkins Bloomberg School Of Public Health http://www.jhsph.edu/

Harvard T.H. Chan School Of Public Health http://www.hsph.harvard.edu/admissions/degree-programs/master-of-public-health/

UNC Gillings School Of Global Public Health http://sph.unc.edu/

Columbia Mailman School Of Public Health https://www.mailman.columbia.edu/

QUICK CONCLUSIONS

Indiana University Bloomington

http://www.publichealth.indiana.edu/

The site design is dark, feels dated and unsophisticated, the information design is complicated and overwhelming. I had a difficult time finding information and wasn’t excited by the content. I reconsidered my search criteria to look for a more realistic competitor.

John Hopkins Bloomberg School Of Public Health

http://www.jhsph.edu/

Finding the information I was looking for was easy. The user experience is very logical, and all the information you need is there. The visual design is appealing and felt very contemporary. Overall, a very goal-oriented user experience. It seemed like there was a half-hearted attempt at providing more emotional/inspirational content, but there was very little of it, and it usually appeared in a sidebar.

Harvard T.H. Chan School Of Public Health

http://www.hsph.harvard.edu/admissions/degree-programs/master-of-public-health/

I arrived on the site by clicking on a deep-link from Google and was immediately overwhelmed by all the navigation, so much navigation. Clicking around on the site to find information was confusing. Navigation items with different labels linked to the same pages. Items that were in shared navigation led to different sites. There was a lot of cross referencing between current student content and prospective student content. The visual design is cluttered with many competing elements. After you leave the main page, a “Request Information” form appears on every page. The photography on the site is of inconsistent quality, with some photos being of distractingly bad quality. Starting over from the School’s homepage helped with way-finding, but only a little.

UNC Gillings School Of Global Public Health

http://sph.unc.edu/

Very straight forward, relatively easy to use, and very boring.

Columbia Mailman School Of Public Health

https://www.mailman.columbia.edu/

Wow! Just wow. You guys nailed it. So, this assignment just got a lot harder.

UNDERSTANDING THE USER

Here is my initial list of questions:

• What are the primary goals, concerns and motivations of the user? 
• What criteria do they use when choosing a graduate program?
• What criteria do they use when choosing a school?
• If faculty members are an important factor, how do they know or hear about them?
• What different types of users are there for this school/program?

II was feeling a bit lost, so I started going through my mental Rolodex, who did I know that could answer some of these questions? I had two potential candidates, one who went to Columbia and had an MPH in Epidemiology and another doctor who would be an excellent candidate for an MPH. Then I stumbled upon a link on the Indiana University site to the ASPPH (Association of Schools and Programs of Public Health) website. It was a direct link to the Study: Behavioral and Social Science page. At the bottom of the page was three profiles, a PhD, a student without a field of study, and an MPH. There are over 50 profiles on the site; I used these as proxy interviews. The profiles didn’t answer my initial questions, but they helped provide insight into the target audience. Here is a list of questions used to create the profiles:

• In one sentence, what is public health to you?
• What inspired you to study to public health?
• What has been the single most rewarding experience of your career/studies so far?
• What is the one piece of advice you wish someone had given you when you were starting out in public health?
• What do you think is the biggest challenge that the public health field should be focusing on?

ASPPH PROFILES

WHAT I LEARNED

The pursuit of higher learning in public health is about passion for change. Based on professional or personal experiences that move one to transform their career from treatment to prevention.

When current students, alumni & faculty tell their stories, whether written or in video format, it’s a much better sell, than the School marketing themselves. It also helps the problem brought up in the brief that, “Career path options for the field of public health are generally not well known. Because of this, students don’t understand what kind of future / career a degree from Lemarr could lead to.”

A classic case of “show, don’t tell.”

SITE REDESIGN

I needed to find a proxy for Lemarr School of Public Health — a prominent School of Public Health, with an excellent reputation, that is in a metropolitan area & that has a poorly designed web experience. During my competitive assessment the Harvard T.H. Chan School Of Public Health seemed like a good candidate. I wanted to solve the problem with real content.

I started documenting the site with a site map. This exercise appeared to be relatively simple as there wasn’t very much content. I was mistaken. The site is huge and terribly confusing to navigate.

I did find a lot of broadcast quality videos that were either very compelling or inspirational. This content wasn’t featured on the “Admissions” area of the site, nor was it easy to navigate to. There are also several podcast series that have a Public Radio style reporting and storytelling feel to them. Most of this content was not only appropriate to show how amazing the work is that’s being done at the School, but one video series, “Why Public Health” was created for prospective students. The videos don’t appear on the home page, and only one video is promoted but at the bottom of one of the pages deep in the “Admissions” area of the site.

WHAT I LEARNED

The content on the site is quite good, inspiring even. The School seems like the most perfect and challenging place to get your degree. With top-notch faculty, facilities and a wonderful environment. The best of the best, except for the website design.

HARVARD’S CURRENT SITE - SCHOOL HOMEPAGE

HARVARD’S CURRENT SITE - ADMISSIONS HOMEPAGE

SITEMAP OF EXISTING SITE

SOLUTION

NAVIGATION

The content on the site fell comfortably into what the brief asked for, five sections: 

• Up-to-date news about Public Health
• An area highlighting Research that could take a user down a path with more detailed information further down the journey 
• Academics
• Faculty (Since there is so also content for current students, faculty, alumni and supporters, you could group these all into one section -— People.)
• How to become a student

This categorization is essentially the Columbia navigation. 

I tried to imagine what could be the opportunities to tweak and adapt the sections for Harvard.

...And, then played with the labels.

Homepage WITH NAVIGATION SCHEME

HOMEPAGE WITH NAVIGATION SCHEME –  MENU OPEN