Here is one of the web development projects I worked on, where I created a custom system to meet the client's needs. This project focused on building an easy-to-use online registration platform to improve the experience for event.
| Project Title | MTGA 2023 Online Registration System |
| Client | PT Sanghiang Perkasa Kalbe Nutritionals |
| Role | Frontend Web Developer, UI/UX Designer |
| Technologies | HTML, CSS, JavaScript, MySQL, PHP, Whatsapp API |
The MTGA 2023 Registration System is an online platform that I created to help people register easily for a corporate event. The goal of this system is to make the registration process quick and straightforward for all participants. When users visit the platform, they can fill out their personal information in a simple form. After they complete the registration, they receive digital tickets right away through WhatsApp and email. These tickets are important because they give participants access to various activities during the event. The platform also provides helpful information and updates, making it easier for everyone to stay informed before and during the event. Overall, this registration system is designed to ensure that participants have a smooth and enjoyable experience from the moment they sign up to the end of the event.
Planning an event is both exciting and challenging. Imagine attendees standing in long lines, feeling frustrated because their information is often incorrect, or they aren’t sure if they registered properly. Meanwhile, event organizers struggle with manual processes, leading to confusion about seating arrangements and fairness in door prize drawings. This situation can harm the experience for everyone. With these challenges in mind, I aimed to create a smoother registration process for MTGA 2023, ensuring that every participant feels valued from the start. To achieve this, I used the QCDSMPE framework, which stands for Quality, Cost, Delivery, Safety, Morale, Productivity, and Environment. This method helps pinpoint areas for improvement and understand the specific issues we faced. By focusing on these aspects, I aimed to streamline registration and enhance the overall experience. For example, improving Quality meant reducing data errors, while addressing Cost involved using less paper and lowering administrative expenses. Using this framework allowed us to identify the problems we encountered and find effective solutions, creating a better event for all participants. Let’s explore each part of QCDSMPE to see the challenges we faced and the solutions we implemented.
Quality: Before, the manual registration process for the MTGA event was messy. Attendees often found mistakes in their details, leading to confusion and frustration. It was hard to manage seating and door prize drawings fairly. By switching to an online registration form, I made everything more organized, reducing errors and ensuring everyone received the correct information.
Cost: The use of a lot of paper for tickets and forms was expensive and harmful to the environment. Each printed ticket added to the costs and had a negative impact on the planet. Now, with digital tickets and online forms, I save money and reduce paper waste, making the MTGA event more eco-friendly.
Delivery: Imagine long lines of people waiting to register—it made starting the event on time difficult. The old manual ticket system caused delays. With online registration, I’ve sped up the process. Attendees can register quickly and get their tickets through WhatsApp and email, cutting down wait times and ensuring everything runs smoothly.
Safety: Losing a physical ticket was stressful for attendees, and there was no real-time tracking of attendance. Now, with digital tickets, participants can easily access their tickets on their devices, and I can monitor who is present. This helps me manage safety and capacity effectively.
Morale: Long waits and confusion from manual management frustrated both attendees and organizers. This made the event feel chaotic. With the new digital system, I’ve created a better experience. Attendees enjoy shorter wait times and a smoother process, leading to greater satisfaction and a more positive atmosphere.
Productivity: The old manual processes slowed things down. I had to deal with extra tasks, making everything harder. By integrating registration and attendance into one system, I’ve improved productivity. Now, I can focus on making the event great instead of getting stuck in paperwork.
Environment: I wasted a lot of paper before, which was bad for the planet. Switching to a digital system has significantly reduced paper use. This not only helps the environment but also shows my commitment to sustainable practices that benefit everyone.
| Online Registration | Participants can fill out an online registration form that includes their name, employee ID (NIK), department, WhatsApp number, email, and a photo upload. After completing the registration, participants will receive a confirmation via email and WhatsApp. |
| Ticket Reception | After registering, participants will receive a digital ticket through WhatsApp and email. This ticket will have a barcode that will be used for various activities during the event. |
| Random Seat Allocation | Each participant will be assigned a seat bus number, which will be shown on their digital ticket. This ensures fair seating arrangements for everyone. |
| Attendance Check, Catering Pickup, and Gimmick | Participants can scan their digital tickets to check in for attendance at the event. The digital ticket will also be used to scan and collect pre-ordered catering and event gimmicks. |
| Door Prize Lottery | A door prize lottery platform will be available on the event website. The winner will be drawn through this platform, and the results will be announced on the website. |
| Thank You Message and Post-Event Review | After the event ends, participants will receive a thank you message via WhatsApp. This message will also include a link for them to provide feedback to the organizing committee. |
| Project Requirements | In developing the Project Requirements Document (PRD), I focused on outlining the key features and functionalities needed for the MTGA 2023 system. This document serves as a blueprint for the project, detailing everything from user needs to system specifications. You can review the complete PRD by clicking the button below. | View PRD |
| Design Process | I created the system flow independently by meeting directly with users to gather their feedback and requirements. After understanding their needs, I designed the wireframes using Whimsical to visualize the user interface and experience. To see the wireframes, click the button below. | View Wireframes |
| Technical Architecture | I designed the database architecture for the system using draw.io, where I created the Entity-Relationship Diagram (ERD) to illustrate how data will be structured and managed. You can access the ERD by clicking the button below. | View ERD |
| Coding and Testing Process | For the development of the website, I took charge of the frontend, writing the HTML, CSS, and JavaScript code. My teammate, Farhan Yudhi Fatah, supported me on the backend. You can explore our work on GitHub through the link below. | View Github |
I’m happy to share that the website for MTGA 2023 is now complete and is being used by almost 1,000 employees of PT Sanghiang Perkasa Kalbe Nutritionals. The event went really well, and many people praised the new system. Attendees appreciated how easy it was to register, receive their tickets, and participate in all the activities. This success reflects the effort and dedication put into creating and implementing the system. I’m proud to have contributed to this project, which improved the experience for everyone involved. Below, you can see a collection of images from this project, including screenshots of the system and photos from the event.
