How furniture brand Pode benefits from a headless approach using Storyblok
27 July 2022
Ever more organisations have been making the shift towards headless when building their new online platforms. At iO we used the combination of the Storyblok CMS and Next.js to create a total brand experience for furniture brand Pode’s new website. In this article, we will tell you why and how.
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.
Read more about how headless CMS can contribute to a seamless user experience .
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.
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'.
Jordy van RaaijTechnology & 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.
- The world is evolving faster than ever. Consumers and stakeholders expect more and more flexibility from companies and organisations. As a result, you need IT solutions that can grow with you.Read more
iO and Damen Shipyards discover “Oceans of possibilities”The experts at iO helped Damen Shipyards with their digital transformation and a strong, consistent brand experience.Read more
Combining clicks and bricks with a headless architectureCase: A seamless user experience thanks to a future-proof headless e-commerce platform.Read more
Take control of your omnichannel customer experience with headless CMSToday, the number of touchpoints and the customer expectations that are associated with them continue to grow unabated. Regardless of the device or the channel, the customer experience should be easy and pleasant, just like in the model omnichannel strategy. The main challenge here is how do you tailor your content across all channels and realise elegant personalisation? This requires flexibility, innovation, and strength – exactly what headless CMS is.Read more
Drupal as a headless CMS: benefits and challengesTraditional CMS systems have been around since the early days of web development. Those platforms were then developed to store and present content - such as text, images, and videos. This approach bundles everything in one big silo: content, HTML, CSS, and so on. This made it impossible to reuse the content in that silo, since it was stuck in specific code snippets. Now that organisations no longer simply post content on web pages, there’s a need for a more flexible solution. Headless is the answer!Read more
Challenging business logic problems? 6 reasons why Azure is the right cloud platformFlexible scalability, the right toolbox for business logic, the availability of specialists, data-driven work and appealing pricing. These are some of the reasons why companies are increasingly turning to public cloud integration platforms to build their business and integration layer – better known as iPaaS (Integration Platform as a Service). Like Microsoft’s Azure Integration Services (AIS), for instance. Technology Director Friso Geerlings zooms in on the power and practicality of Azure, especially for business integration and processes.Read more
Big Green Egg app increases brand engagement and product useTogether with Big Green Egg Europe, we've developed an app for users and fans to interact with the brand and each other while mastering their beloved Big Green Egg BBQ.Read more
A multi-purpose content hubTo increase customer engagement and conversion, iO and MediaMarkt built a neatly integrated multi-purpose content hub.Read more