The project
Several concepts aligned with Cubbo’s vision were presented, always respecting their identity, and the direction was refined with Ignasi until the final concept. From there, each page was approved almost without changes.
With the home page approved, development started in parallel while design finished the secondary pages.
The challenge
To merge two sites in two languages without losing content, rankings or sales forms, and to redesign it along the way.
The details
Under the hood
The CMS was structured to migrate every success story and every blog article from Mexico (es-MX) and Brazil (pt-BR), with a 301 redirect plan on Cloudflare and the sales forms connected to HubSpot, which notify the team on Slack.
Colour
The palette of Cubbo, by how much it is used on the delivered site. Hover over a colour.
Usage measured on recordings of the delivered site: every pixel counts towards the nearest colour; photos and gradients aside.
Typography
Measured on cubbo.com, at 1440 px.
Spacing
- Base step
- 4 px
- Between sections
- 64 px
- Container
- 1360 px
- 4gap, 47 times
- 6padding, 11 times
- 8gap, 74 times
- 12padding, 76 times
- 16padding, 21 times
- 24padding, 48 times
- 32padding, 41 times
- 40padding, 37 times
- 64padding, 12 times
The paddings, margins and gaps that repeat most on the delivered site, at 1440 px and true scale; almost all fall on 4 px steps.
Motion
GSAP with ScrollTrigger, SplitText and Flip; CMS loading with Finsweet.
How Cubbo connects
Four operation steps that you click and that change the image.
Six products, one system
The technology layer: each product with its animated isometric icon and its text.
Technology, network and expansion
Cubbo’s infrastructure with its figures, in photography.
Under the hood
Tools
- Figma
- Webflow
- GSAP
- Osmo Supply
- Finsweet
- HubSpot
- Cloudflare
How it is built
- A single Webflow project with es-MX and pt-BR localisation
- CMS migration: success stories and blog from both countries
- GSAP with ScrollTrigger, SplitText and Flip; CMS loading with Finsweet
- 301 redirects with Cloudflare
- Sales forms in HubSpot with Slack notifications
In numbers
- 2 → 1 sites unified
- 2 languages: es-MX and pt-BR
Conclusion
Mexico and Brazil now live in a single Webflow project, with es-MX and pt-BR localisation, both countries’ content migrated and 301 redirects so no rankings are lost.
The sales forms reach HubSpot and notify the team on Slack.
In their words
“We loved working with Andoni and Eric. The result exceeded our expectations, but the best part was how incredibly proactive they were. I never had to chase them: they came to me with solutions. From day one they understood who we are, what we do and what we needed.”
“The client’s testimonial about this project goes here: two or three lines, with their charcoal portrait. Placeholder for Eric.”