Avantrogue was commissioned by the Fox School of Business (FSB) at Temple University to help relaunch the Fox School of Business’ website. We worked closely with the Fox School team to identify user experience issues within the current website, created wireframes to guide the reorganization and design of the site, and ran moderated and unmoderated user tests to prove our initial hypotheses.
Initial findings
We performed a cursory audit of the site’s functionality and content. What we turned up was small usability issues (very large main navigation, atypical secondary navigation), the underlying issue was that the entire FSB site had been made to reflect the internal organization of the business school itself, which is not how visitors to the site would inherently understand the content. For example, a first-time user of the site who wants information on a specialized master’s degree in hospitality would not know to go through the HR department to find that information.
Goals
The major issue with the current FSB site was that it presented too many options for visitors, and made no clear distinction on which content was for any single group. Our goal was to create a more linear user journey, allowing users to self-select into different audience types from a broad level down to a course-specific level. We would accomplish this task by doing the following:
- Reorganize content to be user-centric. The largest underlying problem on the existing website was that it followed the internal structure of the business school itself. A user interested in a master’s degree in hospitality wouldn’t know that information for that program was housed within the HR department section, for example. We reorganized the content by audience: Undergraduate, Graduate, Professional (Certificates, DBAs), and Businesses and housed programs within each section. Users could then explore similar options without having to visit different departments.
- Create a mobile-first design scheme that translates to desktop. It is a fact that most websites now receive more mobile traffic than desktop traffic, and FSB was no exception. However, what we noticed is that many users would visit the site first on mobile, but come back and start their application on desktop. We had to make sure the site was easily navigable on mobile, but that users could easily replicate that experience later when they revisited the site on desktop. The current site had responsive design, but many subpages had clunky navigation tools between the primary and secondary navigation.
- Clear the ‘hero area.’ The ‘hero area’ is the major area on a web page below the navigation: the area where the eye naturally falls once the page has loaded. This is a key area to get right: a successfully designed hero area provides context to what is on the page, and provide some quick options before getting into the body of the page. The existing site made use of this area, but used text-heavy treatments with long-copy buttons which were difficult to read. Reducing the design noise in these areas, adding rich media (videos, images) coupled with high-value calls to action were implemented to increase engagement.
- Presenting a pared-down navigation structure rather than a mega-menu. Mega menus have their specific use-cases, especially when an audience is familiar with the many options a site offers (like e-commerce), but with an audience like education, it made sense to limit these options so that a user would select “MBA Programs” before selecting “Executive MBA.” This would allow the user to thoroughly weight all MBA options before choosing the one most suited to their needs.
- Redesigning the secondary navigation. The secondary navigation on the existing FSB site ran horizontally below the hero area, which is an atypical location for a secondary navigation. This had to be moved, but to where? We incorporated a mobile-type secondary accordion navigation which could be minimized when not in use. This allowed the designer to use the full page width for content rather than having to sacrifice precious page space for a secondary navigation. On mobile, the secondary navigation was hidden inside the regular navigation.
- Promote the student/human element of the Business School. In connection with the user-centric content reorganization, we wanted the new FSB site to tell the unique FSB student story: one of success, hard-work, and opportunities. We would accomplish this by featuring current student spotlights within each major and program, jobs and salaries one could expect to have upon graduation, and showing companies
Before and After
Testing
We performed moderated and unmoderated testing to see how different personas reacted to the new content organization, navigation, and layout. We performed a total of 12 moderated tests and 6 unmoderated tests using Validately. Test subjects were recruited from inside the Fox School’s user list, and we made sure to have representation for outlier groups such as veterans, and international students as well. It’s important that these subsets of the general population be able to identify content specifically for them, so they were asked to locate those pages during the test as well.
The tasks were meant to mirror those of a a first-time user, and revolved around information gathering. Find the list of majors and minors offered for online undergraduate students, find out when the next informational session is for MBA students, etc. While some interior page information finding was difficult, it allowed us to better prioritize content for the general user population, and gave us further insights into the kinds of content users expected to see inside the site itself.
Results
To gain an objective view of the usability of the new site, we measured four factors over 50 different tasks:
- Qualitative ease of use
- Time on task
- Availability of information
- Errors encountered
We then asked the participants to rate their experience with the new FSB site from 1-10, as well as rate the current FSB site, other sites within Temple University’s purview, and other business school sites visited. Here were our findings:
- All Business School Sites Visited: 5.67
- All Sites within Temple University: 8
- Current Fox School of Business Site: 7.33
- New Fox School of Business Site: 8.67
The new site scored 18% higher than the current FSB website, and higher than all other Temple University websites. By refocusing the content, navigation, and overall experience around the user, rather than the organization, Avantrogue was able to improve the Fox School of Business’ website user experience for the persona groups of highest concern, leading to greater overall satisfaction with the Fox School of Business. Even a single point increase in conversion rates for the Fox School would mean an additional $50-100k for the university.
It has a very nice flow to it. Sleek.
If I was a perspective student I would feel compelled to attend Temple University. It was easy to gain access to info regarding various degrees.