Website Overhaul for Modern Design, Easiest Content Management, and Rapid Performance
Goals
BGL aimed to celebrate its 100th anniversary with a modern, intuitive, and easily manageable website that reflected its blend of tradition and innovation.
01
Create a modern, intuitive, and informative website
BGL wanted a website that would be fresh, easy to navigate, and structured in a friendly way. This would let them inform their inhabitants better about the cooperative’s important news.
02
Enable independent website’s editing
The new website needed to empower BGL's content team to make updates independently, reducing reliance on external providers.
03
Refresh the brand’s main communication channel for the 100th anniversary
Through excellent user experience and memorable design, BGL wanted to honor its 100-year-long commitment to serving the community.
Challenge
Creating the website was part of the broader project that aimed at refreshing BGL’s brand and communication. We happily collaborated with two other agencies.
Timothy Ross
Managing Director at ORISONO GmbH
The UI has never received any update until the start of the project.
BGL, a Zurich-based housing cooperative, faced significant challenges with its decade-old website. The previous site was not only outdated in terms of design but also lacked the functionality to support efficient, modern content management and SEO optimization. With the 100th anniversary approaching, BGL needed a comprehensive update to better communicate with the inhabitants.
What we aimed to tackle:
Outdated Design and UI: The website's design had not been updated in over a decade, making it look outdated and less user-friendly.
Inefficient Content Management: The old website required developer intervention for content updates, hindering agility.
SEO and Performance Issues: The lack of SEO optimization and poor performance metrics affected the website’s visibility and user engagement.
Multimedia Content: BGL needed seamless integration of various media and content to ensure a dynamic and engaging user experience.
Project Timeline: Completing the project within the estimated 200 working hours was critical to meeting the anniversary deadline.
Approach
No specific guidelines in terms of design or technology. A perfect base to start from, however, it wasn’t clear from the beginning we’d hit the jackpot with our proposition. But we did!
Timothy Ross
Managing Director at ORISONO GmbH
Naturaily’s work was a prime example of how Jamstack web development should be delivered.
As soon as we received all the necessary assets, such as the content, images, videos, and documentation, we started the development process. We worked on a completely new website, so we could do all the steps by the book.
Our first action was a detailed analysis of BGL's needs, leading to a carefully chosen stack of Jamstack, Storyblok, Next.js, and Vercel to achieve their goals.
Storyblok Headless CMS for Web Building
It would help easier manage the site’s content for non-technical users, with features like real-time visual editor or component-based website structure builder.
Next.js for Site Generating
The React-based framework allows for both Static Site Generation (SSG) and Server-Side Rendering (SSR), enabling the website to load quickly and perform efficiently. This choice was intended to serve different content types simultaneously thanks to this flexibility in data fetching: at a build time, on each request, and using dynamic routes.
Vercel for Deployment and Cloud Hosting
Enables hosting websites and web services that deploy instantly and scale automatically – all without any configuration. There’s no need to rebuild the entire website when using Incremental Static Regeneration. It simply saves time, and guarantees easy updates of the already-built static pages.
Results
The Jamstack approach led us to provide a website that’s as quick as you wish. Eventually, we had our lessons learned too, with a better understanding of the Storyblok CMS.
Timothy Ross
Managing Director at ORISONO GmbH
It was clear Naturaily strived just as much for the best possible result as we did.
All of the goals have been reached
The new website is everything BGL wanted: light and quick to load, at the same time visually stunning and technologically future-proof. It also has all the advantages of being implemented with the Jamstack approach, such as good performance, scalability, great user experience, high security, maintenance, and flexibility.
Among the most important performance metrics (desktop) are:
General Score: 77 (Page Speed Insights)
First Contentful Paint (FCP): 0.6 s
Time to Interactive: 0.9 s
Total Blocking Time: 50 ms
Cumulative Layout Shift: 0.002
Apart from developing the new website, we also prepared a clear and useful guide through Storyblok and conducted a special technical enablement workshop with the team responsible for updating the content.
Outcome
BGL’s new website is lightweight, both visually and in terms of loading times. Perfect for the 100th anniversary!
Before
Burdened with a decade-old website, BGL struggled with cumbersome edits and outdated design that lacked user engagement and modern functionality.
After
The new Jamstack-based website is a game-changer for BGL. It's fast, secure, and easy to manage, empowering the team to update content independently.
Improvements
Our work resulted in:
Improved Content Management
Non-technical staff can now manage and update content easily, increasing efficiency.
Fast & Lightweight
Significant improvements in website speed and performance, leading to a better user experience.
Visually Appealing
The website goes in line with modern users’ requirements and expectations for design and navigation.
Instantly Deployable
Vercel’s infrastructure enables instant deployment and scaling, ensuring the site remains fast and reliable regardless of traffic spikes.
Flexibility and Scalability
The decoupled nature of the Jamstack architecture allows for easy scalability and flexible web maintenance, ensuring that the website can grow and evolve with BGL’s needs.
Some numbers (we all like numbers!)
0
Performance
0
Accessibility
0
Best Practices
0
Search Engine Optimization
Most interesting features
Real-time content management
Storyblok’s Visual Editor
Allows BGL’s team to manage and update content independently without coding skills. Based on the pre-defined components, they can rearrange their website as they want.
Versatility
Next.js Multiple Rendering Methods
The targeted use of Server-Side Rendering and Static Site Generation for different content types improves both performance and SEO: pre-rendering pages at build time and on-demand.
Ultra-quick updates
Vercel’s Incremental Static Regeneration (ISR)
Vercel’s platform supports ISR, which means updates to existing pages can be made without a full site rebuild, saving time and improving efficiency. This was crucial for maintaining an up-to-date and dynamic website.
The team
In this project, we outsourced our Jamstack developer to work hand in hand with the video production company and a creative agency.
Timothy Ross
Managing Director at ORISONO GmbH
I appreciate the clear communication and the great relations we had with the Naturaily’s team. I was especially happy with their work ethic – including their dedication to the project to meet certain deadlines.
These great professionals worked on this project for our client:
Konrad Kuceł
Head of Growth
Tomasz KordyÅ›
Head of Delivery
About the client
Baugenossenschaft Letten (BGL) is a Zurich housing cooperative. It comprises 607 apartments, spread over 6 settlements in the city of Zurich.
Project
Custom Web Development
Industry
Housing
Web
BGLIt was founded on February 16, 1922, as a building cooperative by state, city, and private employees of Zurich and was renamed in 1973. The current name refers to the district of Letten, where the first settlement of the cooperative was built.
The company plays a very important role in bringing the local community together and makes every effort to ensure that each tenant feels at home. The website serves not only as an image function but also provides residents with the most important information about BGL, its mission, the residential development, and the people behind the building cooperative.
I enjoyed working with Naturaily a lot. We will definitely be back for future projects.
Timothy Ross
Managing Director at ORISONO BmbH
Similar challenge? Let's get into it!
We develop solutions, you grow your business. It's that easy!
Here’s how we're making a difference in the web, together
Stories of path-breaking solutions, responsibility, and businesses moving forward
Bronson Labs
Health & Wellness E-Commerce
From Magento to Shopify: a path to 90% increased day-to-day efficiency
Bronson Labs wanted to add content, integrations, and special offers quickly. After migrating to Shopify, all website changes became easy, cutting maintenance costs threefold.
5/5
Clutch review
70%
Less dev time
3x
Lower maintenance costs
Nerdy Banana
Apparel E-Commerce
Automated custom product configurator for Shopify-run multi-store
Nerdy Banana’s manual order processing hindered their efficiency and customer experience. Happily, we helped them increase conversion rates, delivery times, and sales.
3x
Quicker delivery times
95%
Production lead time saved
98%
Faster file preparation time
n8n
Workflow Automation SaaS
Empowering SaaS growth with a scalable, SEO-optimized Nuxt.js website
n8n sought a scalable web solution for automated API-rich content creation in huge page volumes. The rapid website we created boosted their visibility and product usage while saving tons of time.
5/5
Clutch review
300k
API-driven dynamic pages generated
900%
More Top 10 keywords in 1 year
Urban
Wellness SaaS
Transforming web management to allow quicker SaaS growth
We supercharged Urban’s website and gave their marketing team the tools and autonomy they needed. All while significantly improving web performance and SEO capabilities.
96
Performance (Lighthouse)
100%
Web devs’ time saved
Total
Flexibility & scalability
Best IT
Digital Consultancy Agency
Website migration to Jamstack with Next.js and Storyblok Headless CMS
Best IT aimed to showcase their digital expertise through a state-of-the-art website. To do so, we implemented a headless CMS for superior content and website management.
5/5
Clutch review
70
Fully customizable components
0.9 s
Time to Interactive
Lingohub
Translation Management SaaS
Fast & scalable custom Vue.js app for improving translation efficiency
Lingohub needed a modern, scalable foundation for its translation SaaS. We migrated their platform to Vue.js, improving speed, collaboration tools, and securing €600k+ in funding for future growth.
5/5
Clutch review
600k+
Euros of new FFG funding
60%
Time saved on translation
