TopSend
Bulk messaging, a WhatsApp inbox, CRM, AI agents and a B2B database. Five products that called for five different screens. The job was to fit everything into one platform without turning it into an airplane cockpit.
Result: 59 screens on a single design system
- What
- Messaging, CRM and AI for sales teams
- Client
- TopSend
- Role
- Product Designer
- Timeline
- 2025 to present
- Platform
- Web
The problem
TopSend combines SMS, RCS, voice, IVR and WhatsApp with data enrichment, CRM and conversational AI. Each module was born on its own, and operators jumped between screens to follow a lead that was, in the end, the same one.
Beyond organizing it all, the design had to make visible the business rules customers feel in their wallet and in their operation.
- One source of truth
- The same lead shows up in lists, CRM and campaigns, with no copies.
- Pay only for what's delivered
- A failed send doesn't use up credit, and the interface shows it.
- AI with confirmation
- The assistant proposes the action and only runs it once approved.
- Nothing gets lost
- Lists, deals and users are archived, never deleted.
Design system first
Before any screens, I built a dark-first design system, with tokens, documented components, AA contrast for text and AAA for primary actions.
The project rule is simple: every screen uses the design system. If a component doesn't exist, it's created there before it shows up on a screen. That's what made it possible to reach 35 high-fidelity screens without any of them looking like a different product.
A new vertical
The same foundation became a product for iGaming operators. The unit of value changed (the active VIP player), the navigation changed, reorganized into flows (operations, CRM and administration), and Data Engine for the VIP base and dedicated AI agents were added.
That meant 24 new screens, and the design system absorbed the change with no visual rework.
Product documentation
7 specs I wrote to guide design, engineering and business.
WhatsApp support chat
A real-time support hub in the style of WhatsApp Web, with several numbers on one screen and conversations that become CRM leads without leaving the chat.
Flow
- 1Connect the number
- 2Receive the message
- 3Reply with quick responses
- 4Convert in the CRM
Interface states
- First visit
- Empty state with a tutorial and a single button: add a connection.
- Active support
- Three columns. The third one, with details, only appears once the lead exists.
- CRM link
- “Create lead” right in the conversation; if the lead already exists, it just links it and shows the stage.
Business rules
- Each user sees only their own connections and messages.
- A conversation is linked to one contact and one lead at a time.
- Messages show up on screen in under 500 ms.
- Typing “/” opens quick responses, but only if any have been saved.
6 functional requirements3 non-functional3 user stories
Result
35 platform screens and 24 iGaming vertical screens in high fidelity, all on the same design system.
Navigation organized by workflow, not by channel: operators find the lead, the conversation and the deal in the same place.
Have a similar product that's stuck?