Year
2026
Plarform
Web
my role
Web Designer
Webflow Developer
Outcome
Designed, developed, and delivered a fully interactive Webflow website single-handedly. Closed the project with client team maintenance training sessions so the venue could manage the site internally.
01
Problem & Why Do It
Problem: UOB LIVE's initial website was built in a rush to meet the venue's launch date, leaving little room for considered design or planning. Over time, this resulted in a compounding set of issues that made a full overhaul necessary.
- Brand (CI) update: A refreshed brand identity centred around "The Bubbles," representing the joy and wonder sparked by every event and performance. This made original site visually obsolete and failed to convey the prestige of the live experience the venue offers.
- Poor Navigation: Unclear navigation and calls-to-action made it difficult for users to find venue and event information. The inconsistent mix of Thai and English pages added further confusion, undermining trust and usability for both local and international visitors.
- Content management pain: The WordPress site meant the team had to rely on an external agency for every update, a significant bottleneck in a fast-paced industry where event schedules change constantly.
Navigation issues do not only exist in navbar, sections and footer also do not offer users with access to respective pages for more information.
New UOB LIVE Corporate Identity (CI) centering around “The Bubbles” concept.
The process
02
DISCOVERY
From the technical perspective, it was clear that a new webflow site that allow marketing team to make content edits internally directly solves the content management pain point. But this was only part of the solution. The remaining parts are understanding user goals.
User Goals
With input from the UOB LIVE’s marketing team domain expertise, we identified two primary user types: event-goers and event organizers, each visiting the site with distinct goals.
Event-goers goals
Event-organizers goals
03
Information architecture & Visual Directions
Information Architecture
Base on user goals and existing content on the site, I worked with the client’s marketing lead to draft a sitemap and content topics that will be under each page.
Mood boards
With UOB LIVE's brand identity centred around "The Bubbles," the creative direction was clear from the outset. Rather than exploring multiple concepts, I developed a single focused mood board and refined it through client feedback.
The visual direction centres on circular forms echoing the bubble motif, large typographic play, and a dark theme that puts image and video content front and centre — capturing the immersive experience the venue delivers. A sample screen was drafted early to support client alignment before moving into full design.
04
Wireframing
Wireframing: I started with mobile medium-fidelity wireframes to focus on content of each page.
User testing: As event-goers users can be easily recruited. I conducted 5 informal sessions both online and in-person to validate site structure.
User test findings
Iterating wireframe: I then update the wireframe with insights from user testing, and feedback from UOB LIVE’s team.
05
UI Design
High-fidelity designs were crafted with motion and animation in mind, with annotations and UI states included to ensure clear alignment. Given the time difference with the client, I recorded Loom walkthroughs to present the designs and prototypes asynchronously. Their feedback was then used to iterate and refine further.
Overview showing all screens designed for the project.
Key Pages
06
Development
The website was built in Webflow with GSAP powering interaction-based animations. All pages were tested across browsers and devices to ensure compatibility and responsiveness. The build also incorporated Finsweet, Lenis, Google Tag Manager, and Fillout libraries as well as custom code written to achieve the designed functionalities.
07
Client Training
To handover the project, I hosted training sessions with the client explain the fundamentals required to update and maintain the site.
Training sessions for UOB LIVE team on site management and content updates.
Document for marketing agency: Prepared a guide for SEO agency on how they can implement tacking on the site safely while maintaining GDPR compliant.
Site Maintenance Document : Prepared guideline for reference on how to manage, edit, and maintain the site.
08
outcome
The project delivered a fully interactive brand website that reflects UOB LIVE's refreshed identity, visually bold, content-led, and built for scale. The marketing team can now manage and publish event updates independently, without relying on an external agency. The site is fully responsive, bilingual, and equipped with animations that bring the energy of the venue to life online.
Future steps
- Conversion tracking: The marketing team should implement conversion markers to track event organiser form submissions, linking them to Google Ads campaigns. This would enable data-driven A/B testing to improve enquiry rates over time.
- Usability test with event organizers: Surfacing friction points that might be overlooked or are difficult to anticipate without direct observation.
- Site expansion: As the site matures, there is opportunity to deepen engagement through interactive campaigns, games, and loyalty-driven modules, giving users more reasons to return beyond event discovery and driving long-term brand advocacy.