UCLAx Knowledge Base Site

  • Tools:
  • Figma IconHTML IconCSS IconJavaScript IconAdobe Illustrator Icon

“Veronica led the creation of UCLA Extension’s centralized Knowledge Base, creating and unifying all teaching resources into one intuitive, beautifully designed site. Her leadership, technical expertise, and editorial vision transformed how we guide, train, and empower our community." ~ Carri Joyce, Lead Instructional Designer (UCLA Extension)  

Overview

I spearheaded the development and launch of UCLA Extension’s public-facing Instructor Knowledge Base, a comprehensive resource site featuring training guides on Canvas, Zoom, and Panopto, along with pedagogical articles to support best practices in teaching and learning.

My Role

My role encompassed project leadership, web design and development, and article writer.

Project Leadership

Oversaw the end-to-end execution of the initiative, including:

  • Defining project scope, key milestones, and delivery timelines.
  • Creating a structured project management workflow in Monday.com.
  • Building a Knowledge Base Inventory to streamline content development and support long-term site maintenance.
  • Implemented Google Analytics to track instructor engagement, identify high-performing articles, and surface pain points to inform future content strategy.

Web Design & Development

Redesigned and built the site, with a focus on usability, accessibility, and brand alignment. Key contributions included:

  • Designed wireframes and mockups using Figma to guide stakeholder alignment and UI decisions.
  • Developed a new Zendesk interface that integrated UCLA’s brand identity and improved overall user experience.
  • Rebuilt the entire site—including the landing page and article pages—using custom HTML, CSS, and JavaScript to support responsive, accessible design.

Article Writer

Led the development of the site’s content taxonomy and authored key instructional resources. Contributions included:

  • Created a comprehensive Style Guide to ensure visual and editorial consistency across all articles and channels.
  • Wrote and edited 60+ procedural and pedagogical articles tailored to support instructors with course design, development, and facilitation.
  • Aligned content with UCLA brand standards, accessibility guidelines, and GenAI-integrated teaching practices.

Approach

Applying a Design Sprint approach, I redesigned the Knowledge Base to deliver an intuitive and accessible experience tailored to the diverse needs of instructors and staff. The project emphasized identifying user needs, addressing common problems, and creating a cohesive framework to support instructors throughout their support journey.

Usability, consistency, and ease of access were prioritized throughout the redesign and development phases. Key elements of the approach included:

Audience research to identify user needs & solve common challenges.

Style Guide to maintain consistent visual and editorial standards.

Wireframes designed for clarity, intuitive navigation, and accessibility.

Agile article development integrating feedback from ideation to approval. 

Content Taxonomy to organize articles for easy tracking and maintenance.

Analytics-driven updates to optimize article relevance and usability.

Process

I followed a design sprint process to guide the redesign of the Knowledge Base website, ensuring an intuitive and user-centered experience. The process included:

1. Understand

Conducted audience research to identify user needs, workflows, and challenges, aligning the redesign with key goals.

2. Ideate

Developed wireframes and explored design solutions to improve clarity, navigation, and accessibility.

3. Decide

Finalized the content taxonomy and site structure to enhance discoverability and consistency.

4. Prototype

Created and tested a high-fidelity prototype, integrating branding and editorial standards.

5. Validate

Gathered user feedback and iteratively refined the site for optimal usability and scalability.

Site Access

View the public Instructor Knowledge Base website.
Explore samples from its development below.

Screenshot of Knowledge Base landing page wireframes.
Screenshot of Knowledge Base Style Guide slides.

Landing Page Transformation

Move the slider left and right to see before and after screenshots of the landing page I designed.

Article Page Transformation

Move the slider left and right to see before and after screenshots of the article page interface I designed.

© 2024 Vee Thompson Creative, Inc. . All Rights Reserved.