SAIT Campus Map Redesign

Design System Case Study

Helping Students Find Their Way

The Southern Alberta Institute of Technology (SAIT) tasked my team and I with this project in redesigning a page on their website to enhance the user experience. Over three months, we gathered data to analyze pain points and create a solution that met student needs.

Timeframe
3 months

Tools
Figma

Team
Me (UX/UI Designer and Researcher)

Emma Dirks (UX/UI Designer and Reacher)

Yunna Jeon (UX/UI Designer and Researcher)

The Results

  • Made it easier to explore campus independently

  • Reduced confusion when navigating unfamiliar buildings

  • Students found classrooms faster and with less stress

  • Allowed returning students to adapt quickly to new schedules

The Problem

SAIT’s Interactive Map had usability issues that made it hard for both new and returning students to navigate campus. Key details like room numbers and floor plans were missing or unclear, causing confusion and frustration.

Design Principles

Inclusive Accessibility for All SAIT Students

Designed to support both new or returning students and considers international users and language accessibility.

Clarity in Structure for Visuals & Information

Minimize cognitive load through clean visuals and well-organized content, making it easier for students to find information fast.

Research and Data

Starting a new semester is already stressful and an unclear map only adds to that. Both new and returning students often struggle to find classrooms. A more intuitive, user-friendly map would ease navigation and help students focus on their academic journey with less worry.

Competitive Analysis

We began our 4-stage research process with a competitive analysis of local institutions like MRU, UCalgary, and Ambrose University to focus on the strengths, weaknesses, and user needs met by their interactive maps, as well as potential features we could apply.

What we Found

  • Standalone Map Page
    Competitors host maps separately for better performance and features

  • Layer Customization
    Users can toggle things like pathways, services, or entrances

  • Detailed Building Info
    Top-down views with labeled wings/sections improve way finding

  • Spatial Context
    External landmarks help students orient themselves

By analyzing competitors in the market, we were able to identify possible features that could improve SAIT’s interactive map. The findings in particular highlighted the gaps in SAIT’s current campus map design.

User Research Survey

Our collection of primary research data started with my team and I creating and distributing a 12 question survey to gather a preliminary understanding of the student’s current thoughts and experience with using the map page. 

Survey Objective

  • Understand difficulties students face in finding locations on campus and strategies they currently use

  • Gather feedback on ease of use, useful content and missing information they would like to see

  • Assess their perception and opinion on the map’s designs, usability and features

  • Identify gaps and potential enhancements based on user feedback

What we Discovered

  • 50% Struggled to Find Information:  Many found the page difficult to use and find what they needed.

  • Lack of Proper Building Labels: Users wanted clearer and more informative building markers. It relies on the user to know and remember the building designated letter code. 

  • Not Useful for Current Students: The map focused on new students, lacking room numbers for classes and appointments for long-term students.

  • Demand for Floor Plans:  Students wanted building interiors to help navigate complex layouts.k

From the survey, we were able to uncover specific pain points. The lack of clear labels, missing room numbers and the absence of floor plans directly informed us that these are some of the major pain points that the redesign needs to address.

User Interviews

To better understand user needs, we interviewed four students. Through casual, in-person and online conversations, we learned about their navigation strategies, frustrations and experiences. These one-on-one interviews helped us uncover personal challenges and preferences that surveys alone couldn’t fully capture.

Our Must Knows

  • Discover users’ current navigation strategies students use and their effectiveness

  • Assess first impressions and overall experience with interactive map

  • Pinpoint missing features or pain points that hindered navigation

  • Understand how students interact with the interactive map and whether it meets their needs

Key Insights

Visual Overload

Cluttered layout distracted from key info and confused users

Unclear Information

3D building view made entrances/exits unclear

Usability Issues

Map felt buggy and unintuitive to use and navigate

Clearer in PDF

PDF map had better wing/section labels than the interactive version

Mission Information

Missing room numbers made indoor navigation difficult

Analysis and Debriefing

Now that we have all this data from our users, what’s next?

Affinity Mapping

It was time to pin point patterns and prioritize improvements moving forward in the project. We grouped and labelled categories based on recurring feedback. This helped us to identify the core issues and essential changes needed to enhance the interactive map’s experience.

Key User Pain Points

  • Missing information

  • Hidden information behind excessive click throughs

  • Frustrating map functionality, including zoom issues

  • Confusion about building labelling system, noting missing letter codes

  • Users relied more on Google maps as an alternative, indicating that the interactive map’s features were insufficient for their needs

Implications and Recommendations

Add Current Location

Guide lost users in real time on the interactive map

Improve Labelling

Let users identify buildings at a glance

Make Visual Changes

Use a top-down view for clearer orientation

Add Floor Plans

Help users navigate inside buildings with ease

Add Room Numbers

Make classroom locations easier to find

Ideation and Creation

With our analysis done, it’s time to put our discoveries to the test through brainstorming, ideations and iterations.

Card Sorting

I led the creation of cards based on insights from our affinity mapping. We went with open card sorting sessions with users to understand their mental models and navigation preferences. This helped us empathize with users and refine the site structure based on how they naturally grouped and labeled content. This surfaced ideas that the team didn’t consider.

What we Discovered

  • Transportation and commute emerged as a standalone category in many cases

  • Some users expected content to follow a construction plan logic

  • Categories like dining, hours, and washrooms felt out of place or hard to group consistently

  • Need to group similar campus info under “Building Information” for clarity

Information Architecture

We analyzed the existing information architecture and identified key areas to improve. Using insights from our card sorting sessions, we restructured the current IA and created a new one aligned with how users naturally navigate and categorize information.

Suggested Improvements We Discovered

  • Move the interactive map be a separate external page to reduce clutter, improve functionality of the map and follow practices of other post secondary institutions 

  • Adding a search bar for classrooms

  • Add the “floor plan” toggles for the sidebar navigation toggles 

  • Consider adding in a pop-up box for information on buildings for quick viewing. 

  • Add new layer toggles to include more amenities in the information architecture