Invopop
Success story
Working with Invopop was a pleasure for us, largely thanks to collaborating closely with Juan Moliner, Invopop’s co-founder. His boundless energy and creativity took us to the next level. Our main objectives focused on enhancing the design of specific pages and components to enrich the user experience and managing the CMS with over 100 items in Webflow. We implemented multiple references across collections and connected it to Notion as the primary database through WhaleSync.
Design Enhancements
For Invopop’s design, we focused on creating user-friendly pages that enhance both clarity and navigation. Key pages include the Countries Coverage page, the Invoicing Guides with interactive map, and a specific Coverage Tech page, each tailored to make complex content more accessible. Our design improvements aligns with Invopop’s visual identity, presenting information in a approachable way while supporting an easy-to-navigate user experience.
From Notion to Webflow with WhaleSync
Our integration between Notion and Webflow was highly granular. We created a fully automated CMS structure. We set up a process where Notion serves as the primary database, allowing the client to update data directly. Thanks to WhaleSync, each CMS item is synchronized with its respective fields. This enables components like customer success stories, local electronic invoicing costs, and country-specific data to be updated seamlessly. Everything syncs automatically, allowing the website to reflect new data dynamically with minimal manual effort from the Invopop team in Notion. This solution helps Invopop focus on what truly matters without the hassle of managing Webflow.
Interactive global map with SVGs from CMS
The interactive map we built is a feature we're particularly proud of. Each country on the map is set up as a CMS item, connected to Notion, and contains specific information like billing coverage status and regulations. SVG paths and XY coordinates allow for precise placement, while filtering options enable users to navigate by tags such as B2B, B2C, or B2G billing capabilities. The map’s interactive features, like hover animations and overlays, create an immersive experience for users exploring global billing regulations. With this CMS-driven approach, the map is both scalable and easily to update.
Multi-language with Webflow Localization
Using Webflow's localization feature, we translated all pages and CMS items from English to Spanish. Although the process was complex and largely manual, it allowed Invopop’s content to be SEO-friendly in both languages, paving the way for brand internationalization.
Conclusion
We transformed Invopop’s website into a user-centered platform, supported by a solid CMS foundation that can scale as Invopop grows. Through this project, we deepened our ability to develop interactive components that align aesthetically with the visual identity, as well as building a scalable website thanks to the CMS integrated with Notion with WhaleSync. Additionally, we adapted seamlessly to Invopop’s workflow, using Slack for communication and delivering tasks on-demand to ensure smooth collaboration and efficient project management.