Deliverable
Design and implement a new course page template (end-to-end)
My role
UX Designer + Project Lead
Team
UX, Business Analyst, full stack + frontend devs (offshore)
Stack
Figma, AEM, Confluence, Jira, BitBucket
When
2021
The course page is where students evaluate their options—and it's where the university earns its revenue. But the experience was poor, suffering unclear layout and bloated content.
Overwhelming layout, no clear starting point
The design was dense and unstructured, with heavy text and no clear hierarchy. Users didn’t know where to begin—and often gave up before finding key details.
Every page relied on the same template—making it hard to create distinct or contemporary page designs.
No content standards—and a broken foundation
Without a data model or authoring standards the course page became a free-for-all. Dense, jargon-filled content was pasted in from academic sources, layered on a rigid database that couldn’t structure it properly—making the entire experience confusing and inaccessible.
Open-text fields allowed complex content to be pasted in without structure or guidance—making already dense information even harder to digest.
I laid the foundation for the project by presenting the problem and proposed solution to the executive team, ensuring alignment. This phase focused on defining the approach and establishing a framework for managing approvals and collaboration.
Pitched to executive team for endorsement
I presented data using metrics, user quotes, screen recordings to demonstrate the problem and potential solutions achievable within 10 months.
Mapped key stakeholders
I identified key stakeholders across the university and established a clear decision-making hierarchy.
Timeboxed design work to 3 months
Scoped a 3-month design window to complete the UX work—while keeping deliverables flexible
Content audit & consultation
I met with curriculum staff, compliance, marketing, student recruitment, and admissions. I reviewed dozens of live course pages to understand what content existed, how it got there, and why it wasn’t working.
Teams consulted
Unclear ownership or accountability
It wasn’t clear whose job it was to define quality, develop standards, or fix what wasn’t working – so no one did.
User research
I conducted interviews with 10 first-year students (5 domestic, 5 international) to understand:
How they researched courses
What info mattered most
What confused or blocked them
Essential decision factors
Critical decision making information included;
Entry requirements
Career and learning outcomes
Costs
Looking at other uni's and beyond
I reviewed leading university websites to identify smart patterns and features. I also looked beyond higher ed—analysing listing-based platforms like Airbnb and Gumtree to explore how large-scale content from multiple contributors can still feel consistent, structured, and easy to navigate.
I audited each component to understand its function, limitations, and potential for reuse.
More interactivity and author controls
Better sites used on-page navigation, modals, tooltips, personalisation, and clear authoring rules to support clarity and quick decision-making.
Introduced structure through content mapping
To bring order to the chaos, I mapped the existing content and ran a card sort to identify natural groupings. This helped define the core sections of the page, which then informed both layout and navigation decisions.
Early card sorting helped uncover natural groupings in the content—laying the groundwork for a more intuitive page structure and navigation.
Tested navigation patterns through iteration
I ran a content audit and card sort to identify key categories. I then explored multiple navigation models—tabs, accordions, side menus—and used quick guerrilla testing to evaluate what felt most intuitive. This led to a tabbed layout on desktop and anchor-based navigation on mobile, with progressive disclosure for dense content like fees.
Explored multiple navigation models—tabs, side nav, and expandable sections—to test what made dense course content easier to scan and navigate.
Clear language, visual hierarchy and progressive disclosure
I rewrote and restructured key sections using plain English and improved the visual hierarchy with clearer headings, spacing, and groupings. For dense content, I used modals and tooltips to break it into manageable pieces.
To simplify dense fee information, I used modals and tooltips to layer supporting detail—keeping the main interface scannable without sacrificing clarity or compliance.
A/B testing the new design
I created a high-fidelity prototype and ran moderated A/B tests with 10 prospective students.
Testing early with real students helped validate what mattered most—ensuring the new course page prototype aligned with how users actually navigate and decide.
Improving the author experience
Added author restrictions
We locked down critical sections (like admissions) to approved content only, and introduced guidelines on tone, length, and layout. I also created a SharePoint resource hub to help authors adapt.
I replaced open text fields with dropdowns and checkboxes—reducing ambiguity and ensuring consistent, user-friendly content across course pages.
Access to authoring resources
To support adoption, I created a SharePoint resource hub with step-by-step guides, content standards, and authoring best practices—making it easier for teams to adapt to the new system.
Key metrics
We locked down critical sections (like admissions) to approved content only, and introduced guidelines on tone, length, and layout. I also created a SharePoint resource hub to help authors adapt.
x2 return rate
The return rate for course pages on the new template increased from 24% to 52%, doubling user engagement.
45% decrease in bounce rate
The bounce rate for course pages on the new template reduced from 73% to 25%.
More case studies
From clutter to clarity: a navigation overhaul
View project
Building a flexible, accessible CMS
View project