Redesigning Ngee Ann City Shopping Centre's Website
Redesigning Ngee Ann City Shopping Centre's Website
Redesigning Ngee Ann City Shopping Centre's Website
Redesigning Ngee Ann City Shopping Centre's Website
Enhancing User Experience with a Corporate Event Portal, Interactive Directory, and Event Features
Enhancing User Experience with a Corporate Event Portal, Interactive Directory, and Event Features
Enhancing User Experience with a Corporate Event Portal, Interactive Directory, and Event Features
Enhancing User Experience with a Corporate Event Portal, Interactive Directory, and Event Features
Classification
Classification
Classification
Website Design
Website Design
Website Design
Year
Year
Year
2025
2025
2025
Skills
Skills
Skills
User Research & Persona Development, Interaction Design, UI/UX Design, Prototyping, Information Architecture, Visual Design, Usability Testing, Content Strategy, Customer Experience Optimization
User Research & Persona Development, Interaction Design, UI/UX Design, Prototyping, Information Architecture, Visual Design, Usability Testing, Content Strategy, Customer Experience Optimization
User Research & Persona Development, Interaction Design, UI/UX Design, Prototyping, Information Architecture, Visual Design, Usability Testing, Content Strategy, Customer Experience Optimization




Service
Service
Service
UI/UX Design
UI/UX Design
UI/UX Design
Website Design
Website Design
Website Design
Duration
Duration
Duration
2 Weeks
2 Weeks
2 Weeks
Overview
Overview
Overview
Overview
The primary goal of the Ngee Ann City Shopping Centre (NAC) website redesign is to enhance the user experience for both tourists and corporate entities. For tourists, the website provides event listings, multilingual support, and a comprehensive directory that includes office spaces and co-working areas. For corporate clients, it introduces an event portal to streamline event registration and management. The redesign aims to create a more intuitive, engaging, and functional website that meets the needs of both visitors planning their trips and businesses seeking leasing or event collaboration.
The primary goal of the Ngee Ann City Shopping Centre (NAC) website redesign is to enhance the user experience for both tourists and corporate entities. For tourists, the website provides event listings, multilingual support, and a comprehensive directory that includes office spaces and co-working areas. For corporate clients, it introduces an event portal to streamline event registration and management. The redesign aims to create a more intuitive, engaging, and functional website that meets the needs of both visitors planning their trips and businesses seeking leasing or event collaboration.
The primary goal of the Ngee Ann City Shopping Centre (NAC) website redesign is to enhance the user experience for both tourists and corporate entities. For tourists, the website provides event listings, multilingual support, and a comprehensive directory that includes office spaces and co-working areas. For corporate clients, it introduces an event portal to streamline event registration and management. The redesign aims to create a more intuitive, engaging, and functional website that meets the needs of both visitors planning their trips and businesses seeking leasing or event collaboration.
The primary goal of the Ngee Ann City Shopping Centre (NAC) website redesign is to enhance the user experience for both tourists and corporate entities. For tourists, the website provides event listings, multilingual support, and a comprehensive directory that includes office spaces and co-working areas. For corporate clients, it introduces an event portal to streamline event registration and management. The redesign aims to create a more intuitive, engaging, and functional website that meets the needs of both visitors planning their trips and businesses seeking leasing or event collaboration.
This project is part of my comprehensive UX Design course at General Assembly, where I've gone through the entire case study process, from user research, ideation, and wireframing to designing, usability testing, and prototyping user-centered solutions.
This project is part of my comprehensive UX Design course at General Assembly, where I've gone through the entire case study process, from user research, ideation, and wireframing to designing, usability testing, and prototyping user-centered solutions.
The Challenge
The Challenge
The Challenge
The Challenge
For user research, we realised a challenge - that people do not use shopping mall websites. When they are finding a particular store, its more intuitive for them to search on google instead. We were unsure if the website could even help users since they are not even using it!
For user research, we realised a challenge - that people do not use shopping mall websites. When they are finding a particular store, its more intuitive for them to search on google instead. We were unsure if the website could even help users since they are not even using it!
For user research, we realised a challenge - that people do not use shopping mall websites. When they are finding a particular store, its more intuitive for them to search on google instead. We were unsure if the website could even help users since they are not even using it!
For user research, we realised a challenge - that people do not use shopping mall websites. When they are finding a particular store, its more intuitive for them to search on google instead. We were unsure if the website could even help users since they are not even using it!
Understanding The Problem
Understanding The Problem
Understanding The Problem
Understanding The Problem
We started by studying user interactions with shopping mall websites, focusing on recent visits. We also analyzed the current site’s target audience and conducted in-person research at Ngee Ann City by speaking with customer service. Key Findings: Customer Service Insights: The Customer Service Officer was overwhelmed with calls, handling inquiries about directions, product details, stock, exchanges, and returns, often transferring them to other departments. Event organizers also relied solely on this line, adding to the inefficiency. User Behavior Patterns: From our research, we discovered two main user groups for the website: 1. Tourists: Users rarely visit shopping mall websites locally. Instead, they primarily access them when traveling overseas to plan their trips. This behavior highlights that tourists use mall websites for trip planning rather than for local shopping purposes. 2. Corporate Entities: The website appears to be geared more towards corporate entities, with leasing inquiries prominently featured in the main navigation bar, including detailed sections for promotional space, advertising space, office space, and retail space.
We started by studying user interactions with shopping mall websites, focusing on recent visits. We also analyzed the current site’s target audience and conducted in-person research at Ngee Ann City by speaking with customer service. Key Findings: Customer Service Insights: The Customer Service Officer was overwhelmed with calls, handling inquiries about directions, product details, stock, exchanges, and returns, often transferring them to other departments. Event organizers also relied solely on this line, adding to the inefficiency. User Behavior Patterns: From our research, we discovered two main user groups for the website: 1. Tourists: Users rarely visit shopping mall websites locally. Instead, they primarily access them when traveling overseas to plan their trips. This behavior highlights that tourists use mall websites for trip planning rather than for local shopping purposes. 2. Corporate Entities: The website appears to be geared more towards corporate entities, with leasing inquiries prominently featured in the main navigation bar, including detailed sections for promotional space, advertising space, office space, and retail space.
We started by studying user interactions with shopping mall websites, focusing on recent visits. We also analyzed the current site’s target audience and conducted in-person research at Ngee Ann City by speaking with customer service. Key Findings: Customer Service Insights: The Customer Service Officer was overwhelmed with calls, handling inquiries about directions, product details, stock, exchanges, and returns, often transferring them to other departments. Event organizers also relied solely on this line, adding to the inefficiency. User Behavior Patterns: From our research, we discovered two main user groups for the website: 1. Tourists: Users rarely visit shopping mall websites locally. Instead, they primarily access them when traveling overseas to plan their trips. This behavior highlights that tourists use mall websites for trip planning rather than for local shopping purposes. 2. Corporate Entities: The website appears to be geared more towards corporate entities, with leasing inquiries prominently featured in the main navigation bar, including detailed sections for promotional space, advertising space, office space, and retail space.
We started by studying user interactions with shopping mall websites, focusing on recent visits. We also analyzed the current site’s target audience and conducted in-person research at Ngee Ann City by speaking with customer service. Key Findings: Customer Service Insights: The Customer Service Officer was overwhelmed with calls, handling inquiries about directions, product details, stock, exchanges, and returns, often transferring them to other departments. Event organizers also relied solely on this line, adding to the inefficiency. User Behavior Patterns: From our research, we discovered two main user groups for the website: 1. Tourists: Users rarely visit shopping mall websites locally. Instead, they primarily access them when traveling overseas to plan their trips. This behavior highlights that tourists use mall websites for trip planning rather than for local shopping purposes. 2. Corporate Entities: The website appears to be geared more towards corporate entities, with leasing inquiries prominently featured in the main navigation bar, including detailed sections for promotional space, advertising space, office space, and retail space.
“I only use shopping mall websites when I'm overseas, not Singapore mall websites, since I'm already familiar with the malls here.”
“I only use shopping mall websites when I'm overseas, not Singapore mall websites, since I'm already familiar with the malls here.”
“I only use shopping mall websites when I'm overseas, not Singapore mall websites, since I'm already familiar with the malls here.”
“I only use shopping mall websites when I'm overseas, not Singapore mall websites, since I'm already familiar with the malls here.”
The Solution
The Solution
The Solution
The Solution
Our approach was not only to redesign the website but to make it more user-friendly for both tourists and corporate entities. Here's how we addressed each group's needs:
Our approach was not only to redesign the website but to make it more user-friendly for both tourists and corporate entities. Here's how we addressed each group's needs:
Our approach was not only to redesign the website but to make it more user-friendly for both tourists and corporate entities. Here's how we addressed each group's needs:
Our approach was not only to redesign the website but to make it more user-friendly for both tourists and corporate entities. Here's how we addressed each group's needs:




Fit
Fit
Fit
Fit
For Tourists: Enhanced Directory: Expanding the directory to include not just the atrium but also Towers A & B, which house offices, clinics, and co-working spaces—features that could benefit tourists as well.
For Tourists: Enhanced Directory: Expanding the directory to include not just the atrium but also Towers A & B, which house offices, clinics, and co-working spaces—features that could benefit tourists as well.
For Tourists: Enhanced Directory: Expanding the directory to include not just the atrium but also Towers A & B, which house offices, clinics, and co-working spaces—features that could benefit tourists as well.
For Tourists: Enhanced Directory: Expanding the directory to include not just the atrium but also Towers A & B, which house offices, clinics, and co-working spaces—features that could benefit tourists as well.
Comfort
Comfort
Comfort
Comfort
For Corporate Entities: Corporate Event Portal: Introducing a portal to streamline event registration and management, enhancing efficiency and user satisfaction for corporate clients.
For Corporate Entities: Corporate Event Portal: Introducing a portal to streamline event registration and management, enhancing efficiency and user satisfaction for corporate clients.








Ease of Use
Ease of Use
Ease of Use
Ease of Use
For Tourists: Before: The current and upcoming events were spread across multiple pages, with excessive text that overwhelmed the audience with too much information. After: Events are now prominently featured on the homepage with engaging hero images and consolidated into a single, dedicated Events page, providing a clearer and more user-friendly experience.
For Tourists: Before: The current and upcoming events were spread across multiple pages, with excessive text that overwhelmed the audience with too much information. After: Events are now prominently featured on the homepage with engaging hero images and consolidated into a single, dedicated Events page, providing a clearer and more user-friendly experience.
For Tourists: Before: The current and upcoming events were spread across multiple pages, with excessive text that overwhelmed the audience with too much information. After: Events are now prominently featured on the homepage with engaging hero images and consolidated into a single, dedicated Events page, providing a clearer and more user-friendly experience.
For Tourists: Before: The current and upcoming events were spread across multiple pages, with excessive text that overwhelmed the audience with too much information. After: Events are now prominently featured on the homepage with engaging hero images and consolidated into a single, dedicated Events page, providing a clearer and more user-friendly experience.
The Result
The Result
The Result
The Result
1. Enhanced User Engagement By introducing features such as event listings, multilingual support, and a comprehensive directory of office spaces and co-working areas, the website became more informative and accessible to both tourists and corporate entities. Key metrics to track: User engagement rates, time spent on site, and interaction with key features. 2. Streamlined Event Management The addition of a dedicated event portal simplified the process for corporate entitles to register and manage events, improving operational efficiency and client satisfaction. Key metrics to track: Number of events registered through the portal, user satisfaction ratings, and reduction in manual processing time. 3. Improved Customer Support Efficiency By addressing common inquiries through the website's features, there should be a noticeable reduction in the volume of calls to customer service, allowing staff to focus on more complex issues. Key metrics to track: Call volume reduction, response time to inquiries, and customer satisfaction scores. These enhancements collectively improved Ngee Ann City Shopping Centre's operational efficiency and customer engagement, setting a solid foundation for future growth.
1. Enhanced User Engagement By introducing features such as event listings, multilingual support, and a comprehensive directory of office spaces and co-working areas, the website became more informative and accessible to both tourists and corporate entities. Key metrics to track: User engagement rates, time spent on site, and interaction with key features. 2. Streamlined Event Management The addition of a dedicated event portal simplified the process for corporate entitles to register and manage events, improving operational efficiency and client satisfaction. Key metrics to track: Number of events registered through the portal, user satisfaction ratings, and reduction in manual processing time. 3. Improved Customer Support Efficiency By addressing common inquiries through the website's features, there should be a noticeable reduction in the volume of calls to customer service, allowing staff to focus on more complex issues. Key metrics to track: Call volume reduction, response time to inquiries, and customer satisfaction scores. These enhancements collectively improved Ngee Ann City Shopping Centre's operational efficiency and customer engagement, setting a solid foundation for future growth.
1. Enhanced User Engagement By introducing features such as event listings, multilingual support, and a comprehensive directory of office spaces and co-working areas, the website became more informative and accessible to both tourists and corporate entities. Key metrics to track: User engagement rates, time spent on site, and interaction with key features. 2. Streamlined Event Management The addition of a dedicated event portal simplified the process for corporate entitles to register and manage events, improving operational efficiency and client satisfaction. Key metrics to track: Number of events registered through the portal, user satisfaction ratings, and reduction in manual processing time. 3. Improved Customer Support Efficiency By addressing common inquiries through the website's features, there should be a noticeable reduction in the volume of calls to customer service, allowing staff to focus on more complex issues. Key metrics to track: Call volume reduction, response time to inquiries, and customer satisfaction scores. These enhancements collectively improved Ngee Ann City Shopping Centre's operational efficiency and customer engagement, setting a solid foundation for future growth.
1. Enhanced User Engagement By introducing features such as event listings, multilingual support, and a comprehensive directory of office spaces and co-working areas, the website became more informative and accessible to both tourists and corporate entities. Key metrics to track: User engagement rates, time spent on site, and interaction with key features. 2. Streamlined Event Management The addition of a dedicated event portal simplified the process for corporate entitles to register and manage events, improving operational efficiency and client satisfaction. Key metrics to track: Number of events registered through the portal, user satisfaction ratings, and reduction in manual processing time. 3. Improved Customer Support Efficiency By addressing common inquiries through the website's features, there should be a noticeable reduction in the volume of calls to customer service, allowing staff to focus on more complex issues. Key metrics to track: Call volume reduction, response time to inquiries, and customer satisfaction scores. These enhancements collectively improved Ngee Ann City Shopping Centre's operational efficiency and customer engagement, setting a solid foundation for future growth.












Business Impact
Business Impact
Business Impact
Business Impact
View Prototype:
View Prototype:
View Prototype:
View Prototype:




Branding
Branding
Branding
Branding
To ensure a cohesive design, I established a design system that defined the color palette, typography, and iconography, creating a unified design language across the website. With the design system in place, my teammates can easily follow the guidelines and create screens independently, requiring minimal assistance.
To ensure a cohesive design, I established a design system that defined the color palette, typography, and iconography, creating a unified design language across the website. With the design system in place, my teammates can easily follow the guidelines and create screens independently, requiring minimal assistance.




Brand Colors
Brand Colors
Brand Colors
Brand Colors
In addition to the mall's website, there is a corporate event portal that I designed to be both unique and aligned with the mall's branding. While it has its own distinct features, the design elements and overall style are carefully coordinated to maintain a cohesive brand identity, ensuring users recognize it as part of the same brand.
In addition to the mall's website, there is a corporate event portal that I designed to be both unique and aligned with the mall's branding. While it has its own distinct features, the design elements and overall style are carefully coordinated to maintain a cohesive brand identity, ensuring users recognize it as part of the same brand.
In addition to the mall's website, there is a corporate event portal that I designed to be both unique and aligned with the mall's branding. While it has its own distinct features, the design elements and overall style are carefully coordinated to maintain a cohesive brand identity, ensuring users recognize it as part of the same brand.
Typography
Typography
Typography
Typography
For typography, I selected Castoro for display text and Inter for headings and body content, ensuring readability and consistency throughout.
For typography, I selected Castoro for display text and Inter for headings and body content, ensuring readability and consistency throughout.
For typography, I selected Castoro for display text and Inter for headings and body content, ensuring readability and consistency throughout.
For typography, I selected Castoro for display text and Inter for headings and body content, ensuring readability and consistency throughout.







Spacing
Spacing
Spacing
Spacing
The website layout is structured using a 12-column grid system, with 40px margins and 16px gutters, ensuring consistent alignment and responsiveness across diverse screen sizes. This grid framework optimizes content distribution while maintaining a clean, organized interface. Spacing is governed by an 8pt modular scale, with increments of 8px (8, 16, 24, 32, etc.) applied consistently throughout the design. This 8pt spacing system aligns with Apple’s Human Interface Guidelines, achieving an ideal balance between density and whitespace to enhance both readability and overall usability.
The website layout is structured using a 12-column grid system, with 40px margins and 16px gutters, ensuring consistent alignment and responsiveness across diverse screen sizes. This grid framework optimizes content distribution while maintaining a clean, organized interface. Spacing is governed by an 8pt modular scale, with increments of 8px (8, 16, 24, 32, etc.) applied consistently throughout the design. This 8pt spacing system aligns with Apple’s Human Interface Guidelines, achieving an ideal balance between density and whitespace to enhance both readability and overall usability.




Learnings & Next Steps
Learnings & Next Steps
Learnings & Next Steps
Learnings & Next Steps
What I’ve learned through this process is that while solutions may seem straightforward initially, in UX design, research uncovers deeper insights. I first assumed that improving the website’s directory navigation would drive more traffic. However, I realized that most users simply googled what they’re looking for, meaning the mall's website might still struggle to attract attention. By conducting thorough user research and analyzing the website’s target audience, I was able to identify the underlying issues. Engaging with customer service staff provided invaluable insights, as they have direct interactions with users and understand their pain points, helping inform a more effective, user-centered solution. For the next steps, I can look into designing the back-end for the Ngee Ann City website to improve how event bookings are handled. This will involve analyzing the current system, identifying pain points, and developing a more efficient process for event organizers and staff. By focusing on the back-end, I can ensure that the booking workflow is seamless, automated where possible, and aligns with the needs of both users and administrators.
What I’ve learned through this process is that while solutions may seem straightforward initially, in UX design, research uncovers deeper insights. I first assumed that improving the website’s directory navigation would drive more traffic. However, I realized that most users simply googled what they’re looking for, meaning the mall's website might still struggle to attract attention. By conducting thorough user research and analyzing the website’s target audience, I was able to identify the underlying issues. Engaging with customer service staff provided invaluable insights, as they have direct interactions with users and understand their pain points, helping inform a more effective, user-centered solution. For the next steps, I can look into designing the back-end for the Ngee Ann City website to improve how event bookings are handled. This will involve analyzing the current system, identifying pain points, and developing a more efficient process for event organizers and staff. By focusing on the back-end, I can ensure that the booking workflow is seamless, automated where possible, and aligns with the needs of both users and administrators.
What I’ve learned through this process is that while solutions may seem straightforward initially, in UX design, research uncovers deeper insights. I first assumed that improving the website’s directory navigation would drive more traffic. However, I realized that most users simply googled what they’re looking for, meaning the mall's website might still struggle to attract attention. By conducting thorough user research and analyzing the website’s target audience, I was able to identify the underlying issues. Engaging with customer service staff provided invaluable insights, as they have direct interactions with users and understand their pain points, helping inform a more effective, user-centered solution. For the next steps, I can look into designing the back-end for the Ngee Ann City website to improve how event bookings are handled. This will involve analyzing the current system, identifying pain points, and developing a more efficient process for event organizers and staff. By focusing on the back-end, I can ensure that the booking workflow is seamless, automated where possible, and aligns with the needs of both users and administrators.
What I’ve learned through this process is that while solutions may seem straightforward initially, in UX design, research uncovers deeper insights. I first assumed that improving the website’s directory navigation would drive more traffic. However, I realized that most users simply googled what they’re looking for, meaning the mall's website might still struggle to attract attention. By conducting thorough user research and analyzing the website’s target audience, I was able to identify the underlying issues. Engaging with customer service staff provided invaluable insights, as they have direct interactions with users and understand their pain points, helping inform a more effective, user-centered solution. For the next steps, I can look into designing the back-end for the Ngee Ann City website to improve how event bookings are handled. This will involve analyzing the current system, identifying pain points, and developing a more efficient process for event organizers and staff. By focusing on the back-end, I can ensure that the booking workflow is seamless, automated where possible, and aligns with the needs of both users and administrators.
PORTFOLIO
PORTFOLIO
CHECK OUT SOME MORE
CHECK OUT SOME MORE
CHECK OUT SOME MORE
CHECK OUT SOME MORE
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
UI/UX
Web Design
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
UI/UX
Web Design
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
UI/UX
Web Design
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
Redesigning Ngee Ann City's Website
UI/UX
Web Design
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
UI/UX
Web Design
Mobile Design
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
UI/UX
Web Design
Mobile Design
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
UI/UX
Web Design
Mobile Design
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
Cozyplace: Booking Made Easy
UI/UX
Web Design
Mobile Design
HAVE A PROJECT
HAVE A PROJECT
HAVE A PROJECT
HAVE A PROJECT
IN MIND ?
IN MIND ?
IN MIND ?
IN MIND ?