How Katana migrated its site from Squarespace to WeWeb to increase its web performances

Context & problematic

Katana is the first Smart Manufacturing SaaS, designed to revolutionize the way modern makers, crafters and small manufacturers work. It is an innovative, easy-to-use, and affordable solution for managing production and inventory efficiently.

Katana is a very content-driven company, generating a lot of valuable online content for their customers and anyone interested in their industry.

Historically, Katana built its website using Squarespace, a monolithic visual site builder. They quickly grew their site to more than 200 pages and were confronted with the limitations of this tool:

• a monolithic architecture not optimized for web performances
• a black-box for developers, not allowing them to add custom elements in the website.

Given these limitations, Katana knew they had to migrate to a more modern architecture. They needed to gain in flexibility while boosting their web-performances given the direct relationship between web-performances and the conversion rate -> each 100ms of extra loading time is equivalent to 1% drop in conversions.

But there was a big tradeoff. Moving to a more modern architecture also meant that the marketing team had to give up on the convenient visual site building interface Squarespace was providing, and thus considerably increasing the marketing team's reliance on developers.

Without any satisfying solutions, Katana postponed the migration of its site, until they heard about WeWeb through word-of-mouth.

Work done & solution

WeWeb appeared as a perfectly fitting solution for Katana’s need: it offers a visual interface such as Squarespace but is open to developers and built using a modern decoupled architecture, enabling the deployment of very high performance web pages.

Katana migrated its site in two stages. First the blog and then the other pages of the sites.

It was important for Katana to have a CMS on top of the visual site builder, to manage pages in bulk and to be able to reuse the content on separated front-ends if needed. Thus, Katana decided to use a Strapi + WeWeb stack for its blog: Strapi for the back, WeWeb for the front - for reference, Strapi is an open-source headless CMS that helps easily build, deploy, and manage content.

Exporting the blog:

The blogs in Squarespace can be exported to WordPress through an XML format. Once the export done, the developers wrote a Strapi plugin to migrate automatically the WordPress content to Strapi CMS. By the way, if you need access to the script, we are open-sourcing it, so feel free to reach out at contact@weweb.io to get access.

Once the data migrated to Strapi, non-developer resources could build the article template pages in WeWeb and, using the Strapi plugin in WeWeb, could generated all the pages automatically: the data is fetched from Strapi and it takes the style given in WeWeb.

The blog migration was completed in a matter of weeks and now the marketing team is using the headless CMS to manage content in autonomy and WeWeb to manage the front-end presentation in autonomy.

Exporting the site pages

In parallel, the team started to migrate the site pages from Squarespace to WeWeb. Squarespace doesn’t have any exporter to migrate the site pages (only for the blog) so the team manually migrated all the pages from Squarespace to WeWeb using an agency from Eastern Europe. The total cost was really affordable and it took about 3 weeks to migrate 80 pages.

Finally, the developers' team built several custom components in vue.js (mostly for the authentication pages) and uploaded them into WeWeb. These custom components were then used in total autonomy by non-developer resources to assemble pages and finalize the site.

As a result, the 200+ pages site was migrated in about 2 months and dramatically improved the site’s performances.

Outcome & results

Time to market:

• 200+ pages site migrated in two months 🚀

Achievements:

• The marketing team builds and edits pages in autonomy using a visual editor 👨‍💻
• Developers can add custom components and connect external back-ends to the site. 🎛
• The website’s performances dramatically improved ⏱