Website Overhaul (Shipped)
Client: UCLA Center for Neurobehavioral Genetics
UX Designer, Project Manager
Myself, (1) Webmaster
Website Redesign, Presentation
Aug 2022 - Dec 2022
(3 months)
WordPress, GoogleDocs, Photoshop
While I was employed by UCLA during the course of this project, the views and options expressed by me on this page are my own, and do not represent the views and opinions of UCLA or its other employees.
Role:
Team:
Deliverables:
Time Frame:
Tools:
Disclaimer:
Problem
The Center for Neurobehavioral Genetics (CNG) is a research group at the University of California, Los Angeles (UCLA) comprised of faculty, researchers, postdoctoral scholars, graduate students, trainees, and administrators. It holds a strong reputation but lacked publicity and centralized information, particularly in the online space.
Solution
Our team overhauled and shipped CNG’s new website during Q2 with the purpose of building presence, fostering community, encouraging funding support, and broadening the candidate pool for its training program. Additionally, we would incorporate web features that would auto-populate information to reduce the need for manual entries and constant updates, thereby reducing administrative burden.
01
Design Strategy 📋
At the start of the project, we set up individual stakeholder meetings with the board of directors to conduct a comprehensive SWOT Analysis to identify CNG’s Strengths, Weaknesses, Opportunities, and Threats.
Through these meetings, our team learned that the stakeholders were most interested in:
01
showcasing the Center's distinguished faculty
02
increasing awareness of
program events
(seminars, workshops, & retreats)
03
outlining
complex components
of its NIH-funded
training program
In order to effectively meet the stakeholders' interests and optimize our approach to the project, we
analyzed multiple websites of other UCLA departments; and
reviewed formal evaluations and correspondences on CNG’s graduate courses and program events over the span of a decade (2011-2021).
02
Design Decisions ✍
Transitioned to a content management system that allowed more customization
Streamlined the navigation menu
Built pages that brought CNG’s core strengths to the forefront
Established sustainable infrastructures that persisted beyond short-term solutions
Landing Page
In order to cultivate a stronger sense of community on the new website, we
added group photos of our faculty, staff, students, postdoctoral scholars, and researchers; and
integrated a calendar widget that highlighted upcoming events hosted by CNG
Before Redesign
After Redesign
03
Key Changes 🦋
Core Faculty
On the new website, we presented the image profiles of all faculty members on (1) page.
Clicking on a faculty member's photo would prompt a pop-up window that provided
their positions &affiliations
introduction to their research
external links to their publications & lab website (if applicable).
On the original website, a separate page existed for every faculty member. This old format depersonalized the faculty, preventing users from associating names with faces.
The new format allowed visitors to view the Center's faculty at a glance.
Before Redesign
After Redesign
Events Calendar
We established a dynamic calendar for upcoming events and an archive for past events.
In order to increase awareness of the Center’s seminar series, journal club meetings, and retreats, we featured the calendar throughout the redesigned website: the landing page, the Events Calendar page, the Seminar Series page, and the Journal Club page. We also enabled users to toggle its format between “Day”, “Week”, “Month”, and “List” according to their needs and preferences.
The newly integrated events calendar reduced the number of inquiries on upcoming events.
Section for Upcoming Events
Section for Past Events
In addition, our team developed subpages that provided more details on each event type:
1. Seminar Series
2. Journal Club
3. Retreat
Training Program
To avoid overwhelming current trainees and prospective applicants, we created multiple subpages to address multiple facets of the Training Program:
Curriculum
Participating Mentors
Trainee Outcomes
Trainee Publications
Application Details
The newly established subpages clarified program expectations and reduced the number of inquiries from prospective applicants, current trainees, as well as their mentors.
Newly Created Pages
Accessibility Toolkit
In addition, we implemented an accessibility toolkit that would allow visitors to adjust the font size and color contrast on the website as needed.
Default View
Accessibility Toolkit: High Contrast View
04
Feedback 🗣️
After the redesigned website launched in December 2021, we solicited feedback from users and non-users alike. We set up an anonymous online survey of 15 questions, 6 of which were optional.
Overall, the reception to the redesigned Center for Neurobehavioral Genetics website has been positive! Users complimented the redesigned website for its easy navigation and extremely informative subpages on the training program.
“This is the most informative, user-friendly and updated website I’ve seen for a training grant and I think the reviewers [of the federal funding agency] will appreciate this.”
While no additional changes were made to the website after this particular round of feedback, we continued to iterate on the content in the months following. We continued to take note of user needs expressed in e-mail correspondences, video conferences, graduate courses, surveys, and other communication channels.
05
Impact 💥
Following the website redesign,
administrative burden decreased by more than 50%; and
applications to the Training Program in Neurobehavioral Genetics increased by more than 30%.
06
Learnings & Next Steps 👣
Although we were operating under strict time constraints and relied on rudimentary data collection methods, we were able to complete our website redesign project within 3 months. This was made possible by the feedback we received throughout the process. Through unmoderated usability testing, we were able to gain invaluable insight on ease of use, legibility, and overall accessibility.
In future iterations, we hope to expand on existing web pages and develop a feature that highlights news about the Center's faculty and trainees in real time.