Background
As my first B2B Web project, I had the exciting opportunity to work on CleverTap’s Direct Call – an industry-first in-app voice feature that enables trusted and contextual communication with customers. As a pioneering industry-first solution, Direct Call allows businesses to reach out to their customers in real-time through a secure, unique and engaging channel.
As a sole designer on this project, my responsibility was to create a user friendly and seamless design that enabled users integrate VoIP with their software, offering businesses a competitive advantage in engaging with their customers.
Final Designs
View Records
Integration
Branding
Learnings
Designing for a Web and Mobile app have some stark differences. As a designer who had pre-dominantly designed for Mobile apps these are few of the learnings I’ve had in this project –
Information Architecture: As a designer, I focused on creating a user-friendly Information Architecture for the interface, with special attention to easy navigation. Unlike mobile apps, web dashboards have larger screens that allow for the display of more information, which can sometimes be overwhelming for users.
To tackle this, I applied Miller's Law and broke down complex information into smaller, more manageable chunks to improve the user experience. An example of this approach is the 'Branding' screen, where I identified a long list of action items required from the user's end. To avoid overwhelming them, I split the list into two parts, creating a more intuitive and user-friendly interface.
Filtering and Pagination: Large tables having vast amount of data that can be difficult to sort. I incorporated filtering options that allow users to quickly and easily narrow down the data they are interested in.
Additionally, I implemented pagination to help reduce cognitive overload and improve the overall usability of the table.
By doing so, I was able to create a table that is not only easy to use but also helps users find the information they need quickly and efficiently.
Design Approach
My approach towards conducting a competitive analysis for a B2B product was different than that of a B2C product. Unlike B2C products where they are often readily available for comparison, B2B products often require a more targeted approach that takes into account the unique needs and requirements of the business audience.
In this particular case, my research was further challenged by the lack of available products in the Indian market that could serve as a basis for comparison. As a result, I had to rely on my experience to identify the key components that I needed to develop in order to create a competitive offering. To ensure that our product would stand out in the market, I utilised a variety of techniques including the creation of competitive profiles. These profiles covered a range of factors including marketing strategy, target market, core business, usability, layout, navigation structure, compatibility, content, design and performance. I then conducted a SWOT analysis to identify the strengths, weaknesses, opportunities, and threats associated with my product and the competitive landscape.
SWOT Analysis
Building Empathy
Journey Mapping
To better understand the experience of our users when using the Direct Call feature, I created a customer journey map. This outlines the entire journey, from initial awareness to adoption and continued use of the feature, as well as any pain points or areas for improvements.
Information Architecture
To ensure a seamless experience for users accessing the Direct Call feature on CleverTap, an effective information architecture (IA) was created. This IA includes the various sections and sub-sections of the feature, enabling users to easily navigate and understand the functionality of VoIP. The IA was created with end-users in mind, ensuring that their goals and objectives were met in the most efficient and effective way possible.
Conclusion
As a designer, I gained valuable insights from my experience developing the Direct Call feature at CleverTap. The project emphasised the importance of balancing the needs of all stakeholders, and I made sure to keep everyone involved and informed throughout the development process. This included collaborating closely with the developers from the initial wireframe stage, which ensured the design was well-aligned with development. Overall, this experience helped me grow both as a designer and a team player.
