Southern Methodist University wanted to provide potential donors with a unique and personal website experience to assist in fundraising efforts.
UX Designer for
The Virtual Wild Agency
Southern Methodist University,
Cox School of Business
July - October 2021
UX, UI, Interaction Design, WebXR, Prototyping
.gif)
Southern Methodist University is a private university located in Dallas, Texas.
There are no exact demographics for the average SMU donor, but national statistics mark the average higher education donor to be 40-70 years of age and primarily male.
The primary goal is to provide potential donors with a fully shipped interactive web experience to assist in fundraising for their $1.5 billion initiative and showcase architectural highlights of the Cox School of Business. SMU has established branding guidelines that are tightly enforced.
There are 2 main requirements from the SMU stakeholders:
A unique and interactive experience, including interfaces with custom names tied to unique link identifiers.
Responsive for mobile, tablet, and desktop screen sizes, as well as accessible and inclusive for all users.
Our challenge at The Virtual Wild is to create a compelling and shareable digital platform that not only showcases the Cox School of Business but also motivates donors to become active supporters of SMU's fundraising mission.
By immersing the users in the experience and tailoring features to individual donors, we aimed to establish a deeper emotional connection, making them feel more personally invested in SMU's renovation campaign.
Personalized UI is integrated to include names of the individuals visiting the site, increasing emotional connection.
Admin can access a behind-the-scenes control panel where they can create unique link IDs to personalize names in the UI.
An immersive WebXR site transports the potential donors into the renovated spaces in the Cox School of Business.
The Virtual Wild was chosen by SMU to create a website showcasing digital versions of spaces in the Cox School of Business. I admittedly came into this project with very little experience in WebXR and Three.js web design, so my first steps were to dive in and learn what features could make this website really shine to potential donors.
My priority was to establish intuitive patterns, aligning with the developer's prior experience in museum design due to project time constraints. I conducted short usability tests on a handful of users to determine navigational cues.
The two images shown here are screenshots of the museum experience that was tested, they are not part of the design of this project.
Users understood that they could navigate through spaces with their mouse, and preferred when sites gave visual or text cues to let them know what was possible versus exploring with no cues.
Users understood that they could click on items within the space, as long as they looked somewhat different than their surroundings and/or had a hover affect.
When I was brought into the project, The Virtual Wild and SMU had decided on a general idea of how they wanted the site to work. The user would enter through a loading animation and video, then after landing on the home page the user can enter the digital room spaces and access hot spots. From all pages we want the user to be able to view donors and view more options such as contacting SMU and sharing the site. All pages should be able to go back to the previous page as well.
I built a sitemap as a tool to visualize all the pages we would need with notes about features and functions.
With the base user flow established by The Virtual Wild and SMU stakeholders, I was able to design wireframes mapping out the proposed pages and flow for both mobile and desktop screen sizes. I built a basic prototype in Figma using the wireframes and we were able to test the experience and gain feedback from SMU stakeholders on what they liked or disliked so far.
Our feedback was all positive from the stakeholders and we were able to move forward and bring in a developer at this point.
SMU is a well-established educational institution with strict branding and design rules we needed to follow. They sent us a guide with fonts, colors, images, patterns, etc. We were able to build our own UI kit using these guidelines to fit the modern feel of the site.
SMU wanted the digital rooms to have a watercolor look, so we contracted a digital watercolor artist to render images for the rooms. We ran into a small hiccup with image quality when wrapping the rooms to the digital spaces and ended up having to contract a different artist to finish the work.
This room style was discarded because the quality noticeably diminished when the artwork was integrated into the room's environment.
Stakeholders embraced this style for its exceptional quality and immersive ambiance.
The top priority for this website was to deliver a unique and memorable experience. Working with the visual designer, I utilized our own UI kit to build out high fidelity mockups of each page so the developer could start building out the site.
Reminder: The goals uncovered in early design stages were 1) personalized features and 2) responsive design. We were able to fulfill both goals and go above and beyond what the stakeholders expected.
I created a prototype to communicate the transitions and interactions to the developer. We worked hand in hand during the final weeks of this project to ensure that every interaction was above and beyond SMU’s expectations.
We were able to deliver the personalized features that SMU requested, specifically on the “You’re the Key” hot spot where a user’s real name would appear on the site.
Average sessions on the Cox Renovation site are 14+ minutes, versus 2-3 minutes for average websites. This shows that users are engaged and interested in the site, more than the average website.
At the halfway point in their fundraising efforts, SMU has seen marked improvements in engagement and campaign interest. In May 2022, one part of the renovation broke ground and the donation efforts continue.
The research and design led to a successful website experience for potential SMU donors. SMU stakeholders are thrilled with the Cox Renovation website and will continue to market it to potential donors. The Virtual Wild will continue to provide visual design support to update donor cards as donations are made.
Go to the completed website
Check out The Virtual Wild's case study
.svg)
.svg)
