SchoolWeb Design System

Building a scalable template system for K-12 school websites

Digistorm specialises in creating high-quality websites for private schools in Australia and beyond, offering tailored and industry-leading solutions to meet schools' needs.

Every Digistorm website includes a set of high-impact core pages that drive engagement. The package features essential pages such as News, Events and Newsletter. These pages are built and set up by Digistorm and managed by the school via CMS, and can be either template-based or fully customised.

As the project lead, I collaborated with Project Management, Customer Success, Sales, Development and Design teams to scope, research, and deliver a complete redesign of the existing page templates, creating a scalable system that aligned business goals with customer expectations and user needs.

Problem

The existing templates were outdated and inconsistent, often failing to meet project requirements and leading teams to build pages from scratch multiple times. Without clear standards or documentation outlining scope and functionality, requirements were too broad, resulting in several versions of the same pages and an inefficient, costly process.

How might we create a scalable, user-friendly system that accommodates schools of different sizes and needs, reduces repetitive work, and provides a clear, shared reference for internal teams?

Challenges

The project was assigned without a defined brief or direction, and designing without disrupting ongoing client projects added a further constraint. In addition, balancing the needs of multiple user groups was central to the solution:

  1. Business: efficient, professional, and easy to implement
  2. Customers (schools): fit for purpose, intuitive, and easy to manage
  3. End users (families): responsive, accessible, and easy to navigate

Process

I started with stakeholder alignment sessions to clarify business objectives, set expectations, and establish a clear direction. From there, I conducted internal interviews with PM, Sales, and CSM to understand pain points and gather insights on existing workflows.

I then audited over 50 client websites to identify current issues, map existing patterns, and uncover recurring problems, ensuring decisions were grounded in real evidence rather than assumptions. This was followed by interviews with school staff to understand their experiences, needs, and challenges, alongside support ticket reviews and competitor analysis to surface gaps and opportunities.

Key insights

Research revealed how schools and internal teams experienced and managed the pages, and how the existing templates were performing:

  • Critical accessibility and usability issues were identified across existing pages.
  • Templated pages were visually disconnected from the website look and feel, with limited flexibility and customisation options.
  • Schools have different needs and confidence levels: smaller schools need guidance and structure, while larger schools expect flexibility and control.
  • Nearly half of website visits are on mobile, with parents needing information that is easy to find.

Solution

The redesign introduced a template system with consistent structure that balances scalability and flexibility, enabling schools of different sizes and technical confidence levels to manage and customise content with ease. Each page template was designed to improve content layout and navigation. Listing pages feature simplified cards with optional images, giving schools with limited visual resources a clean and adaptable starting point. Article and event detail pages were streamlined to maintain focus on the content, with hero images being optional. A dedicated section for date, time, location, and an optional call to action ensures that essential event information is always prominently displayed. Additionally, newsletter editions transition from a rigid, boxed layout to a more fluid structure, allowing schools the flexibility to organise content in a way that best suits their needs.

Naming conventions, content, and page structures were standardised across Design, Development, CMS, and client-facing guides, creating a single source of truth for internal teams. Ongoing projects were used to test and iterate on templates in real school contexts, allowing teams to collect feedback, validate assumptions, and accelerate adoption ahead of a full rollout.

Impact

  • Pages were no longer built from scratch, significantly reducing delivery time.
  • Clearer, more predictable templates improved customer confidence and satisfaction.
  • A shared system aligned teams, eliminating guesswork and miscommunication.
  • A consistent structure reduced confusion at handover and minimised repeated training.
  • A repeatable framework replaced one-off builds, enabling scalable delivery.