← {Portfolio}
{Case: 03}

TeamUp School

A website for an English language school that shows parents the whole learning path and lets them find a group with free places.

{Client}
TeamUp School
{My role}
Front-end & WordPress development
{Stack}
WordPress, custom theme, JS
{Design}
[Designer / agency]
{Year}
[YEAR]
{Live}
teamupschool.pl ↗
{teamupschool.pl}
TeamUp School home page

{Brief}

Four course brands, many age levels, one clear next step

The school teaches from age two to adulthood across several locations. Parents needed to see where their child fits, and the school needed to show current groups, teachers, prices and places without a confusing timetable. [Adjust to the real brief.]

{What I did}

  • Built a custom WordPress theme for the school
  • Developed the group finder with its filters and capacity bars
  • Gave each course its own colour theme on one shared template
  • Added the interactive map of school locations

{Highlight: Group finder}

From birth year to a seat in a group

Parents enter a birth year and choose a location. Each group card shows the days, teacher, start date, price and how many places are taken. When a group is full, the sign-up button becomes a waiting list button.

{Groups} — filters, capacity bars and waiting lists
{Groups} — filters, capacity bars and waiting lists
{Learning paths} — every level, from toddlers upward
{Learning paths} — every level, from toddlers upward

{Key features}

{01}

Four course brands

Teddy Eddie, Savvy Ed, The Bearton Twins and Bold Wings, each with its own colour and characters.

{02}

Learning path diagrams

Winding illustrated routes show the order of levels, the matching ages and the levels still to come.

{03}

Course level pages

Each level lists group size, age and lesson length, with tabs that answer the questions parents ask.

{04}

Locations map

Three schools on one map, each showing its address, its courses and buttons to sign up or book a trial.

{Courses} — four brands with their age ranges
{Courses} — four brands with their age ranges
{Teddy Eddie} — a course page in its own colour theme
{Teddy Eddie} — a course page in its own colour theme
{Locations} — list, map and details together
{Locations} — list, map and details together

{Full page}

Scroll the home page

Courses, both learning paths, the reasons to choose the school and the locations map follow in one continuous story.

  • * WordPress
  • * Custom theme
  • * Group finder
  • * Interactive map
{scroll ↓}
Full TeamUp School page

{Technical notes}

[How groups are modelled, how the birth year filter maps to levels, how capacity and the waiting list state are updated, and how a course's colour theme is applied.]

{Takeaways}

[The hardest part of the project and what you learned from it, in one or two sentences.]

{mattstudio}

Thanks for
looking.

← {Back to portfolio}