How to rebrand a website to resonate with the company's new strategic focus and audience?
As CreditBook evolved from consumer financial products to embedded finance, its brand and website needed a transformation. I helped develop a fresh new website that aligned with our new strategic focus and is poised to enhance CreditBook's market presence.
- Company
- CreditBook
- Industry
- FinTech / Embedded finance
- Role
- Brand and Web Designer
- Timeline
- 3 months, launched May 2024
- Team
- Mishal Khan (Brand Lead), Iman Jamall (Head of Design), Glenn Vanbavinckhove (Head of Engineering), Avinash Kumar (Software Engineer)
Overview
CreditBook's strategic focus was evolving from consumer financial products to embedded finance. The company had initially concentrated on its first product, the digital khata, and its original target audience. When executives and the sales team engaged with Financial Institutions (FIs) and banks, the existing brand and website no longer resonated with the new direction.
Background
In early 2024, CreditBook kicked off its rebranding journey to align with its new strategic focus. I played a significant role in leading the brainstorming and ideation sessions, helping to define the new brand foundations in color and typography. Once the new brand guidelines were established, the next critical step was to update the website to reflect these changes.
Analysis
I initiated the process by conducting a comprehensive competitive analysis. I collected screenshots of our market competitors' websites, meticulously organizing them and their content section by section with the help of my co-designer, Mariam. This provided a clear overview of industry standards and trends, which served as valuable references.
Ideation
I collaborated closely with the founders, Team Leads (TLs), and the Head of Design to outline the structure and content of each webpage. Through extensive ideation and multiple iterations, we finalized the website wireframes and its information architecture. This collaborative approach ensured that all stakeholders were aligned and that the website would effectively convey our new brand identity.
Design
With the wireframes in place, the Head of Design took on content design while I focused on visual and interaction design. This phase took the most time; designing the web pages was not linear—I often had to return to the wireframes and restructure the layout when stakeholders didn't align. Each web page went through at least 3 iterations.
Driven by competitor analysis, I selectively referenced elements from various websites that resonated with our brand values and visual language. Imagery plays a crucial role in creating engaging landing pages, so I actively collaborated with the brand and people teams to source high-quality visuals. I prioritized consistency in color palette, typography, and layout margins so the overall experience feels cohesive.
For developer handoff, I prepped the Figma workspace by organizing it into three sections: guidelines, web pages, and interactions (e.g. component states)—so developers could navigate easily. The revamped website is live at www.creditbook.pk.
Results
The entire rebranding process took approximately three months, with an additional two weeks for development. My team and I revealed the new branding and website on 17th May, 2024 in our company-wide Townhall meeting; I designed the invite for the event.
The outcome was extremely well-received within the company during our internal launch. The founders, TLs, employees, and partners all appreciated the efforts and the fresh new look of the website. The transformation is poised to have a positive impact on brand perception and engagement with the new target audience.
Learnings
This case study underscores the importance of a collaborative approach and thorough competitor analysis in rebranding efforts. By aligning the website with our new strategic focus, I created a cohesive and compelling brand presence. A few lessons:
- When designing complex landing pages, the fundamentals of your brand and design practices can help navigate the complexity.
- It's okay to ask for help when you can't figure something out—better to be proactive than to iterate through trial and error.
- Mobile-first isn't always the way to go for landing pages. Visual design is extremely important, and it can be difficult to overcome design bias when adapting smaller viewports to larger ones. In this case, I found it better to go desktop first.
Interested in working together? Get in touch.