Source：vcass.vic.edu.au ↗ Checked 2026.10.21
Editor's note
What this site does
A Melbourne arts secondary school that keeps “Auditions & Enrolment” in its header and sets out applying as six numbered steps.
Conversion
Notes
What you see
Performance footage behind the heading "Education meets the arts". On desktop, a floating dark header carries four links, search and an "Auditions & Enrolment" button that stays on screen as you scroll.
The home page moves through the four programs — music, dance, theatre arts and visual arts — then performances and events on an orange background, each labelled with a date and discipline, then news. The enrolment page puts it all in one place: closing dates by year level and program, who can apply, which years each program takes, six numbered steps from watching a preparation video to paying and submitting, and the on-site audition dates.
What to take from it
When recruiting students is the site's main job, the way in should never be more than one click away, wherever the visitor is.
Breaking applying into numbered steps, with the exact documents needed at each one, answers the questions that would otherwise arrive by phone. And a steady list of dated performances shows what life at the school is like better than a long description would.
Typography
Typefaces
| Element | Desktop size / weight | Desktop line height | Mobile size / weight |
|---|---|---|---|
| h1 | 129px / 800 | 0.80 | 52px / 800 |
| h2 | 93px / 800 | 0.90 | 40px / 800 |
| h3 | 50px / 800 | 0.90 | 28px / 800 |
| Body (p) | 13px / 400 | 1.50 | 11px / 400 |
| Button | — | — | 14px / 400 |
Measured values (desktop 1440px, mobile 375px, 2026.10.21). The most frequent setting for each element is shown. Sites that use h1 for a logo or small label will show a small h1.
Download
Download the wireframe
This structure, as a wireframe you can edit in Figma
The page structure above, rebuilt from DevNJ's wireframe parts. It contains none of the original site's copy, images or code.
Using it in Figma
- Download the SVG.
- Drag and drop the file onto a Figma canvas.
- It opens with one layer group per section — start by reordering sections or replacing the copy.
Text comes in as text layers (set in Noto Sans JP).
Screenshots are shown at reduced size as quotations supporting the commentary. All rights in the design, copy and images belong to VCA Secondary School and their respective owners. The wireframes are not copies of the original site; they rebuild its structure from DevNJ's parts. Owners or designers who would like this entry removed or corrected can contact us; we respond within two business days. Featured on: siteInspire
