My Role in this project is the Design lead and liaison to back end partner
The overall role of our organization for this project is to produce the interface and experience of the website and usability testing.
The project will have 3-way communication with Agency (Equity), Back end (Union), and Capitaland Investment
Main Communication: Email
Handoff Communication: Zeplin
Agency timeline for Front-end is 2 weeks.
Development is 1.5 months
After a successful demerger from the development business of CapitaLand Limited, CapitaLand Investment (CLI) was formed and the new organisation will be listed on 20 September 2021. This project will have 3 teams in each organisation which consists of our agency, a digital agency, and the CapitaLand team. For the visual approach and UI, we will have a 2-week timeline for ideation and initial usability testing before handing off to development for AEM integration.
The team is tasked to develop a new website for CapitaLand that will stand out among CapitaLand group and clearly communicates CapitaLand Investment’s vision, corporate values, and business objectives.
For the competitive analysis, the team shortlisted investment firms overseas namely, BlackRock, Brookfields, and Carlyle Group. We analysed by feature inventory and plus delta.
For this presentation, I will show the feature inventory
Who are we designing it for?
We will be emphatising on 2 types of users and prioritizing their motivations and goals for this website.
“The Investor Relations”
- Wants to clearly communicate what value does CLI give to interested parties
- To provide the latest information and news
- To communicate their latest sustainability goals
- Interested to know more about the new organisation
- To get first-hand information on the latest news and stock performance while on the move
Framing the problem
Shu needs a way to decimate information and news about CLI so that there will be a clear avenue to communicate with users.
Brad needs a way to access high-quality information about CLI so that he will get first-hand information on the move.
Based on our user research and synthesis the team has defined. We identified the best solution for CapitaLand Investment’s new website that will let their existing investors and new investors learn, read, and hop in.
The sitemap will stick to the hierarchical structure to condense the cognitive load on each page and to address CLI’s contents they want their users to get the value of. Gradually this will change after this phase of the project
Content assets will be managed by two platforms utilised by CapitaLand which are Adobe Experience Manager and ShareInvestor as most of the dynamic content like news and stock information will be reused.
Developing the Design
In developing the initial design the team did a rapid wireframing session and produced a high-fidelity prototype.
Setting the tone
The design direction will align with the mood board to set the tone and manner for producing components, icons, navigation, etc.
The Landing Page
The Landing page will be in auto full-screen cover page. The first slide will have the latest and most critical updates and important messaging. As for the rest of the slides they will be linked to their respective sections.
The Design System
Prototype and Usability
The prototype and usability were tested by the 2 types of users to be able to test, validate and get feedback.
*Please note this prototype was done last 2021 so most of the interactions and new overlay functions are not present at that time.
To cut things short, the usability result of the prototypes are 87% positive. There were some revisions on the contents due to heavy content on some pages resulting in cognitive overload.
Handoff and Development
After the 2 week sprint and testing, We have received a greenlight for handoff to the developer partner to build the site in their AEM platform. The developer will have a 1.5 months timeline including UAT before launch
Zeplin will be our main handoff and direct collaboration with the developer. Design specs, style guide, components, etc will be documented for easy referenceing.
As we conclude the project and applied the UX design process, we were able to iterate our research within a given amount of time and with a small team and our experience as an agency we were able to adapt quickly, especially in the handoff phase and integration with AEM.
Although, based on auditing the first phase of the project, CLI has to revise the contents and writeups to further reduce cognitive loads on main section pages and to be able to communicate clearly and easily with users.