Lantern Capital Website Redesign (UI Only)
A redesign of the Lantern Capital website based on new branding, functionality, and business initiatives.
Context
After developing new branding for Lantern Capital, the company sought a redesigned website to align with these updates. While no formal research or testing was conducted, adjustments were made to the flow and structure to complement the refreshed appearance and enhance the user experience.
Overview
-
Corporate Project
Full process was 1 year (June 2023 - June 2024)
Heuristic Evaluation
During my heuristic evaluation, I observed several accessibility issues. Many of the colour choices and placements did not conform to WCAG compliance, resulting in readability challenges or potential oversight by users. Additionally, I noted a lack of Call To Action (CTA) buttons on Lantern's website compared to its competitors. There was also a lack of differentiation among the existing CTA buttons in terms of function and colour scheme; the only distinguishable factor was their inconsistent sizes.
Regarding the website layout, the content felt unaligned on some pages, specifically the "who we are" page, which only consisted of the team members itself and said nothing about who Lantern Capital is as a company. Therefore, I felt this required some reorganization. Lastly, the website seemed deficient in providing comprehensive information about Lantern's services, operational processes, and client testimonials, which are crucial elements that competitors typically showcase.
Low-Fidelity Wireframes
Next, I developed 11 low-fidelity wireframes to demonstrate the updated layout that I believed would better serve Lantern Capital's users. The new design felt more user-friendly and contemporary. The previous navigation structure was confusing in terms of content placement. These pages now feel more cohesive and purposeful when integrated with content. Additionally, considering the company's growth and the need to accommodate additional services, this navigation layout allows for future expansion.
Information Architecture
.jpg)
Branding & UI Kit
Colour Palette
A significant and extensive aspect of this process involved developing the new and enhanced branding for Lantern Capital. Previously, the branding felt dull and uninspiring. To rejuvenate the brand, the marketing team and I collaborated and opted for brighter, more vibrant colours. While the colour palette remains relatively similar, it now feels revitalized. Logos were then updated and redesigned with the new palette.
Avenir Next LT Pro
Aa
Font Family
We selected and narrowed down on definitive fonts to maintain brand consistency. Choosing to keep things simple, we opted for the use of only one sans serif font family for everything with the exception of our tagline, which uses a contrasting script typeface.
UI Kit
The UI Kit incorporates the company's new colour palette, typeface, buttons, icons, and input fields.
High-Fidelity Wireframes
Transitioning to high fidelity wireframes was really exciting as it allowed for the integration of the new branding and really brought the design to life. These wireframes required a considerable amount of time to complete, with numerous adjustments along the way. Even now, there are elements present in the wireframes and the prototype that never made it to the live website.
Final Thoughts & Opportunities
Overall, I am extremely pleased with the outcome of the new website design. I believe the rebranding has given the company a refreshed feel, and the new layout appears more user-friendly. If I were to make any future adjustments, I might consider modifying some minor aspects, such as certain UI elements (e.g., button states). Additionally, I would be excited to implement the pages that were not included in the live website and see how they perform.