How furniture brand Pode benefits from a headless approach using Storyblok and Next.js

A brand experience equivalent to the physical showroom

Part of the Dutch design furniture brand Leolux Furniture Group, the furniture brand Pode was set up in 2008. For Pode, design is more than designing the furniture alone. By offering complete series of complementary furniture and accessories, Pode provides harmony throughout the home.

For the new website, the main objective was to clearly communicate this brand feeling. It was therefore of great importance to Pode to make the transition from a functional website to an experience-oriented digital platform that inspires the visitor. We wanted to realise this without compromising on functions or performance.

As a design furniture brand, it is essential that the brand experience and the ‘feeling’ are received as authentic by the website visitor. Our objective as a consultancy was clear: from the very first contact moment, the brand must inspire, and the visitor must enjoy a brand experience that is equivalent to being in a physical showroom.

What did Pode's ambitions mean for our choices in technology?

1. An headless approach for unlimited creativity
Regarding technology, we needed total freedom in order to realise our vision of the digital brand experience for Pode.eu. Traditional CMSs are too restrictive in what is possible in the front end. This is because of the way the front end is directly connected to the back end, thus defining and constraining a large part of the format and designs.

With a headless CMS, this is not the case. Thanks to the architecture of a headless CMS, you manage all your content in one separate system, and then you load this to the various front ends by means of APIs. This means you retain more creative freedom and flexibility, because the front end is now no longer restricted by the standard solutions that apply to a traditional CMS and that’s exactly what we needed for this project.

2. A modern framework for an ambitious UI
We also knew that, for the realisation of the digital brand experience, we wanted to employ a modern front end framework that offers the opportunity to create ambitious User Interfaces. For example, React, developed by Facebook, is a modern way to make everything more dynamic, interactive and intuitive. Frameworks like this one are no longer connected directly to the CMS. Thanks to this, it also works well for an online portal or smartwatch app.

3. Flexible CMS for solid backend functionality
Because the front end for this project is so ambitious, it was important that we chose a solid back end option that is simple to set up. There are many traditional CMSs that demand time-consuming server set up, installation and CMS configuration processes. Fortunately, there are now also many SaaS (Software as a Service) CMSs with quicker back end set-up time, thanks to use of plug-and-play. This meant that we could invest the great majority of our time in the front end and thus perfect the brand experience for the user.

“By opting for a SaaS CMS, we could spend most of our time on the front-end and perfecting the Pode brand experience.”

The right tools for the job

With these three pillars in mind, we started looking for the right tools. From our previous experience with this kind of project, we already knew what would be good options. We often combine our knowledge with our enthusiasm for new technologies, so we can be re-inspired and can keep creating innovative digital products. This is why we opted for the following solutions:

Storyblok: headless and SaaS

We opted for a headless CMS for Pode because we wanted to use the limitless creativity this solution provides. In Pode’s case, it was also important that we could display data from multiple sources, such as the furnishings materials and colours of the. With a headless CMS, this is easy to realise.

We regarded Storyblok as an excellent choice for constructing Pode.eu. This headless SaaS CMS is easy to implement and offers a lot of flexibility for integrations and APIs. Storyblok also provides plenty of space for customisations and bespoke work. Many headless options offer a more rigid and closed system, so you can only make limited modifications. For us, it was essential that there be no restrictions.

Storyblok offers a number of advantages for content editors too because they cansee modifications in the CMS in the front end in real time. A live preview of the website is available when you open the page, as well as in the editing toolThis keeps the focus on the user experience the visitor, and makes it easy to spot mistakes in the format.

Next.js: unrestricted creativity with top performance

The front end framework React, mentioned earlier, is in essence a UI library with which you can build attractive and modern UIs. Unfortunately, this is where React’s possibilities run out. A website built on React has to download, construct and generate the codebase every time the site is opened. This has a negative impact on the performance and SEO. This was not an option for us because we did not want to compromise on the performance or function of the website.

Luckily, there is Next.js. Next.js is a complete and mature framework, that’s based on React, with which you can build real production level solutions. Next.js is in fact a shell around React which is essential for the development of a fast loading website and good SEO findability. Additionally, Next.js provides functions such as routing, image optimisation and internationalisation and the possibility for the easy addition of plug-ins to the ecosystem, for micro-animations and page transitions for example.

This was exactly what we needed in order to realise an unequalled brand experience for Pode, with all the functions needed, the top performance of a quick website, and excellent SEO findability.

Conclusion

Thanks to the combination of one of the best headless CMSs, Storyblok and one of the best front ends in Next.js, we were able to create exactly what our client, Pode had in mind.

An additional plus point is that Storyblok and Next.js have high levels of compatibility. With Storyblok’s headless structure, we could put all of our efforts into the front end without restrictions. The focus on the front end was reinforced by Storyblok’s SaaS properties. The rapid set up of the CMS allowed us to employ the majority of our resources to make the very best brand experience at the front end. With Next.js, we positioned the redesigned Pode.eu entirely in the context of perception and inspiration.

Do you want to know more about Storyblok? Then download the white paper 'Efficiently managing and publishing content with Storyblok'.

About the author

Jordy van Raaij

Technology & Innovation Strategist - iO

Jordy’s own passion for technology led him to spend his days connecting the dots of technology, business, market trends & competitive insights. He especially loves overseeing the creation of new, innovative business models and technology roadmaps – as well as getting clients on board the future-proof train.