Postura da Paura and Gotham Studio - The right technology for the right client

• Headquarters: Milano, Italy
• Technology Stack: Storyblok, Nuxt.js

Explore the fascinating evolution of Postura da Paura, a fitness initiative by Sara Compagni, as it transcends the limitations of its original Wordpress platform with the expertise of the Italian digital agency, Gotham Studio. In their pursuit of customization and enhanced user experiences, the agency embarked on a four-phase project that led them to the doors of Storyblok.

Section titled Challenges faced with a WordPress setup Challenges faced with a WordPress setup

As Postura da Paura aimed to provide a high level of customization, accommodate user growth, and enhance the user experience, they found that Wordpress fell short in meeting their project's demands.

• Scalability: The growing user base and increased subscriptions during the Covid-19 lockdown exposed the scalability limitations of the Wordpress platform. Additionally, the capability to offer customized experiences called for a CMS capable of implementing complex features.
• Performance and loading management: As the demands increased, performance issues and loading management became evident, impacting user experience.
• User experience: Both existing and new users struggled to navigate through the contents easily due to limitations in front-end usability.
• Content management: The need to manage content during development and production stages presented difficulties with the existing CMS.
• Development restrictions: The restrictions imposed by PHP and the existing technology stack hindered the agency's pursuit of improved hardware resource performance. Also, missing features, like API-first approach, stories versioning, and custom workflows, hampered the efficiency of development and content management.
• Image management: Inefficient image service capabilities made handling images for different devices and resolutions a cumbersome process.

Section titled Solving the issues with Storyblok and a powerful tech stack Solving the issues with Storyblok and a powerful tech stack

Gotham Studio harnessed the power of Storyblok to overcome their challenges with Wordpress. This provided them with a versatile and high-performance platform that enabled seamless customization, enhanced front-end usability, improved scalability, and efficient content management.

• High Customization: Storyblok's flexible structure and component-based approach allowed for seamless customization of workout courses and subscriptions.
• Improved UX (User Experience): Storyblok's intuitive visual editing capabilities enabled easy exploration of content for both new and existing users.
• Scalability and Performance: Storyblok's robust architecture ensured smooth scalability and efficient loading management even during peak user demands. More than that, Storyblok's versatile API-first approach facilitated the implementation of intricate features.
• Improved Workflow: Storyblok's stories versioning and custom workflows streamlined development, content creation, and management processes.
• Performance Boost: The Vue/Nuxt integration enhanced performance and hardware resource efficiency, providing a better experience for users and developers.
• Effortless Image Handling: Storyblok's image service simplified image management for various devices and resolutions, improving overall website performance.

Section titled The project timeline, from analysis to launch, and beyond The project timeline, from analysis to launch, and beyond

The way Gotham Studio approached the development of this project was splitting it into four phases.

Section titled Phase one - Analysis Phase one - Analysis

In the first phase the agency planned the structure of features and functionalities of the new website by analyzing the old one. For a month, positive and negative aspects of the original version were taken into account, both the back-end and front-end were examined, and a list of specific details and flaws was comprised: the user management system, the programs management system, the notification system, the user experience in buying and using processes etc.
Based on this analysis, the agency established the key features, mapping all the ”bricks” that build up Postura da Paura: user management, program management, order management, statistics, notification management and file manager.

Section titled Phase two - Development Phase two - Development

The development phase lasted 4-5 months. For their main framework they chose Nuxt, as they consider it one of the most cutting-edge and versatile tools for the development of web applications. During this phase, 3 developers translated the mind maps into code using a REST API interface for back-end logics, a specific web application for the front-end and another web application for administrative management and control functions. Thanks to its modular structure, Storyblok has been a useful “container” of all the information and content for internal and external usage. This has saved them from developing another REST API resource.

Section titled Phase three - Launch and user migration Phase three - Launch and user migration

In the third phase they released the new website, but this also meant the migration of the 10.000 users of the old website. At this junction, Gotham Studio had to determine whether they would use a fully automated or a semi-automated migration process. Taking into account that only half of the users were still active, the agency decided to introduce the change to the new website gradually, and let users check their personal information and transfer their account through a simple, three-step procedure. By opting for this solution, they diminished the user load of the release. During the first month after the release, all active users migrated to the new website.

Section titled Phase four - Extending functionalities Phase four - Extending functionalities

The last phase was further extending the website's functionalities, post-release.Thanks to its structure, They were able to implement more modules that let them introduce new features such as gift cards, promo codes, a review system, statistics, events with subscriptions, live events etc.
With Storyblok as a CMS they were able to manage the visibility of contents. Some had to be hidden in production but visible in development; through the use of “draft” and “unpublished” status, the agency managed to keep this distinction.
To date, Gotham Studio has released more than 10 sets of modules and implementations for Postura da Paura.

Section titled Journey to Storyblok Journey to Storyblok

As an agency who invests time and effort in finding the right technology stack for their clients, Gotham Studio's path was bound to cross with Storyblok, sooner or later.
Specifically, in 2019 they were looking to deeply improve the development and hardware resource performance of their web projects. The development team found that PHP was more and more restrictive and in their research came across Vue/Nuxt, which in turn made it easy to also change their CMS of choice. After further research, they found Storyblok to be the most high-performance, usable and easy-to-admin one.

As their CMS of choice and given the level of complexity of Postura da Paura, Storyblok was the best solution in terms of structure of components, performance and reliability of service.

Aside from this project, the agency also is appreciative of other features of Storyblok: API-first approach, stories versioning, custom workflows (specific assignation), flexibility of components, and the image service.
All these features saved them a lot of hours of development, simplified their procedure and supplied them with ready-to-use, easy-to-implement tools.