Website UI/UX Design for the FMCG Industry's Sales Growth Platform
A complete UI/UX system for SalesDiary — the AI-powered front-line sales automation platform built for the FMCG industry — from visual design system to conversion-focused demo architecture.
A Sales Growth Platform for a Results-Oriented Audience
SalesDiary is a complete front-line sales automation platform built for the FMCG industry — a sector experiencing 25% CAGR and one where the gap between field sales performance and management visibility is a direct commercial cost. The platform is positioned as a Sales Growth Platform rather than a conventional sales management tool: it goes beyond data capture to actively improve secondary sales effectiveness through real-time coverage analytics, AI-powered decision support, and a mobile-first interface built for distributed field sales teams across diverse geographies.
The brief was to create a digital presence that positioned SalesDiary accurately and compellingly as the Sales Growth Platform for the FMCG industry — communicating the depth and intelligence of an AI-powered platform to a non-technical commercial audience, driving demo bookings as the primary conversion action, and reflecting the brand's established visual identity while adopting a lighter, more modern aesthetic across the full site.
The Enterprise SaaS Design Problem
Enterprise SaaS websites in the sales automation category face a specific design problem. The audience — FMCG sales directors, distribution heads, and business owners evaluating field sales technology — is results-oriented, time-pressured, and highly sceptical of technology promises they have heard before. They need to understand quickly and clearly what the platform does, how it addresses their specific operational challenges, and why SalesDiary is the right choice over the numerous competing options in the market.
The design challenge was to communicate the depth and intelligence of an AI-powered platform to a non-technical commercial audience — while driving a single conversion action and making a feature-dense product feel navigable rather than overwhelming. Every design decision needed to serve both first-impression credibility and the goal of a booked demo.
"Communicate the depth and intelligence of an AI-powered platform to a non-technical commercial audience — drive demo bookings, reflect the established visual identity, and make a feature-dense product feel navigable rather than overwhelming."
Where Every Decision Had a Reason
Every major design call addressed a specific commercial or audience challenge. The table below traces the reasoning behind the five most consequential decisions in the engagement.
The Design System, Layer by Layer
Five interlocking layers built a complete digital presence — from colour philosophy to conversion architecture.
See the Work
The full UI/UX project — visual design system, page layouts, and interactive prototype — is documented on Behance.
Questions about this engagement
Common questions about the SalesDiary UI/UX design project and First Launch's approach to B2B SaaS website design.
-
B2B SaaS UI/UX design covers the full digital product experience: visual design system (colour, typography, iconography), information architecture, page-by-page wireframing and design, conversion-focused layout decisions, and responsive implementation. For a platform like SalesDiary, it also means translating complex technical capabilities into a clear commercial narrative — so a sales director can quickly understand what the product does and why it matters to their operation.
-
The principle was outcomes first, evidence second. Every page section led with the business result the feature produces, then followed with technical detail for those who needed it. The homepage hero used a 3D mobile product visual to answer the most common first question — "what does it actually look like?" — before the headline. This approach reduced the cognitive distance between a qualified visitor's decision and their demo request.
-
SalesDiary's capabilities — secondary sales analytics, real-time geo-coverage tracking, distribution management — are specific to the FMCG sales technology category. Stock icon libraries are built for generic use cases and contain no accurate symbols for these features. Approximate substitutions would have undermined the precision the platform's positioning required. Custom icons ensured every capability was represented accurately and consistently, with a unified visual grammar throughout.
-
Conversion-focused UI/UX design works by reducing every source of friction between a qualified visitor's intent and the conversion action. For SalesDiary, this meant a dedicated Contact/Demo page with a single focused form, one high-contrast CTA, no competing navigation options, and clear supporting information. Beyond the conversion page itself, the overall site architecture — with outcomes-led content, a trust-building Trusted By section, and clear feature pages — reduces the time a visitor needs to reach a confident decision.
-
First Launch designs in Figma — the industry-standard tool for UI/UX work, prototyping, and design systems. Figma enables precise visual design, component-based design system management, and interactive prototyping that can be shared directly with development teams and stakeholders for review and approval before any code is written.
-
Yes. First Launch works with B2B SaaS companies across sales technology, distribution management, fintech, HR tech, and enterprise software — any platform where the design challenge is communicating technical depth to a commercial audience and driving a specific conversion action. The work spans full website redesigns, product UI design, design systems, and conversion-focused landing pages.
Explore More Case Studies
Take a look at First Launch case studies for tips & tricks on how to improve your own brand performance
One content system change took Line of Thought from 105 to 235 followers — with 39% of the audience in...
A greenfield Google Ads build for a US health-tech education platform. First 30 days. 148.5 course sign-ups. 24.79% conversion rate....
See how First Launch helped City Power & Gas rank #1 on Google for 5 competitive energy keywords across New...