user experience


MSA Annual Report

As the Lead Graphic Designer, I created the MSA Annual Report using Ceros, an interactive content system. MSA is the first student association collaborating with Ceros to create more engaging information for students. The Impact Report you see on the MSA website educates students about how the association supports them. One notable section is the Finances page (page 9) where I used a claw machine to show how funds benefit students. I used layered graphics and Ceros animations, allowing users to click buttons on the claw machine to make it move!

The initial encounter features a panoramic video showcasing the MSA front desk, complemented by an illustrative map beneath. This map, crafted by me, serves as a visual aid to assist students in navigating the report’s content. Throughout the entire document, I maintained consistency with MSA branding and style, while strategically embedding links to the comprehensive PDF report for those seeking a more in-depth exploration.

To enhance user convenience, I ensured that the experience is seamlessly optimized for both mobile and desktop platforms. Students can effortlessly access the report by scanning a QR code with their smartphones. Furthermore, I prioritized accessibility by incorporating a “reduce motion” button on the top right corner of the homepage, enabling users to halt page animations as needed.