About the project
The new HWZ website is designed to be much more than a classic CMS page, it is evolving into a digital platform in the “HWZ spirit”, intelligently connecting degree programmes, continuing education, events and content, and positioning HWZ as a technological pioneer in the higher education sector.
Together with HWZ, we chose DatoCMS as the foundation. The key reason was that the content editor can be structured in a much more modular way than in many traditional CMS solutions, allowing content to be created very flexibly using content blocks.
The frontend was completely redesigned and implemented with SvelteKit. In parallel, we carried out a brand refresh for HWZ. The focus was not only on modernisation, but also on improving readability and creating a seamless user experience across all touchpoints.
UX/UI Design
As part of the comprehensive website relaunch, we completely reimagined the user experience of fh-hwz.ch and elevated the brand to the next digital level. We deliberately revised the information architecture and optimised the navigation so that users can reach relevant content much faster. Within the education offering, we created clear parent child structures and enabled a comprehensible, logically built user journey. At the same time, we separated the areas of degree programmes and continuing education more clearly, which improves orientation and highlights the breadth of the offering.
We also implemented a modern brand refresh and carefully but noticeably evolved the logo. On this basis, we built a scalable design system that works across all digital touchpoints, from the website and social media ads to a template pool for presentations. The result is a consistent, contemporary brand presence that strengthens HWZ’s identity and ensures a professional, unified user experience.
Backend DatoCMS
For managing the content of fh-hwz.ch we use DatoCMS. We developed a modular structure that allows the editorial team to maintain content efficiently while retaining maximum freedom in how it is presented. By using relations, content can be linked intelligently. For example, crosslinks to programmes, news entries and pages can be inserted directly within texts and will continue to work even if their URLs change. Before entries, files or images are deleted, editors are warned if they are still in use elsewhere.
We also set up a preview environment that allows editors to view unpublished entries directly on the website and fine tune them before publication. This significantly simplifies editorial workflows. As a SaaS solution, DatoCMS offers additional benefits such as automatic updates, high stability and a reliable ecosystem. We particularly value the excellent support from DatoCMS, which assisted us quickly and competently throughout the implementation.
In addition, we integrated automated translation processes, using either DeepL or ChatGPT, to efficiently generate and update multilingual content. The flexibility of the editor makes it possible to extend existing blocks individually and easily add new content modules.
We have made full use of DatoCMS’s publishing model. Content can be scheduled for publication, parts of a record can be published separately and already published content can be edited further without risk and then republished. Thanks to the clearly structured data model, we were also able to import data from the previous website, including complex rich text content, without any issues.
The result is a CMS that is powerful, editor friendly and built for long term extension, forming the backbone of HWZ’s efficient digital operations.
Website frontend
For the frontend of fh-hwz.ch we implemented a modern, high performance solution based on SvelteKit. SvelteKit allows us to extend content elements easily and to build a flexible, future proof architecture that offers both editorial freedom and technical stability. A fluid typography system ensures that content scales cleanly on all viewports and creates a consistent visual experience.
To keep performance optimal, we implemented global caching so that the same data is retrieved only once for all visitors and the backend is relieved of unnecessary load. In addition, we optimise image sizes so that they are delivered in the best possible format for each device. This is a key factor for fast loading times and strong page performance.
The SvelteKit implementation is simple and robust. The framework offers an excellent developer experience without the limitations of many other ecosystems. As a “batteries included” framework, SvelteKit provides many functions out of the box, which makes development consistent and efficient while still allowing maximum flexibility.
The result is a high performance, low maintenance and future oriented frontend that meets the modern requirements of an education platform.
