The UWCCSC Olympics game is one of the most anticipated annual events, bringing students, staff, teachers together to celebrate teamwork, sportsmanship, and the most important, to showcase their house spirit. As a part of the Computing Society Zhixing, we had the great opportunity to construct and develop the official website of Olympics 2025. For us, this project was not only an excellent experience for us to develop websites by ourselves and tackle technical issues, but also a challenge for our collaboration and problem solving skills. The aim of this document is to outline the construction process, the core functionalities, key takeaways from this wonderful adventure, and future expectations and improvements.
The entire projected started from the end of December, 2024, following discussions with the Olympics Core Team to confirm and finalize the requirements of this website. As completely new beginners in web development, we started from investigating the basics: Flask and SQLAlchemy. We wrote notes about the installation, the basic functions, and example codes of Flask and SQLAlchemy as a learning process. Besides, by learning through the official documents, we had a basic overview of the project.
Next, to ensure our future efforts align with the requirements of the stakeholders, we: 1.Distributed a collaboration form to the Olympics Core Team for clarifications of the details of our project. 2.Reviewed the previous year’s code to have an overall understanding of the structure. 3.Role distribution: Richard is in responsible for frontend development (HTML), Harry is in responsible for backend coding (Python).
At the starting of 2025, we entered the planning stage of our project. Referring to last year’s code, we listed all the routes of the website with a simple description of the function of each route. As the first time planning for a website by ourselves, the first version of list of routes was messy. However, we didn’t notice the problem at that time. Next, Harry started the code-writing of the database part, as it is the easiest part to start as a beginner. During the coding process, we received a lot of support from ChatGPT for debugging and coding. To make our collaboration with ChatGPT more efficient and effective, we also learned prompt engineering. With a few conservation, we temporarily finalized the structure of our database so we can start writing the code of different routes. During the Chinese New Year holiday (starting from the last week of January), both of us started working on this project. From the homepage to the house ranking page, we learned to code and to debug through conversation with our leader and ChatGPT. At the beginning of the coding process, it took us hours to write the code for one route, but after we are getting more and more familiar with the process, we became more efficient and used to the new languages.
The final website included several key features that enhanced both usability and functionality:
- Individual Event Pages: Each Olympic event had a dedicated page displaying rounds, match scores, player information, and winners. This helped participants and spectators keep track of progress in real time.
- Result Upload Interface for Managers: Core team members could log in through secure routes to upload or update match information, including scores and winners, without needing to handle raw files or backend tools.
- Auto-Matching Player Names: Instead of requiring exact ID inputs, the system allowed name-based entry with smart suggestions, reducing friction for event managers.
- Round and Match Management: We implemented a clean structure to separate events by round (e.g., Round 1, Semifinals, Finals), making it easier to trace a player’s journey through the competition.
- Match Tree Visualization: Perhaps one of the most visually appealing features was the tree structure showing tournament brackets. Each node displayed a player’s name, house, and house ID, offering a clear picture of progression.
- Real-Time Ranking Updates: As scores were entered, rankings and winners updated live, helping the audience stay informed and engaged.
- Responsive Design: The website was optimized for both desktop and mobile devices, ensuring broad accessibility regardless of the device being used.
While much of the development work was individual, the project could not have succeeded without collaboration. Throughout the process, I worked closely with the core organizing committee to gather requirements, test features, and iterate based on feedback. Teachers and sports managers also provided valuable input to ensure the system aligned with real-world needs. One of the biggest lessons I learned was the importance of communication and iterative testing. Early on, we faced several issues due to mismatched expectations—such as how rounds should be labeled or how score formats should be displayed. By continuously engaging with stakeholders, we were able to refine the design and improve usability. Another lesson was the significance of scalability and flexibility in design. Even though we started with a fixed list of events, the structure had to be adaptable in case of changes. Building reusable components and clear backend logic helped the system remain stable and maintainable throughout the Olympics period. Lastly, this project reinforced my belief in purpose-driven technology. Writing code is one thing, but seeing it solve a real problem—like helping managers save time, or letting students cheer on their house with updated rankings—was truly fulfilling.
While the 2025 Olympics website met its goals, there are several areas where we hope to improve and build upon the current foundation.
- First, we want to develop a mobile app version of the website to offer even more convenience during live events. Push notifications for match updates and personalized schedules could significantly improve the user experience.
- Second, we aim to incorporate analytics and insights, such as most valuable players, house win trends, or performance breakdowns by event. This would not only add an extra layer of engagement but also support sports analysis for future training.
- Third, we envision a more interactive bracket system, possibly using drag-and-drop tools or animations to better illustrate the progression of matches. Combined with enhanced visuals, this would make the website even more engaging for younger audiences.
- Finally, we hope to make the website open-source for future teams to adapt and improve. Documenting the codebase thoroughly and creating user guides will be essential in handing over the project to future student developers.