Norfolk State University
Case Study
Norfolk State University
Norfolk State is an HBCU with deep roots in the local community and a proudly supportive alumni base. It has strengths in technology, sciences, nursing, business, and liberal arts but an academic reputation that lags behind actual performance. As one stakeholder characterized the institution, “We often fail to tell about the good work we are doing”
Its web site at the time was a conglomeration of over 200 web properties with siloed content and a decentralized editing/authoring system that lacked cohesive governance. My charge was to bring the site under a single content management system, align it with recent branding efforts by agency Fuseideas, and tell the NSU story.
The multi-faceted audience extended well beyond the complexity typical of high-ed sites and included active duty military from nearby Naval Station Norfolk, first generation college students, and – as it turns out – the cabbie who picked me up at the airport (and whose remarks found their way into my findings presentation).
My final recommendations formed the foundation for a new, responsive web site:
- Create site that primarily targets prospective students and their parents with content that answers their questions
- Provide appropriate content for other audience groups and channel them thoughtfully
- Reflect the new branding initiative developed by Fuseideas
- Tell the NSU story authentically and in the context of its rich history and place in the community
- Break the silos and make content easy to find
- Build on modern CMS for ease of content development and maintenance
- Create and implement a governance plan
Tasks & Deliverables
- Week of on-campus discovery workshops with stakeholders and student groups
- Heuristic review of NSU and related sites (Landscape Analysis)
- Personas & user journeys
- Discovery findings with stakeholder presentation
- Site Map
- Wireframes
- Functional Annotations / Development Specs
Similar Projects & Clients
- Boston College
- Dean College
- Dominican College
- Goucher College
- Hamilton College
- Iona College
- Massachusetts Institute of Technology
- Northeastern University
- Plymouth State University
- Simmons College
- St. Anselm College
- University of Virginia Darden School of Business
- William Paterson University
- Wilson College
Work Samples
Landscape Analysis (Heuristic Review) Sample Screens
Summary findings presented as a heat map (green = excellent, red = very poor). The heuristic criteria evaluated are listed along the top with averaging in the right-most column.
Screen showing highlights of heuristic evaluation of NSU site. The full report included a deep-dive analyzing the university across all heuristic criteria considered.
Sample screen from best practice call-outs gleaned from Landscape Analysis.
Site Map
Because the prior web site was extremely siloed, the NSU site had to be completely restructured to bring it into alignment with branding and audience-centric communication objectives. This high-level site map was actually presented in the Discovery Findings Report to obtain client buy-in for the new direction before delving into the more granular site map below.
The detailed, final, site map shows pages as far into structure as the quaternary level. Given that higher-ed sites often have thousands of pages, many of these pages also have child pages and sections not explicitly called-out. To aid content development, I often map-out representative site sections (e.g. Academic Departments) that can be repurposed elsewhere in the site.
Wireframes – Sample PAges
Home page wireframes for NSU in desktop and mobile variations:
1. Main menu navigation
2. Hero space for primary messaging
3. Audience segmentation menu, allows exploration through self-identification
4. Spotlight region with optional video
5. Rotating factoids
6. News and social modules
Note: Unless the project parameters dictate otherwise, I intentionally keep wireframes rough and low-fidelity. I have found over the years that higher-fidelity wireframes tend to prematurely lock-in visuals and create unnecessary design contraints. Competent visual/UI designers are best left with broader creative freedom and high-fidelity wireframes tend to lead to unintended design decisions.
Additional wireframes showcasing program search functionality and destination page. On the search page:
1. Reassuring information on being undecided (surprisingly important)
2. Program search form
3. Sortable search results
And on the program description page itself, a structured presentation of information leading to end-funnel calls-to-action:
4. Background on the degree program
5. Description of courses and program requirements
6. Program outcomes and student success
7. Critical calls-to-action leading to different points in decision funnel
Functionality Annotations – Sample Page
Coding of the NSU site was completed by the agency development team in Prague. To facilitate a smooth transition of the site vision, I annotated a set of black-and-white design files with functionality notes.
Every component/widget on the site was tagged with a pop-up tool tip so that developers could follow-along visually as they built out the new site.
By way of example, four tool tips are shown in an open state on the home page design.
Personas & User Journeys
This persona represents the parents-of-prospective-student audience archetype. One of six personas developed for NSU, it is broken into three screens. This first screen covers James and Aisha’s key characteristics, challenges and opportunities posed when helping their daughter select a university, their overarching mindset, and high-level takeaway from visiting the NSU site.
The second screen of the Parents persona shifts to the tasks James and Aisha will be performing on the NSU web site. these tasks take place over multiple site visits throughout the application process and represent their journey through the decision funnel. These tasks are later used to define milestones in their user journey.
The third screen of the Parents persona links thier site visits back to NSU’s business objectives.
User Journeys were developed for each of NSU’s Personas. These play out over several screens, representing multiple site visits as the parents become engaged with the university through their daughter’s college selection process. The Journeys cross-reference user tasks identified above to help shape an audience-centric site and inform site map development which followed.