SDGs Jakarta (Part of Bappeda Pemprov DKI)
The Sustainable Development Goals (SDGs) are 17 global goals created by the United Nations in 2015 to build a better and more sustainable future by 2030. These goals address critical areas such as governance, economic development, social well-being, and environmental protection.
Jakarta is actively contributing to achieving Sustainable Development Goals at the local level through various government programs and events. While these programs are ongoing, awareness and public engagement remain relatively low, especially when it comes to understanding how impactful these goals are for our future.
This project focuses on enhancing the current SDGs website to engage a global audience more effectively by making it informative, more accessible, and aligned with the SDGs branding. The redesign focuses on intuitive navigation, clearer communication, and interactive content to increase user visits. It also ensures fast performance and accessibility across all devices, making the platform an effective tool to raise awareness.
Sector
Environmental and Social Impact
My Role
Full-stack Designer (Design & Development)
Timeline
January 2025 - June 2025
My Role
As a full-stack website designer in a government sector without a dedicated development team, I led the end-to-end process by analyzing the existing website’s to identify key pain points and opportunities for improvement. Based on the analysis, I redesigned full websites to create a more intuitive and engaging interface aligned with the SDGs branding. Additionally, I handled the full-stack development, developing both the front-end and back-end.
Problem
The current SDGs website faces several key challenges that impact user experience and engagement:
Accessibility and Efficiency:
The website’s page structure is complex, requiring users to go through multiple steps to access key content. This complexity discourages users from exploring the overall site and reduces overall engagement.
Content:
The content and visuals on the websites are not reflecting the SDGs branding. Inconsistent design elements and repetitive information cause confusion and weaken the overall message. Additionally, the page structure is cluttered and unclear, making it difficult for users to easily navigate and locate the information they need.
Functionality:
The website currently faces significant functionality issues, including poor mobile responsiveness, non-functioning features and slow loading times, making it difficult for users to find and view the content.
Solutions Discovery
Based on website traffic analysis using SimilarWeb tools, a thorough user experience audit, and interviews with users, I identified key areas for improvement and potential features to explore.
[Accessibility and Efficiency] Simplified navigation by reducing the number of steps and clicks needed to access all the pages.
[Accessibility and Efficiency] Improved integration between the website and social media.
[Content and Visual] Enhanced the theme to reflect more SDGs branding.
[Content and Visual] Reduced repetitive content and improved the structure and layout for cleaner, more readable content.
[Content and Visual] Optimized spacing and alignment between content elements.
[Content and Visual] Developed multiple language translations to provide a seamless experience for global users.
[Functionality] Fixed and improved non-functioning features and menus to provide seamless navigation.
[Functionality] Optimized mobile responsiveness for a better experience across devices.
Current Website Performance Analysis
Since we only had limited time for this project, one of the fastest ways to understand how users interacted with the existing platform overall was by conducting a website traffic and performance analysis using SimilarWeb (The data represents estimated results). The data revealed that the website attracts not only local but also global visitors, with the majority of users accessing the platform via mobile devices. However, the current site significantly underperforms compared to other SDGs-related platforms in Indonesia, especially in terms of user traffic and engagement.
We also observed that some visitors come from Instagram, indicating an opportunity to improve consistency and engagement between the website and social media. These findings highlight the need for a better mobile experience, stronger content, and more integrated communication across platforms.
Ideation & UX Strategy
User Interview
To better understand users’ real needs and pain points, I interviewed four people — two who had previously accessed the SDGs website and two first-time users. My focus is to understand how users experience the website and see whether they encounter any difficulties while exploring it. The findings revealed usability challenges among experienced users and valuable input from first-time users.
Most of participants found it challenging to locate important information, they also mentioned that the website felt cluttered and difficult to navigate. They also mentioned that inconsistent visuals and layout made it difficult to get a clear overview of the SDGs on the website. Mobile users especially struggled with unresponsive visuals, small text, and complex menus. On a positive note, some users liked the website’s clean, straightforward design and enjoyed the dynamic motion animations that made the experience more engaging.
User Journey
I mapped the user journey through key stages: identifying needs, finding information, exploring content, and revisiting the site. This helped identified how users interact with the website, their touch points, emotions, and pain points.
Users frequently face difficulties finding information due to confusing navigation and a cluttered layout. Unclear visuals that fail to reflect the SDGs, repetitive content, and slow loading times make it difficult for users to stay engaged while exploring the site. As a result, many users feel frustrated and discouraged from returning. These findings reveal clear opportunities to improve navigation, simplify content, and build a more engaging experience that can help increase website traffic.
Communication Strategy
During the ideation phase, I collaborated with the communication strategist team to explore how the website could better support SDGs campaign and reach a wider audience. Through these discussions, we aligned on the importance of optimizing content and keywords to improve search engine visibility (SEO) and strengthen communication with both local and global users.
We also re-evaluated the site’s information architecture. For example, the "News" section was renamed to "Articles" to reflect more flexible and informative content, while the "Program" section was expanded to not only highlight initiatives from the SDGs Secretariat but also include relevant SDGs programs across all Jakarta government events. These changes were made to ensure the platform communicates more effectively, meets a wider range of user needs, and encourages deeper engagement.
I also discussed the design outputs with SDGs stakeholders to ensure alignment with their expectations. Due to time constraints, we decided to move forward with the proposed design direction from the ideation phase to keep the project on track.
Final deliverables for full scope of improvements
After completing the research and UX audit, I finalized the overall improvements based on accessibility, content, visuals, and functionality. The updated design focuses on a cleaner layout, easier navigation, stronger SDGs identity, and better mobile responsiveness.
Below are the final design screens that showcase the full scope of enhancements across all pages.
Final Look Desktop
Final Look Mobile
Development Process
After finalizing the redesign, I developed the website using a full-stack approach. On the front end, I implemented the UI with HTML, CSS, JavaScript, and Tailwind CSS — ensuring responsive layouts, consistent design, and accessible interactions across devices.
For the back end, I built the system using Laravel and integrated Filament to simplify content management and streamline admin workflows. The backend was structured to support all content and dynamic data updates, making the platform easier to maintain and update.
Besides enhancing the website, I also optimized its performance and accessibility, reduced unnecessary page loads, developed an integrated translation feature using Google Translate, and ensured that both desktop and mobile users could navigate efficiently.
Below is the admin interface for managing and updating content, fully integrated with the CMS.
Final Thoughts
Revamping the SDGs Jakarta website wasn’t just about giving it a new interface, it was about making the platform more accessible, informative, and aligned with its global purpose. Through a focused redesign process that included UX approaches, design updates, functionality improvements the site became informative, faster, and easier to explore.
Even with limited time, every improvement aimed to help the website communicate SDGs goals more clearly. This project showed how thoughtful design and content can create real impact, connecting global users with local actions in a more engaging way.
