AdventJS 2024 is the advent calendar of programming challenges by Miguel Ángel Durán (Midudev), with thousands of developers solving one challenge a day throughout December. I collaborated with Midudev and Mateo Álvarez (Madeval) on the design of this edition's interface.
My role
I handled the UI/UX design of the product's key screens:
- The 2024 website, built around the challenge calendar.
- The code editor and tests, where users solve each challenge.
- The achievements screen, so each person can track their progress through the month.
The design challenge
A product like AdventJS has a very specific user — developers — and a demanding context: solving challenges takes focus. The design goal was to get everything distracting out of the way and let the challenge itself be the star.
That translates into a clean, readable editor, a visual hierarchy that guides without noise, and an achievements screen that motivates without overwhelming. Usability and accessibility came before decoration.
Results
- An interface the community welcomed, with an editor that's comfortable to work in day after day.
- The achievements screen helped keep motivation up across the whole December challenge.
- A smooth collaboration between design and development on a high-visibility project.
Previous editions
AdventJS is a yearly classic. You can explore earlier editions here:
AdventJS 2023
AdventJS 2022
AdventJS 2021Project link: 2024.adventjs.dev