MAGIS 2023
UX/UI Design, Web Development
Website design and development for Magis event page, including a registration platform, with very specific requirements, for over 4000 entries, managed by coordinators from over 30 countries.
The Challenge
Magis is an event that happens just before WYD, and this year, since WYD was happening in Portugal, so was Magis.
The client was looking for a fresh look for their website that would align with the visuals they had been developing, which involved using a wave element, some blues, whites and a pinch of red. After prototyping, the development went smoothly and soon, a new request arose: Develop a registration platform for all participants and their coordinators with a dashboard to keep track of everything.
All data showed in this case is fictional to protect sensitive information.
Website: magis2023.org
Type
Freelance + Partnership with Luís Antunes
Roles
Consulting
Prototyping
Design
Coding
Year
2022/2023
Tools
Pen & paper
Adobe XD
Photoshop
Illustrator
VSCode
Coding Languages
HTML, PHP & Twig
Javascript
SASS & CSS
mySQL
Smooth animations had to be present of course and these were made so that everything looked very fluid and natural. There was also an opportunity to make an interesting interaction on the homepage to show the several experiences that Magis had to offer.
Given that Magis 2023 was a several days event, some new information had to come into view after the countdown finished and information became available at specific times along the several days. This meant time sensitive layout switches that had to work automatically. This mechanic also expanded to the registration platform, where pilgrims could only register up until a specific date and country coordinators could only edit forms up until a specific date as well.
The registration platform was far more complex than the institutional part of the website, since the people registering had to be part of a group, which was managed by a specific coordinator. Hence, what was needed was a way for coordinators to submit their initial registration, receive approval from the administration so that they could add the emails for the pilgrims registering. After that, they could send an automatic email for all pilgrims in their group, which contained the link and code with which the pilgrims could initiate their registration through a detailed form. Thankfully, my good friend Luís Antunes was able to help out by handling the database setup, the API to handle data requests and server management.
The coordinators could check their dashboard for their pilgrim’s registration status and when all the pilgrims finished their registration, the coordinators would check that everything was in order, make the payment for the group and mark it as “complete”. The administration would then check their own dashboard and check if everything was going smoothly, also having statistics for how many people were registered, how many volunteers, coordinators, which foods were being picked, experiences ranking and more.
