e-housing

e-housing

Reduced time taken by administrator in processing house applications and managing large customer data by 70%

Reduced time taken by administrator in processing house applications and managing large customer data by 70%

my role

my role

Research
Conceptualization
Protpotyping
Usability testing
Dev hand-off

Research
Conceptualization
Protpotyping
Usability testing
Dev hand-off

Team

Team

Product owner
Product manager
3 backed developers
1 frontend developer

Product owner
Product manager
3 backed developers
1 frontend developer

duration

duration

3 months

3 months

impact

impact

71% reduction in house application processing time

71% reduction in house application processing time

the introduction

e-Housing* is a government-led digital platform created to help low-income individuals apply for affordable homes more easily

*Due to NDA restrictions, the project name and data in this case study have been modified. However, the design process, challenges, and outcomes described are based on a real project.

the problem

Every application process felt like a lengthy, messy maze

Officers in different department mostly relied on manual steps by printing, scheduling meetings, chasing approvals, and uploading files by hand.

It slowed everything down as admins were overwhelmed, and applicants were left in the dark.

10+

fragmented workflows across multiple departments

10+

fragmented workflows across multiple departments

10+

fragmented workflows across multiple departments

75%

tasks are heavy reliance on manual documents and meetings

75%

tasks are heavy reliance on manual documents and meetings

75%

tasks are heavy reliance on manual documents and meetings

8 days

The duration from application submission to offer issuance was excessively long

8 days

The duration from application submission to offer issuance was excessively long

8 days

The duration from application submission to offer issuance was excessively long

the approach

How might we simplify the e-Housing workflow so that multi-department teams can process more applications, faster?

How might we simplify the e-Housing workflow so that multi-department teams can process more applications, faster?

After talking to users and officers in charge of applications, I studied how to design a service blueprint and dove deep into complex saas, which my favourite was IBM Carbon design system and Atlassian design system to understand how to build a scalable design pattern for multidepartmental workflows.

So I broke down to 3 focus areas of the design as below.

After talking to users and officers in charge of applications, I studied how to design a service blueprint and dove deep into complex saas, which my favourite was IBM Carbon design system and Atlassian design system to understand how to build a scalable design pattern for multidepartmental workflows.

So I broke down to 3 focus areas of the design as below.

Service design

Map the information flow between applicants and internal departments SOPs

Service design

Map the information flow between applicants and internal departments SOPs

Service design

Map the information flow between applicants and internal departments SOPs

Service design

Map the information flow between applicants and internal departments SOPs

Control of large data

Admin needs to be able to handle large data, adapt to departmental needs, and reduce manual errors

Control of large data

Admin needs to be able to handle large data, adapt to departmental needs, and reduce manual errors

Control of large data

Admin needs to be able to handle large data, adapt to departmental needs, and reduce manual errors

Control of large data

Admin needs to be able to handle large data, adapt to departmental needs, and reduce manual errors

Scalable for workflows

Components need to be reusable to build consistent experiences across departments handling similar processes.

Scalable for workflows

Components need to be reusable to build consistent experiences across departments handling similar processes.

Scalable for workflows

Components need to be reusable to build consistent experiences across departments handling similar processes.

Scalable for workflows

Components need to be reusable to build consistent experiences across departments handling similar processes.

the solutions

No more chasing down the corridor to sync on updates

To reduce back-and-forth and reduce unnecessary meetings, I decided to design notifications that trigger whenever an application’s status is updated.

By presenting the right information at the right time, the next responsible department is instantly notified, so they can take action without delay and stay aligned

🧠

ux psychology

Zeigarnik Effect

Unfinished tasks stay top of mind. Timely notifications help resolve this by signaling clear transitions.

🧠

ux psychology

Zeigarnik Effect

Unfinished tasks stay top of mind. Timely notifications help resolve this by signaling clear transitions.

🧠

ux psychology

Zeigarnik Effect

Unfinished tasks stay top of mind. Timely notifications help resolve this by signaling clear transitions.

🧠

ux psychology

Zeigarnik Effect

Unfinished tasks stay top of mind. Timely notifications help resolve this by signaling clear transitions.

Reducing guesswork in multi-approval steps

I built an action banner that surfaces approve/reject options right where you need them. Now, as soon as I’m ready, the responsible team whether it’s finance, legal, or housing can approve or decline in one click, keeping everyone in sync

🧠

ux psychology

Affordance / Action Visibility

The action is obvious and people don’t have to guess what to do next. The interface communicates it visually and interactively.

🧠

ux psychology

Affordance / Action Visibility

The action is obvious and people don’t have to guess what to do next. The interface communicates it visually and interactively.

🧠

ux psychology

Affordance / Action Visibility

The action is obvious and people don’t have to guess what to do next. The interface communicates it visually and interactively.

🧠

ux psychology

Affordance / Action Visibility

The action is obvious and people don’t have to guess what to do next. The interface communicates it visually and interactively.

Who did what, when and why?

When working with public information, transparency and accountability are very detrimental hence I designed a timeline-style history log that shows exactly who made each decision, when it happened, and the reasoning behind it. I also created scalable variants so this flow can work across any multi-step approval process.

🧠

ux psychology

Hindsight Bias

Without a visible timeline, people may misattribute or distort decision logic

🧠

ux psychology

Hindsight Bias

Without a visible timeline, people may misattribute or distort decision logic

🧠

ux psychology

Hindsight Bias

Without a visible timeline, people may misattribute or distort decision logic

🧠

ux psychology

Hindsight Bias

Without a visible timeline, people may misattribute or distort decision logic

Variants of timeline of approval

Each approval or rejection must have reasoning and reference

A much much better way to handle large data

I collaborated with backend engineers to map the raw data collected from applicants and design intuitive tables tailored to each department’s needs.

I also added conditional actions that only show valid next steps based on an application’s current status, preventing errors and keeping multi-stage workflows on track.

For example, if the current application's status is 'New', the action available is only 'To review'.

🧠

ux psychology

Progressive disclosure

Showing only what’s needed right now and revealing more later, when it’s relevant.

🧠

ux psychology

Progressive disclosure

Showing only what’s needed right now and revealing more later, when it’s relevant.

🧠

ux psychology

Progressive disclosure

Showing only what’s needed right now and revealing more later, when it’s relevant.

🧠

ux psychology

Progressive disclosure

Showing only what’s needed right now and revealing more later, when it’s relevant.

I built adaptive data tables with department-specific presets, so each team sees only the columns that matter to them

I built adaptive data tables with department-specific presets, so each team sees only the columns that matter to them

I built adaptive data tables with department-specific presets, so each team sees only the columns that matter to them

I built adaptive data tables with department-specific presets, so each team sees only the columns that matter to them

Advanced filters that turn time-consuming tasks into minutes

Advanced filters that turn time-consuming tasks into minutes

Advanced filters that turn time-consuming tasks into minutes

Advanced filters that turn time-consuming tasks into minutes

I implemented conditional bulk actions that only present the valid next steps based on each applicant’s current status.

I implemented conditional bulk actions that only present the valid next steps based on each applicant’s current status.

I implemented conditional bulk actions that only present the valid next steps based on each applicant’s current status.

I implemented conditional bulk actions that only present the valid next steps based on each applicant’s current status.

Expandable modal that lets users access key information quickly, without leaving the page.

Expandable modal that lets users access key information quickly, without leaving the page.

Expandable modal that lets users access key information quickly, without leaving the page.

Expandable modal that lets users access key information quickly, without leaving the page.

the impact

Less headache and more applications can be processed in a week

Less headache and more applications can be processed in a week

By redesigning the core experience from data tables to cross-team coordination, we not only sped up application processing but created reusable patterns that scaled across the organization.

71% faster processing time

Officers can now process an application and send offer letters in less than 2 days

71% faster processing time

Officers can now process an application and send offer letters in less than 2 days

71% faster processing time

Officers can now process an application and send offer letters in less than 2 days

71% faster processing time

Officers can now process an application and send offer letters in less than 2 days

Better cross-team coordination

Real-time notifications, approval banners, and role-specific views kept departments aligned, reducing delays and miscommunication.

Better cross-team coordination

Real-time notifications, approval banners, and role-specific views kept departments aligned, reducing delays and miscommunication.

Better cross-team coordination

Real-time notifications, approval banners, and role-specific views kept departments aligned, reducing delays and miscommunication.

Better cross-team coordination

Real-time notifications, approval banners, and role-specific views kept departments aligned, reducing delays and miscommunication.

Fewer errors, smoother workflows

Actions were shown only when valid, reducing mistakes and guiding users through multi-stage approval flows with confidence

Fewer errors, smoother workflows

Actions were shown only when valid, reducing mistakes and guiding users through multi-stage approval flows with confidence

Fewer errors, smoother workflows

Actions were shown only when valid, reducing mistakes and guiding users through multi-stage approval flows with confidence

Fewer errors, smoother workflows

Actions were shown only when valid, reducing mistakes and guiding users through multi-stage approval flows with confidence

the learning

Designing for with human, and system

I never imagined that redesigning manual interdepartmental SOPs would push me to think in completely new ways. At first, I struggled to understand how different teams workflows all fit together and those messy Excel sheets and paper approvals only made it harder.

With help of my team and over countless prototypes and iterations debated with stakeholders, we manage to transform those disjointed processes into seamless, connected interfaces.

In short, this project taught me to design for how people actually work by building a bridge between very very messy manual SOPs and an efficient digital solutions that prioritize accountability, transparency and very much, decency.

credits

Product Owner - Zulfa Juniadi

Product Manager - Syafiqah Haizam

Backend Engineers - Farisah, Hafiz, Hakimi

Front-end Engineers - Luqman

Product Owner - Zulfa Juniadi

Product Manager - Syafiqah Haizam

Backend Engineers - Farisah, Hafiz, Hakimi

Front-end Engineers - Luqman

Got something cool to build?

Let's connect

Work

About

repository

Resume

Copyright 2025 Izzul Syazwan
LinkedIn
Twitter/X
Instagram
izzuldesigns@gmail.com

Got something cool to build?

Let's connect

Work

About

repository

Resume

Copyright 2025 Izzul Syazwan
LinkedIn
Twitter/X
Instagram
izzuldesigns@gmail.com

Got something cool to build?

Let's connect

Work

About

repository

Resume

Copyright 2025 Izzul Syazwan
LinkedIn
Twitter/X
Instagram
izzuldesigns@gmail.com