A ground-up redesign of Africa's leading conversational AI platform. Sarufi v2 democratizes AI—empowering business owners to build sophisticated chatbots without writing a single line of code, while giving developers the powerful APIs they crave. From visual flow builder to developer playground, this is AI made accessible.
Sarufi v1 was a technical marvel trapped in a confusing interface. Powerful NLU capabilities were hidden behind developer jargon. Business users—the very people who needed chatbots most—abandoned onboarding in frustration. Meanwhile, developers complained about documentation gaps and inconsistent API responses. We needed to serve both audiences without alienating either: the marketer building a customer service bot and the engineer integrating conversational AI into their product.
We rebuilt Sarufi's entire user experience around two distinct but connected paths. For business users: a visual flow builder where conversations are designed by connecting nodes—no code, no complexity. For developers: a playground where they can test APIs in real-time, see response formats, and copy working code. Both paths share a unified design system, wallet system for credits, and comprehensive documentation. The result: AI for everyone.
How we brought this project to life
Deep-dive into Sarufi's user base revealed two distinct personas: 'The Builder' (business users wanting no-code solutions) and 'The Integrator' (developers wanting API access). We interviewed 30 users, analyzed 200+ support tickets, and mapped drop-off points in the user journey. Key insight: builders failed at technical jargon; integrators failed at discovering features.
Restructured the entire platform around user intent. Created four distinct product areas: Builder (visual chatbot creator), Playground (API testing), Wallet (credits & billing), and Docs (comprehensive guides). Each area designed for its primary persona while remaining accessible to all.
Designed node-based conversation builder inspired by tools like Notion and Figma. Users drag intent nodes, connect them with conversation flows, and see their chatbot take shape visually. Added preview mode for testing without deployment. Result: non-technical users building production chatbots.
Created the Sarufi Playground: an interactive API explorer where developers write requests, see responses in real-time, and copy working code snippets. Dark mode by default. Integrated inline documentation. Response schemas for every endpoint. The goal: zero friction from idea to integration.
Built 'Sarufi UI'—a comprehensive design system with 70+ components shared across all products. Consistent spacing, typography, and interaction patterns. Light/dark mode support. Accessibility baked in. Documented for internal teams and potential open-source release.
Designed transparent credit-based billing system. Users see exactly how many conversations they can process, when credits refill, and what actions consume credits. Added usage analytics so businesses understand their chatbot's performance and ROI.
Soft-launched with 100 beta users, gathering feedback through in-app surveys and session recordings. Iterated on onboarding flow based on drop-off analytics. Full launch included migration guides for v1 users and dedicated support channel.
The visual identity of this project
See the transformation
How it looks on different devices
See the project in action
Explore the design details
Measurable impact and outcomes
Completion rate
Down from 2 hours
Active on Sarufi
Processed monthly
Ticket reduction
User happiness score
"Jackson didn't just redesign our UI—he reimagined how people interact with AI. The visual flow builder he designed has made conversational AI accessible to thousands of African businesses who never thought they could build chatbots. Our metrics tell the story: 15 minutes to first bot, 120% better onboarding. That's transformational."
