Case Study
Internal Dashboard for
Bank Muamalat
Role:
UI Design
Type:
Internal Dashboard
Design System
Banking UI
Dashboard
Predictive Design
Have confidence and excel with your brand and business
Bank Muamalat is a local Malaysian bank. I designed the UI and design system, anticipating their needs with reusable components.
For this project, I was tasked with developing the user interface for an internal dashboard used by agents and bankers to manage customer loans, including tracking existing applications and processing new ones. My primary responsibility was to build a design system ensuring the bank’s product team had all the necessary UI components for seamless implementation.
Core tasks
Role & Responsibilities
Behind the scenes of work in progress
As the UI designer, my role extended beyond just designing individual screens. I had to predict the functional needs of the bank by anticipating which components would be essential for their internal workflow. The goal was to create a scalable, reusable design system that could evolve alongside the product.
Design Forecasting:
I analyzed the use cases of similar internal banking platforms to anticipate key interface elements. Components like buttons, graphs, tables, cards, form inputs, modals, and icons were identified as essential for loan management and tracking.
Building the Design System:
I created a unified design language, defining the color palette, typography, grid structure, and interaction patterns to ensure consistency across all touchpoints. Each component—such as data tables for loan tracking or graphs to visualize KPIs—was meticulously designed with flexibility in mind. These components could be easily adapted for future use cases.
Scalability and Flexibility:
I ensured the design system was modular, allowing developers to reuse components with minimal customization. Special attention was given to micro-interactions, ensuring the interface felt intuitive and polished.
Collaboration with Developers:
I worked closely with software engineers to align the design components with their development framework, ensuring a smooth handoff and seamless integration.
Homepage dashboard consists of summary of representative's customers
Loan applicants listing and preview
.jpg)
Customer loan profile summary page
New loan application
Key Outcome
Efficient design
By predicting their needs accurately, I provided the team with a ready-to-use design system, significantly reducing their development time.
Scalable system
The components I designed could be reused and expanded, ensuring the system evolves alongside the bank’s operations.
Enhance Usability
The interface allowed bankers to navigate complex information easily, resulting in smoother loan processing workflows.
Consistency
The design system ensured a cohesive user experience, maintaining the same visual and functional standards.
Outcome
Conclusion
Snippet of design system
This project showcases my ability to think beyond screen design and create robust, forward-thinking UI solutions.
Developing the design system required me to predict business needs, align closely with developers, and ensure the system was scalable and future-proof. With this experience, I am confident in my ability to take on a senior UI designer role, where I can create impactful, user-friendly designs that support business goals effectively.
