MAS Website Redesign – Monetary Authority of Singapore
Role in the project: User Interaction | User Interface design
About the project
The Monetary Authority of Singapore (MAS) is Singapore’s central bank and integrated financial regulator. It promotes sustained, non-inflationary economic growth through the conduct of monetary policy and close macroeconomic surveillance and analysis. It manages Singapore’s exchange rate, official foreign reserves, and liquidity in the banking sector.
As Singapore’s central bank, it had outgrown its previous website and wanted a design refresh as well as restructuring of its content.
(Above): The landing page of the “SGS” section
Colour Scheme
(Above): Old designs of the website before the redesign
Pain Points
• The site was difficult to navigate around as information was not properly organised.
• While the website was comprehensive, it was difficult to find the right content that one was looking for, as the search and filter tools did not point users to the relevant documents.
• Information was organised according to the organisation’s perspective rather than the actual content needs and topics.
• A lot of the data on the site was presented in a PDF format, making it more time consuming for users to process the information.
• The design of the site was not intuitive, cluttered and outdated. It presented too much information at a glance, causing users to be overwhelmed.
• The website was only usable to seasoned users as they had developed their own method of coping with specific challenges, while the website provided a tough learning curve for new users.
Problem Statement
As the digital world evolves, users found it increasingly difficult to navigate through a website that did not meet the demands of their daily digital lives. MAS had outgrown their previous site and it was no longer meeting the expectations of their users, when it came to usability, design and content organisation.
The Solution
To redesign the website by improving the Information Architecture and content labelling, so that users would be able to navigate through them with ease. The User Interface had to be refreshed as well, to reflect a more modern site and also to help enhance the updated features/functions we were going to introduce on the site.
(Above): Newly designed screens to help users easily understand the differences between the savings bonds available at MAS
(Above): The newly designed “Publications” section, with an improved search function and filters
Design Decisions
• For the visual design, as we had to stick to MAS’s corporate identity, we decided to play with lighter tones of their corporate colours to give the website a fresher look.
• Since the site is filled with a ton of information, we also made the decision to give it a lot of negative space, so that it would be easier for users to navigate through the content.
• Icons and illustrations were introduced to help the site be more visually appealing.
• Web accessibility was also taken into consideration. Text colours were all adjusted to pass the contrast guidelines.
• Clickable elements and text were all designed to be in gold, to make it easier for users to differentiate what could be clicked and what could not. Clickable text was also designed with an underline when hovered over, this was to address web accessibility as well.
• Content types tags were also designed to help label content clearly.