In 2018, our Web Services team was selected to lead the work of managing and providing design assistance with Digital Pulp, a full-service agency, to redesign Georgetown’s flagship website.
The project was big in scope and had levels of complexity compounded by our many stakeholders, which included faculty, staff, university leaders, our development team, and our design and communication teams across the university.
Our goal for the redesign was to help elevate Georgetown’s web presence with sound user experience and have a more modern and effective way of visually communicating with prospective students.
CHALLENGES
We needed to balance Georgetown’s visual identity with user needs and a multitude of stakeholder goals.
SOLUTIONS
The redesign involved a collaboration amongst our communication and web teams across the university. The redesign process involved a discovery phase to understand our stakeholder goals and our audiences. Later in the process, our teams dived into the design and content to fine tune the final design.
Discovery: Town Hall Sessions
The redesign committee set up a few town hall sessions to learn more about stakeholder goals and ‘feels’ across the university.
We conducted these sessions at every milestone of the design process, prior to development. Through these feedback sessions, we:
- Understood the stakeholder goals
- Obtained feedback of our audience needs via one-to-one interviews
- Obtained feedback of design mockups
The sessions were conducted by myself, staff from the office of Communication, the Director of UX at Advancement - Nico Staple, our product manager - Rob Pongsajapan from Web Services at the time.
These sessions helped to shape the designs and find common ground on the decisions made throughout the design phase.
Discovery: Town Hall Sessions
The redesign committee set up a few town hall sessions to learn more about stakeholder goals and ‘feels’ across the university.
We conducted these sessions at every milestone of the design process, prior to development. Through these feedback sessions, we:
- Understood the stakeholder goals
- Obtained feedback of our audience needs via one-to-one interviews
- Obtained feedback of design mockups
The sessions were conducted by myself, staff from the office of Communication, the Director of UX at Advancement - Nico Staple, our product manager - Rob Pongsajapan from Web Services at the time.
These sessions helped to shape the designs and find common ground on the decisions made throughout the design phase.
Discovery: User Interviews Session
Our interview sessions were conducted by myself, Nico Staple (Director of UX at the Office of Advancement), Grant Chinn (UX Manager at the Office of Advancement). Other members from our committee helped as well interminably throughout the interviews when needed. The goal of these sessions were to capture our audience goals when visiting the Georgetown website.
Our strategy involved interviewing Georgetown’s current students from freshmen to seniors. We also interviewed our Alumni audience to capture their needs and to help understand how we can best support our new graduates and to keep our older alumni connected. Georgetown’s alumni network is one of the key pillars in the Georgetown experience.
Discovery: User Interviews Session
Our interview sessions were conducted by myself, Nico Staple (Director of UX at the Office of Advancement), Grant Chinn (UX Manager at the Office of Advancement). Other members from our committee helped as well interminably throughout the interviews when needed. The goal of these sessions were to capture our audience goals when visiting the Georgetown website.
Our strategy involved interviewing Georgetown’s current students from freshmen to seniors. We also interviewed our Alumni audience to capture their needs and to help understand how we can best support our new graduates and to keep our older alumni connected. Georgetown’s alumni network is one of the key pillars in the Georgetown experience.
Design & Content
The new designs for Georgetown require understanding the goal(s) of a page, intent of a page, and how to best present the narrative on a page.
Our committee devised a Content Bootcamp for our editors/communicators to help understand the new way of thinking when it comes to working with content. The content bootcamp used a style guide and a tone and voice guide to help drive the session in the best way to create a page. I immersed myself in the bootcamp to better understand how editorial content and design could be better connected moving forward.
User Acceptance Testing
The User Acceptance Testing was conducted to vet the web editing experience and design integrity before launch. Our team at Web Services created a triage system to determine the type of issue that may exist on the code, design, or accessibility front.
I reviewed and noted design concerns and worked with other members of the committee to catch issues before launch. This included design pattern, accessibility, and page level design issues.
In addition, working with the design team from Advancement, we took a closer look as to how the search interface was working on mobile. We noticed certain feedback interactions were missing and were important to have for our users.
Furthermore, one of the more challenging design patterns was the carousel pattern found in the redesign. This design pattern has a lot of moving parts which can include multiple images and/or video, pagination for users to use and/or originally automatic slider which can be a terrible experience with a screen reader to say the least. Our Accessibility Coordinator, Kevin Andrews, vetted this issue on the build before launch. At the same time, I assisted with other design issues that surfaced during UAT, such as color contrast issues.
User Acceptance Testing
The User Acceptance Testing was conducted to vet the web editing experience and design integrity before launch. Our team at Web Services created a triage system to determine the type of issue that may exist on the code, design, or accessibility front.
I reviewed and noted design concerns and worked with other members of the committee to catch issues before launch. This included design pattern, accessibility, and page level design issues.
In addition, working with the design team from Advancement, we took a closer look as to how the search interface was working on mobile. We noticed certain feedback interactions were missing and were important to have for our users.
Furthermore, one of the more challenging design patterns was the carousel pattern found in the redesign. This design pattern has a lot of moving parts which can include multiple images and/or video, pagination for users to use and/or originally automatic slider which can be a terrible experience with a screen reader to say the least. Our Accessibility Coordinator, Kevin Andrews, vetted this issue on the build before launch. At the same time, I assisted with other design issues that surfaced during UAT, such as color contrast issues.
IMPACT
Georgetown.edu launched in fall 2019. The redesign was received by the Georgetown community with high regards. It was a pivot for site editors to focus on user experience. The launch of the new design also created a demand by schools and units to adopt the new web theme. As a result of the Georgetown.edu redesign project, the Web Services team has adopted a user-centered, design-centered way of thinking when we interact with our university partners.
Georgetown.edu launched in fall 2019. The redesign was received by the Georgetown community with high regards. It was a pivot for site editors to focus on user experience. The launch of the new design also created a demand by schools and units to adopt the new web theme. As a result of the Georgetown.edu redesign project, the Web Services team has adopted a user-centered, design-centered way of thinking when we interact with our university partners.
Selected Works
Georgetown University RedesignRedesigning the Flagship Website
1789 Design SystemBuilding a Wordpress Theme
Visual Identity for the WebCreating Guidelines & Governance
Contact
Resume
E-mail: [email protected]
X: @fabuloso
LinkedIn: linkedin.com/in/fabalca