FiveCRM: Brand & Website Redesign
Revamping the brand identity and website for a call center CRM.
Tokyo, Japan · 2021 - 2022.
CHALLENGE
Modernizing the brand and website to better reflect the product and support growth.
CLIENT
FiveCRM
SOFTWARE
Adobe Illustrator, InDesign, Photoshop & UXpin.
LANGUAGE
English
What is FiveCRM
FIVE CRM is a highly customizable hosted call center CRM that integrates with a wide range of telephony solutions and has a programmable API. It was designed for High Volume Outbound Calling and Email Marketing and major activities include lead generation and appointment setting.
PURPOSE
Goals & Objective
Create a new branding book to refresh the brand, and apply the new guidelines to their new website, product and other business implementations such as slide decks, social media posts, etc.
PURPOSE
Challenges
Navigating the dynamics of collaborating with a fully remote team spanning four distinct countries and operating across three different time zones can be a challenging endeavor. And maintaining the integrity of the original logo and adhering to the established color palette was also a requirement from thestakeholders. Our journey begins with a website that is both outdated and cluttered, presenting us with the exciting opportunity to rejuvenate and streamline its design and functionality.
VIRTUAL COOPERATION
Internationally spread team
-
3 developers ➡️ South Africa 🇿🇦 & Japan 🇯🇵
Lead implementation manager ➡️ Australia 🇦🇺 -
UI & visual designer ➡️ Japan 🇯🇵
-
Illustrator and animator ➡️ Poland 🇵🇱
-
Stakeholders ➡️ Australia 🇦🇺
-
Lead implementation manager ➡️ Australia 🇦🇺
BEST PRACTICES
Design & brand playbook
For this task - as well as other projects -, we used a set of proven strategies that our team had developed and improved over years of working with clients. These strategies include things like keeping things consistent, making visual information simple, knowing what to do and what not to do, and embracing the idea that sometimes less is more. From these strategies, we created a playbook that guides our design and branding work. This playbook covers various elements such as navigation bars, buttons, eye-catching top parts of a webpage, organized grids, attractive landing pages, and user-friendly onboarding processes.
STRUCTURE
Navigation insights
We designed a sitemap that played a crucial role in setting up how information is organized. This sitemap was fundamental in creating the navigation bar and footer design to visually display information. Moreover, it was essential for our developers to build the website effectively.
DESIGN
My visual design process
I created preliminary sketches, known as wireframes, based on the sitemap, and shared them with the key decision-makers to gather valuable input. My practice involves offering a range of options for stakeholders and clients to evaluate and compare, ensuring we collectively make well-informed choices. This iterative process helps us refine the design approach effectively.
REBRANDING SOLUTION
Overall design highlights
Regarding the brand guidelines, we embarked on crafting a fresh collection of illustrations and icons, ensuring a careful selection of colors and complementary shades. We ingeniously integrated logo segments into backgrounds, forming visually appealing patterns. As for the web design, our strategy included employing high-contrast elements and prominent call-to-actions to maximize conversion rates. We added dynamic animations to the above-the-fold section of the homepage, enhancing user engagement. Each webpage was meticulously structured into distinct sections for seamless navigation and enhanced user experience. We also ensured to have a very colorful and playful design and illustrations to reinforce the new brand colors.
WEBSITE REDESIGN
Sitemap
WEB & MOBILE MOCKUPS
Main project screens
RESULTS
Before & After comparison
FiveCRM's overall design across their site was very outdated and looked like a page from more than a decade ago. There was a lot of text and the information was not clearly structured, the CTA's were not visible, there was a lack of separation between blocks, and very a very dull use of colors and other assets.
We substituted the stock images for playful illustrations and since we had to keep the brand colors and logos, we used those as a way to reinforce the brand. We implemented our design best practices to completely transform the FiveCRM old site into a new clean but lively space.
GRAPHIC DESIGN
Other FiveCRM brand components
Upon completing the development of the brand guide and the comprehensive website overhaul, the stakeholders requested my engagement in generating additional graphic components. These elements are intended to reinforce the organization's overarching mission, encompassing materials like newsletters, ads and banners for their social media, a sales brochure, and company posters for their office.
