BEM KM UGM
Implementing the Cabinet's visual identity into a scalable web portal and advocacy platform.
00
problem
BEM KM UGM needed to translate its new "Grand Design" branding into a functional web ecosystem. With vast amounts of organizational data—from structures to daily news—the challenge was maintaining strict visual consistency while ensuring the interface remained user-friendly and responsive.
solution
I implemented a Unified Web System based on the Cabinet's established guidelines, ensuring strict adherence to color tokens and typography standards across all pages. I also architected "SapaBEM", a secure advocacy channel, and streamlined the information architecture for better student engagement.
Systemizing the Grand Design for the web
The Cabinet already possessed a strong visual identity (Grand Design). My engineering challenge was to bridge the gap between these static graphic guidelines and a dynamic web interface. I strictly implemented the established color palette and typography into reusable web components, ensuring that every button, card, and layout remained visually consistent with the organization's brand without compromising readability.
Beyond visuals, I focused on functionality. I designed the UX for "SapaBEM", an integrated advocacy feature. The priority was creating a safe, anonymous space for students to voice aspirations. The interface was designed to be approachable and simple, connecting user inputs directly to the internal processing pipeline.
Dealing with massive data was the real test. I restructured the content hierarchy to separate static information (like "Ruang Baca" for academic studies) from dynamic updates (like "Linimasa" for events). This logical separation ensures that the platform serves both as a reliable archive and an active engagement hub for students.
01
02
see also
