The Challenge:
Strict accessibility requirements and a large digital footprint exposed gaps in the university’s existing web components. Inconsistent WCAG compliance, branding, and device performance highlighted the need for a cohesive, scalable design system.
UX Researcher, Content Strategist, Information Architect, and UX Designer
Led accessibility strategy, embedding inclusive design and compliance.
Highlights
Thoughtful design changes led to better discovery, accessibility, and consistency.
20%
Search success improvement
18%
Faster navigation
38%
Usability Score Increase
Step 1
User Research and Usability Testing
User research and usability testing helped shape a clearer, more usable experience. Insights from data and direct testing revealed friction points, informed iteration, and validated solutions that improved accessibility, and overall usability.
User Personas
Research Driven Personas
Understanding users was the first step in shaping the redesign. Existing Syracuse University research and documentation were reviewed to identify the institution’s core user groups and the tasks most critical to them.
These personas helped ground the redesign and provided a common language for evaluating design decisions. As the project evolved, they acted as a reference point to ensure changes supported user goals and aligned with broader university objectives.
Competitor Analysis
Context-Driven Design
I analyzed a variety of college websites to see how prospective students navigate, search, and find information. Patterns like clear navigation, prominent search, bold calls to action, and scannable content inspired a redesign that meets user expectations, boosts discoverability, and makes exploring Syracuse.edu intuitive and effortless.
Cornell
- Bold CTAs drew attention to key actions.
- Scannable homepage content made information easy to digest.
- Consistent components showed the value of a scalable design system.
Penn State (PSU)
- Clear, hierarchical navigation made menus feel effortless.
- Prominent search reinforced the need for search as a primary tool.
- Audience-focused labels guided users quickly to what mattered.
User Testing
Navigation Improvements
Data-informed navigation updates improved clarity, supported search-first behavior, and shortened paths to high-value content.
Original
Usability testing revealed frequent misclicks and early drop-offs caused by ambiguous top-level links and unexpected page redirects. Search was a primary way users attempted to navigate the site, but an oversized search field dominated the header, making it difficult to test.
Updated
A redesign simplified the header by converting search into an expandable control while preserving its role as a primary navigation tool. Sub-navigation was surfaced within the main menu to clarify hierarchy. User testing showed improved task success and stronger way-finding through active link states.
Final
User testing confirmed secondary navigation added little value at entry. Search stayed immediately accessible, while supporting links shifted to the pre-footer to better match user expectations. The result was a cleaner header, improved clarity, and more direct paths to key actions.
Step 2
Information Architecture
Designed for both browsing and search-first approaches, the site is accessible, scalable, and easy to maintain. Its organization mirrors how users discover information, creating a clear and connected experience.
A snippet of the IA
Step 3
Search Optimization
Research and analytics revealed that search was the site’s primary navigation tool. The redesigned AI-powered experience simplified the interface, clarified hierarchy, and refined search logic to deliver more accurate, actionable results.
Step 4
Development-Ready Component Library
Built in Figma with precise specifications for layout, spacing, and behavior. Each component included accessibility callouts such as ARIA usage, keyboard interactions, and focus states to support WCAG-compliant implementation. Clear spacing rules, tokens, and responsive guidance reduced ambiguity during handoff and accelerated development. This system enabled consistent builds across teams, minimized rework, and supported scalable growth.
Final Application
Driving Clarity, Accessibility, and Growth
This work delivered more than a visual refresh. Search-first navigation, accessible components, and a scalable design framework improved how users find information and how teams build and maintain the site. The result is a clearer, more inclusive experience that supports diverse audiences today while remaining flexible for future growth.
"Discover a Major" Example Journey
Results
Designed for both browsing and search-first approaches, the site is accessible, scalable, and easy to maintain. Its organization mirrors how users discover information, creating a clear and connected experience.
Stronger accessibility and usability
Improved WCAG compliance, clarity, and consistency across the university web ecosystem.
+20 percent task success
Prospective students found information more easily through clearer navigation and search improvements.
+18 percent navigation efficiency
Refined information architecture and search-first patterns reduced friction.
Scalable, CMS-ready components
Accelerated future implementation and supported long-term design growth.
