Skills & Tools
Ideation, Prototyping, Product Management, Figma
Responsibilities:
User research, product design, motion design
Duration:
6 Months
Redesigning a 15 years old CRM
When I started my new role, I faced a huge challenge: redesigning an old CRM application that was crucial for a call center spread across four countries. This software had grown without clear design direction, leading to a confusing mix of features and interfaces. This complexity made training new agents difficult and time-consuming. My goal was to simplify and update the system, making it easier to use and more efficient. This redesign wasn't just about making things look better; it was about improving the day-to-day work of hundreds of agents by making their essential tool more intuitive and straightforward. It was a big task, but I was ready to make the system better for everyone.
The following stage in updating our CRM involved researching competitors. Since CRMs are mostly used within companies, finding detailed comparisons was difficult. However, we worked hard to gather as much useful data as we could. We examined existing CRM systems with an eye on their features, how user-friendly they were, and how well they could grow. This meant looking into industry studies, using case studies that were publicly available, and asking for feedback from users of similar systems through our networks. Our aim was to discover the best approaches and new features to guide our redesign, making sure our CRM would not just meet but surpass the usual standards.
By using a focused method of hands-on observation and working together to plan, we created a strong base for a CRM system that is equipped to handle today's needs and adaptable for future growth
On the front lines
I spent over 15 hours closely observing the agents at work, gaining direct experience. This crucial step revealed how the CRM is used in their day-to-day activities.
Collective insight
The team and I then engaged with the agents through interviews. Their insights were invaluable, guiding us to understand the diverse needs and challenges faced in different scenarios.
Crafting Our Course
Armed with these revelations, we, as a team, mapped out our redesign strategy. Our objectives were crystal clear: to enhance usability, simplify processes, and build for the future.
Blueprinting the Future:
With a solid plan in hand, we set out to create a blueprint. Selecting tools like Bootstrap for their scalability, the team was energized and ready to transform these insights into a tangible, improved CRM system.
Through this streamlined approach of direct observation and collaborative planning, we laid a solid foundation for a CRM system that was ready to meet the demands of today and grow into tomorrow
In the next step of our CRM redesign, we used Yegor Mytrofanov's advanced method to organize our information better. This approach made our information structure much clearer and easier to use by visualizing it, instead of sticking to older, less user-friendly methods. This change made our CRM easier to understand and prepared it to serve as a detailed database later on. This important step significantly improved our CRM, making it more effective and adaptable for future needs.
In the next phase of our CRM redesign, we focused on researching competitors. Since CRMs are mainly used internally, finding detailed comparisons was challenging. We aimed to gather as much relevant data as we could, carefully examining existing CRM systems for their features, ease of use, and ability to grow. Our research included looking at industry reports, analyzing public case studies, and getting feedback from users of similar systems. Our goal was to identify the best practices and new ideas to guide our redesign, making sure our CRM would surpass standard expectations.
After establishing a strong foundation, we moved on to wireframing and sketching, key steps in visualizing our CRM concept. This process involved turning our research and strategies into visual drafts.
Creating wireframes
We began with wireframes, which are basic outlines of our CRM's structure. These helped us visualize the layout and ensured our design met the users' needs we had identified.
Detailing with Sketches
Alongside wireframing, we made detailed sketches to explore design options further. These sketches let us try various user interface elements and gave us a better idea of the final product's look and feel.
This stage was vital for refining our concepts. It allowed us to see the CRM's structure and flow clearly, helping us spot and fix any potential issues early on.
By carefully developing wireframes and sketches, we ensured our design choices would lead to a CRM that is easy to use, effective, and capable of growing with our needs.
In the next step of our CRM update, we focused on choosing a platform that could grow with us and was easy to maintain. Considering our limited number of front-end developers and the project timeline, we decided to simplify our approach. I chose to use a pre-made library of components and adapt it to our needs for several reasons:
Time Efficiency: Using an existing library sped up both the design and development stages.
Future Consistency: This method meant we could keep our design consistent in the future, even without a dedicated design team, because we had a reliable set of components to use.
Educational Benefit: It also showed our designers and developers how using a design system could make their work more efficient.We picked Bootstrap for its benefits.
Widespread Adoption: Its popularity means lots of resources and community support.
Responsiveness: Bootstrap is designed to work well on any device, ensuring our CRM looks good everywhere.
Customizability: Even though Bootstrap comes ready to use, we can still make it fit our specific needs.
Ease of Use: It's easy for our team to learn and use, making the process smoother.By choosing Bootstrap, we set up a strong and flexible foundation for our CRM, meeting our goals for scalability, consistency, and easy development.
In the next phase of our CRM redesign, we made a strategic decision to adopt a modular design complemented by a left-hand menu. This approach was driven by several key objectives:
Flexibility
The modular design allowed us to create distinct sections within the CRM that could be easily adjusted or expanded as needed.
User-Friendly Navigation:
The left-hand menu was chosen for its user-friendly navigation, enabling users to quickly find and switch between different modules or sections of the CRM.
Efficient A/B Testing:
With this structure, we could implement A/B testing more effectively. The modular nature meant that changes could be made to specific parts without extensive development work, facilitating continuous improvement based on user feedback.
This design choice was pivotal in ensuring that our CRM was not only adaptable and scalable but also positioned for ongoing optimization with minimal development overhead.
As the financial technology sector continues to evolve, the Dello team remains committed to ongoing improvements and innovations. Learn about the future roadmap of the app, exploring upcoming features, integrations, and strategies to stay at the forefront of user-centric fintech solutions. The Dello Fintech Banking App serves not only as a testament to the power of thoughtful UX design but also as a harbinger of what the future holds for seamless, secure, and enjoyable financial interactions.
