THE SITUATION

The National Gallery Singapore had been developing a Progressive Web App for over a year before I joined — designed to help visitors plan gallery trips, explore art collections, purchase passes, and navigate the gallery during their visit. A principal designer had established the initial concept and screen designs but had departed the project before the design was complete.

When I came on board, I found a product with significant gaps: user flows were partially mapped but incomplete, several screens were missing across key interaction paths, and the prototype had so many broken links that it couldn't be tested end-to-end.

THE RESEARCH

To validate the PWA before committing to further design investment, I designed and ran a structured usability study with real gallery visitors. The goal was twofold: test whether the core features were actually usable, and help the NGS team validate their product concept.

DEFINING THE USER SEGMENTS

Based on existing visitor data and the NGS team’s observations, we identified two primary axes that would shape how visitors interacted with the PWA: digital comfort (immigrants vs. natives) and visit intent (planned vs. unplanned). This gave us four distinct segments to test against.

HOW WE TESTED

I wrote test scripts combining task-based scenarios with think-aloud protocol. Participants attempted core PWA tasks while narrating their thought process. We captured quantitative data (SUS, SEQ, task success rate, time-on-task) and qualitative data (verbal feedback, behavioural observations).

WHAT WE HEARD AND OBSERVED

THE DESIGN

The research gave us a clear prioritisation framework. We divided the redesign into two phases: Phase 1 — “Standard of Living” (critical usability barriers), and Phase 2 — “Quality of Living” (ease-of-use and feature comprehension).

PHASE 1 — FIXING WHAT’S BROKEN

These changes addressed the top issues from affinity mapping — barriers directly preventing task completion or causing misunderstanding of critical information.

PHASE 2 — MAKING IT INTUITIVE

With critical blockers resolved, Phase 2 tackled the structural issues that made features confusing — particularly the Art Journey purchase flow.

A NOTE ON STAKEHOLDER ALIGNMENT

The research clearly flagged “Art Journey” as a problematic term. We recommended renaming it, but the NGS steering committee chose to keep the name — it was tied to the gallery’s broader brand narrative. Rather than push against a firm stakeholder position, we redirected design effort toward reducing downstream confusion: simplifying the purchase flow and making the feature’s purpose clearer through context and visual cues rather than relying on the label alone.

EXTENDING THE EXPERIENCE TO KIOSK

Alongside the PWA redesign, I designed a standalone kiosk interface for the gallery floor. The kiosk shared core features with the PWA but needed to work for visitors standing in the gallery, looking for immediate orientation. It featured Art Journey browsing, pass access, artwork information with QR codes bridging to the visitor’s mobile device, and adapted interaction patterns for a shared, public touchscreen.

REFLECTIONS & NEXT STEPS