Transforming Rootflo’s website into a clear, modern & scalable AI narrative
I redesigned Rootflo’s entire website to solve clarity issues around our AI middleware product. I rebuilt the information architecture, simplified the narrative, introduced a modular product-page structure, and refreshed the UI to feel modern and enterprise-grade. The redesign improved understanding of what Rootflo does, increased demo signups, and became the foundation for our sales and investor conversations.
Skills
UX, Motion design, Interface design, Illustrations, Interaction design, Webflow development
Timeline
1 month
Tools
Why redesign?
The existing Rootflo website did not fully reflect the company’s current objectives
The website felt off brand - since the colours used were not on brand
Fragmented messaging, limited visuals, and no clear storytelling
Complicated illustrations that is time consuming which leads to high chances of users abandoning the site after few scrolls
Usage of stock images feels outdated, which is the opposite of what the company is doing - innovation
The planning.
🧭
The first step was defining what Rootflo does and the story we are trying to tell
🎯
Then we identified the point that makes us stand out
🧩
Developed a clear story flow that connects Rootflo’s purpose, products, and value
🎬
Structured the homepage and sub-pages to guide visitors seamlessly
Storyboard.
Showcased how Rootflo stands out with a bold headline, clean layout, and subtle animations
🎯
Explained the middleware concept with simple text and clear, illustrative storytelling.
Build credibility using numbers
Introducing our products using simple grid layout
The standout features that define Rootflo’s edge.
Testimonials that build confidence and authenticity.
Design decisions.
Typography
We needed a font with clean geometry and high legibility, allowing the interface to feel modern yet professional.
Colours
#0080E2 is used as the primary brand color to convey energy and trust — key traits in the fintech and AI ecosystem
Brand colour
Deep grey
White
Visual direction
A design that feels intelligent, enterprise-grade and human.
🎯
💙
📊
📱
🚀
Design approach.
Example 01
Explaining middleware
v1
Simplified explanation in just two scrolls with illustrations that explain the concept clearly.
Example 02
Showing use cases
Clean bento grid to show all the agents we currently have, easy to view in one glance
Learnings.
💡
Focused strategy upfront made the entire redesign easier - talked to the founders to understand what their intend is before designing
🎯
Simplifying complex ideas, using layouts users are already familiar with proved that clarity always creates stronger user understanding and trust
🤝
Cross-team collaboration with the sales team, and the engineering team helped align narrative & visual direction.
⚡
Thoughtful micro-details and interactions significantly improved the overall experience and feel of the website