CityU Product Website Redesign — A UX Case Study

What is CityU?

Since 1973, City University of Seattle has been relentlessly reimagining higher education in the Pacific Northwest and around the world. As an accredited, private, nonprofit university, our mission is to provide career-relevant education to busy professionals who want to advance their careers and compete in the global marketplace.

Design Process

What follows in this case study is an in depth look at  how I redesigned CityU’s website. The website has to be more than a marketing website– it has to function to get a prospective student to take action– to become a current student. Therefore, the school’s website must function as a product itself. Instead of being mostly informational, as a marketing website traditionally is, CityU’s new product website will have optimized user experience in order to obtain new students. I have documented the process, my thoughts, methods, wireframes, prototypes, and finally the live site. The design process I followed progresses through five stages of user centered design: Empathize, Define, Ideate, Prototype, and Test.

Empathize

Why Redesign?

After a careful analysis of the CityU website by our analytics team, our team determined that the website needed the following changes:

• A streamlining of their messaging towards the working adult and transfer student; “all about the finish” leaves students feeling like the only thing CityU cares about is finishing their degree.
• A simplification of the UX experience; unless you know what you are looking for, it is a struggle to find what you need.
• A revision and refresh of the content to be more concise and have a more distinctive brand voice.  
• A redesign of colors, fonts, and imagery to be more modern, image-forward, and Seattle-focused.

Who is the Audience for CityU?

Working Professional

• CityU serves the working professional, an individual who is pursuing a promotion or career change while juggling a family and/or a full-time job making pursuing a degree feel particularly difficult.
• The average CityU student is between 37-45; 62% of their audience is female.
• They are professionals who are wanting to go further in their careers—who need to go back because they want to grow in their industries.
• The CityU prospective student is someone who understands that it might be “hard”, but they refuse to be a part of the pack. They’re hard workers and want to contribute to the world in their own unique way. CityU serves as the catalyst for this.

International Student

• The international student is a traditional college student in their beginning years of education, typically between 18-24.
• These students are go-getters and are willing to do whatever it takes– study the long hours, stack courses and/or work late nights if that’s what it takes.
• These are individuals with entrepreneurial spirits and goals; they are often one of the first in their family to get a college degree leave the country.
• These students are driven by their home-country pride and providing opportunity for their families or futures. They want to know how the university is going to support them in not only their education, but also their careers.
• Passion-driven and determined to succeed, these are individuals that need to feel as though they are surrounded by faculty who care about their future.

Quick Competitor Analysis

Common Patterns Observed:

• Clear CTA (call to action)
• Better engagement with RFI (request for information)
• Better flow and understanding of hierarchy
• Quick facts or program pages to help user know more about the program quickly
• Tuition Calculator

Define

Identifying Problems in the Current Website

• Unclear CTA
• Navigation menu is split and upside-down
• The website looks outdated with silhouettes (very 90s)
• The real brand value is not visible
• Not able to find program pages easily
• Color contrast violations everywhere; not WCAG compliant
• Flow hard to follow, no real presence of hierarchy
• Pages hidden under non-related parent and child pages (site architecture problem)
• Old, outdated, and duplicative page/content (problematic for SEO)

Problems in the “Current Use” Cases

At first glance, the user is not able to:

• Understand what CityU is
• Find a related program in their field of study
• Find student services information
• Understand what happens after they fill out an RFI

Measurement of the New Redesigned Website

• Increase traffic volume and page sessions to the Program Finder
• Increase engagement with RFI
• Allow for ease of use for both US Domestic and International audiences

Key Benefits

CityU offers numerous benefits, with these as their focus:

• A 55.1% Completion Rate compared to the national average of 22.5%.
• One-on-one staff support – they’ll have someone not only rooting for them but helping them every step of the way.
• A focus on helping current and prospective students through the “start” and “stop” process they go through when trying to work to finish their degree; CityU understands finishing is hard, they want to help through every obstacle.
• A range of 60+ programs both offline and online – a mixed media version of college that will allow students to finish on THEIR timeline; CityU is built for the working adult.
• A strong international presence and relationship with international partners; there are many locations throughout the world  including Canada, Slovakia, Mexico, Czech Republic, Switzerland, China, etc.
• Faculty that are professionals in their industry, who can share hands-on, in-the-field experience with students.

Ideate

Solutions – Things to Have

These are key objectives to implement on the website in order to solve most problems determined from the current website:

• Improve and simplify the User Experience, making the navigation of key pages a seamless experience across all user types.
• Streamline the experience for each inquiry type, including but not limited to application type, prospective student, current student, and general population base.
• Increase brand visibility in the local market presence and offerings that help CityU stand out from the crowd.
• Increase the amount of website engagement, lead generation, and applications.

Content Inventory / Audit

A content audit can be one of the most tedious tasks of the entire redesign process. But this is probably one of the most important because it allows you to understand just how many pages there were on CityU’s original website and what needed to be deleted, merged, or added. This process is essential in helping to see the big picture of the website’s problem and is a starting place for a redesign to take shape.

List of all pages and what to do with them

Card Sorting and Information Architecture

Our team conducted a card sorting activity in effort to develop the Information Architecture for the CityU website. This method involved crawling the old site, making a sitemap out of it, then auditing it.

It was immensely helpful to get all stakeholders in a room and have all out on the table. This gave us a valuable opportunity to probe and give rationales behind the decision-making process. This helped us to uncover key quantitative insights that couldn’t be deduced otherwise.

We also relied on analytical data from the old site to give us information on what pages were the most popular and thus most important to users and to make sure to highlight or elevate them within the site architecture.

Tasks and User Flows

Now it was time to come up with user flows. We wanted to test our flows by creating different tasks for users to accomplish and then see how easy or difficult it was for them to complete them based on our proposed IA. There were several tests that we asked users to complete. One of the most important tasks we set was:

You are a prospective student who is looking to go back to school, and want to see if CityU has a MBA program. Go to the CityU homepage and find the MBA program page.

Old user flow for finding a program

Our Flow Results

In the old flow there was no filtering system. A user would have to find their program by navigating through school pages, then department, then program, which is not a good experience. Users do not know the intricacies of programs and the departments they fall under, let alone the school. It might make sense to faculty, which is who recommended this journey, but a prospective student lacks this background knowledge thus making the experience confusing.

To fix this problem, we implemented an area of study, which users better understand. The flow now is quite innate and feels very natural, not forcing the user to look hard for what they want to accomplish.

New user flow for finding a program

Wireframes, Mockups, and Prototypes

The team then had a kick-off meeting to discuss and define the desired templates needed for development to build out the entire site. We came up with a total of fourteen:

• Homepage
• Menu
• Search
• Program Finder
• Program Detail
• US Domestic Admissions
• International Admissions
• Student Services
• Locations
• Partnership
• Blog
• Blog Post (Single)
• Catch-All with Side Rail
• Catch-All without Side Rail

I started by making sketches on a pad of paper in the meetings. Once I understood the flow and what was needed on the page, I took what was written down and put them into a low fidelity wireframe using Adobe Xd.

Low Fidelity Wireframes

Low Fidelity Prototype

This prototype shows the user flow of the Program Finder page.

Brand Style Guide

Once the wireframes where signed off by all stakeholders, including development, more of the visual aspects were brought in. This was mostly done through a brand style guide which was part of a bigger project to launch a new brand campaign for CityU.

High Fidelity Mockups and Prototypes

I designed the final UI of the website in Adobe Xd.

Prototyping in Xd for a High Fidelity Interactive Prototype

Test

You can play with the Xd prototypes here: Desktop Prototype and Mobile Prototype or visit the live site at CityU.edu.

What’s Next?

The design needed to be live and tested for feedback and further improvement. The site launched in July of 2019 and in its first week, RFI Submissions (one of our main goals), were up 212.5%.