Michel Weimerskirch

Code Club Luxembourg: wireframe to website

Code Club Web Design

Code Club Luxembourg runs free, volunteer-led coding clubs for children across the country. I’ve contributed since its founding in 2013, supporting workshops and events whenever I could, and since September 2024 I’ve led weekly coding sessions for children.

Over the past months, in my free time, I also redesigned and rebuilt the national website. In case you’re wondering how that fits into evenings and weekends: with a lot of help from AI. The ideas and decisions were mine; most of the code wasn’t.

Why I do this

I’m passionate about making coding accessible and fun for young learners. I love seeing the kids’ creativity come out when they build their own games. Every project is different, and I want to help them discover what they’re capable of. Our sessions last one hour a week, but they’re easily the most interesting and fun part of my schedule.

The concept: three sections, three audiences

Code Club depends on three groups of people, and each arrives with a different question. So instead of organising the site around the organisation, I organised it around its visitors:

  • Join, for families: find a club nearby on an interactive map, see how a club works, and check upcoming events.
  • Get involved, for volunteers: become a coach, open a club in your commune, sign up, and meet the people who already volunteer.
  • Support us, for companies, partners and donors: partnerships, donations and membership.

The homepage opens with a single prompt, “I’m looking…”, with one card per audience plus a banner for communes that want to open a club. It closes by repeating the same three calls to action: find a club, become a coach, support us. Wherever you land, your next step is one click away.

How I got there

  • Research: I studied Code Club sites in other countries (the international site, Australia, New Zealand, Canada) and related projects such as Scratch and Hour of Code.
  • Wireframes: grey wireframes of the main pages, to agree on the content and the three-audience structure before any visual design.
  • Design: a design system based on the 2024 Code Club brand guidelines, with the { } bracket motif, Lexend type, bold colour blocks and a custom icon font.
  • Build: Grav CMS with a custom theme and plugins. It includes the interactive club map, volunteer profiles and testimonials pulled from a separate testimonials platform, Mailchimp newsletter sign-ups, and full French, German and English versions.

The site is now live on codeclub.lu.