Spiro | Webflow Website Design and Integration
As part of my collaboration with Spiro, a forward-thinking electric bike company revolutionizing urban transport across Africa, I had the opportunity to shape their digital presence—from visuals to data automation. My work spanned across social media content, advertising assets, and, most importantly, Webflow-based website development and automation.
Year
2025
Service
Webflow Developer
Category
Webflow Development
Tool
Webflow
Kickstarting with CatchMoto: Social Media & Ad Creatives
When I first started working with Spiro as an offshore digital asset, my initial focus was on building their social media presence for the CatchMoto mobile app. I created visual posts and ad creatives tailored for the African EV market, highlighting the app’s features and promoting its use among new and existing users.
Webflow Website Management & Custom Development
As our collaboration deepened, I took full responsibility for managing Spiro’s Webflow website. This became a major part of my role. I started by making regular content updates and gradually expanded into redesigning entire pages to enhance user experience and visual consistency. From improving responsiveness to building interactive elements and custom lead generation forms, I handled everything directly—using a combination of Webflow’s native tools and custom HTML/CSS/JS for added functionality.
Created 3 New Pages for Upcoming Bike Launches
As part of Spiro’s upcoming product expansion, I designed and developed three new pages to support the launch of their latest electric bikes. Each page was built in Webflow, but enhanced with custom HTML, CSS, and JavaScript elements to create more interactive and engaging sections—such as animated specs, image sliders, and custom-styled components. These pages were crafted to match the brand’s style while showcasing each bike’s unique features in a compelling, user-friendly layout.
How I Automated Lead Collection and Integrated Real-Time Data
One of the most technically rewarding parts of the project was building automation workflows using Make.com. I set up seamless API integrations between Webflow forms and the company’s CRM systems to streamline lead collection. To take it a step further, I built custom-coded forms for greater control, and even connected Spiro’s internal dashboard API to the website. This allowed us to display real-time data—such as total rides, distance covered, and active users—right on the homepage.
I also added a custom email template to Webflow’s native form notification system, so that whenever a form is filled out, the team receives a branded, professional-looking email with the lead details. This improved both the clarity and visual consistency of internal communications.
To support their long-term content goals, I also created a CMS-powered blog/news section on the website. This allowed the team to easily publish updates, press releases, or feature stories without needing to touch the backend. I designed both the blog index and individual post templates for a clean, consistent, and SEO-friendly experience.
Tech Stack Summary
Webflow – Design, CMS, Hosting
Make.com – Workflow automation, API integration
HTML/CSS/JavaScript – Custom components, forms
Figma – Creative assets
Final Thoughts
My time working with Spiro has been both creatively fulfilling and technically challenging—in the best way. Starting with social media design and growing into full-stack Webflow development, I was able to build a more intelligent, automated, and user-centric platform that supports their mission and growth. This project represents the power of combining design, development, and automation—and it’s been a pleasure to help Spiro move one step closer to a cleaner, connected future.
