Update to Program Details Page

Timeline: 1-week design/ 3-month testing • Materials: Pen, Paper, and Adobe Xd UX Techniques: Analytics, Competitive/Comparative Analysis, Sketching, Prototyping, Mockups, Optimizely for Variant Testing


Three Questions a Prospective Students Asks a When Going Back to School:

  1. Do you have my program?
  2. How much does it cost?
  3. Where is the program held?


In this project we are focusing on the third question but see my other projects for ‘Do You Have My Program?’ and ‘How much does it cost?’. There are two possible answers to answer the question, “Where is the program held?”—either online or on campus. The majority of Nation University’s programs are held online, but if a program is strictly on campus, like some of our nursing programs, it will be held at a specific campus location.


The Problem

On the old page, finding useful information, such as program location, number of credits, and important dates, was hard to come by. This was in large part due to the layout for these pages being strictly from a faculty perspective, which was not serving students. We used research, competitive analysis, and persona development to see that format/location was highly important to prospective students. There was a box labeled ‘available online’ that would indicate if the program was online; however, no information was provided about campus location if it was a campus only program.

Example of the old program page not showing information on location


The Solution

In the new design of the program page, we implemented a ‘quick view’ bar. It’s one of the first elements a user will see. This bar includes really useful information including number of credits in the program, enrollment and start dates, and of course, where the program is held.   From our research, prospective students really cared about this information. If they couldn’t find the necessary answers to their questions, they would simply abandon the page, and to go to a competitor that was more clear about this information.

One of the worries with this block was that the information would have to be updated constantly, but having the text be dynamic, and with a yearly schedule of important dates, nothing had to be entered manually.

The ‘Quick View’ block and how it was placed-in from a UI/Visual layout


The belief was that if prospective students were given shorter, more digestible content with better tools, like the ‘quick view’ bar, it would generate more leads and thus they would be more likely to enroll in the university resulting in higher revenue.

Mockup of how the ‘Quick View’ would look in a mobile device

Mockup of how the ‘Quick View’ would look in a desktop layout


The top 5 programs at NU had the following increases after 85 days:

  • MBA Program Page: 52% improvement over original
  • BS Computer Science Program Page: 5% improvement over original
  • BBA Program Page: 97% improvement over original
  • RN to BSN Program Page: 47% improvement over original
  • BS Nursing Program Page: 32% improvement over original

Overall improvement to program pages vs the control/original

Based in sunny San Diego, California

+1 (619) 997-2058