A shared platform for a sustainable future in the creative industries
We combined our expertise in strategic service design and ecological technology to create a digital platform for the Uusimaa Regional Council's Luoto project, which accelerates the sustainability transition of the creative industries. We built an easy-to-use and inspiring knowledge hub that serves, connects, and supports the entire industry.
The Uusimaa Regional Council is the strategic planner and developer for a region with 1.8 million inhabitants. Its focus is on the region’s internationality, appeal, and the well-being of its residents. As a forward-looking organization, the Council actively tackles current challenges.
One of these challenges is promoting the ecological sustainability transition of the creative industries. Through the Action Programme for the Ecological Sustainability Transition of the Creative Industries (Luoto) project, funded by the European Union’s NextGenerationEU initiative, the Uusimaa Regional Council set out to advance this vital change.
At the heart of the project was the need to create a digital hub that would bring together sustainability knowledge and initiatives in the creative industries.
Before the project, information regarding the ecological sustainability of the creative industries—such as research, guides, projects, and calculators – was scattered across the channels of various actors and sectors. This made it difficult to find and utilize the information, thereby slowing down the industry’s collective environmental efforts.
The Luoto project recognized the need for a centralized, user-friendly online service that would accelerate the industry’s sustainability transition and help actors effortlessly find the support and information they needed.
Jaana Eskola, who is responsible for the project, states that sustainability was an important criterion in the partner selection process.
“The supplier’s adherence to sustainable principles was a significant added value for us. We wanted to create something functionally new and be at the forefront of development. We noticed that Hion has a strong sustainability mindset integrated into its own operations, which perfectly aligned with our values.”
Clarity through service design
We began tackling the client’s challenge – a large volume of content, a diverse user base, and limited resources – through a series of workshops. The goal was to create a centralized knowledge hub from which every user could effortlessly find up-to-date information.
“The service design phase included three rewarding live workshops held with Hion’s experts. The workshops were also a great opportunity to get to know each other as a team,” Jaana summarizes.
In the workshops, we delved deeply into the users’ needs:
- We defined and clustered the key user personas and their use cases.
- We designed clear user journeys and, based on them, a logical content hierarchy.
- We specified the necessary content types and processes related to dividing responsibilities.
This strategic groundwork not only created a solid foundation for the technical implementation but also helped our client to structure and understand their own target groups even better.
“After that, the project proceeded in development sprints according to Hion’s operating model. This way of working functioned extremely well: things always progressed as agreed, and results were achieved according to plan,” Jaana recounts.
A smooth process to the finish line
According to Jaana, the final result has met the goals. “We are especially proud of how we managed to distill a vast amount of information into an easy-to-use and intuitive format. Our goal was to create an interesting, clear, and up-to-date online platform that would be simple enough but wouldn’t immediately become obsolete. We feel the site’s structure works excellently and supports this objective.”
The feedback and reception from stakeholders have also been positive.
“It has been a pleasure to note how many have proactively highlighted the platform in their own communications. The platform is a true resource bank whose materials can be revisited repeatedly. The service’s visual appearance, in particular, has been praised with words like inspiring, fresh, and playful.”
And how would Jaana describe the collaboration with us?
“Hion’s clear development model was a huge help for both our team and me personally, especially concerning the work input required from the client. Things were made really easy and clear for us. We didn’t have to spend extra hours trying to familiarize ourselves with things, as they were covered in our weekly meetings, and we always received very fast help via Slack when needed.”
"Overall, the processes were extremely smooth, and the cooperation left a pleasant, positive, and professional impression. The project was designed to make it easy to participate in the client's role, even if one isn't a professional in web platform development themselves."
–Jaana Eskola, Project Manager, Uusimaa Regional Council
Ecology and efficiency with Hion's GSW UI Kit
Since the project’s theme was closely linked to sustainability, it was essential that the digital service itself also adhered to sustainable development principles. In both design and implementation, we utilized Hion’s own Green, Sustainable Web (GSW) UI Kit.
The use of the GSW UI Kit brought clear advantages to the project:
- Cost-effectiveness: It significantly accelerated the design and development work, directly saving resources.
- Environmental responsibility: We ensured that the technical and visual solutions were energy-efficient by design.
- Flexibility: The kit created a system built on a modern and solid foundation, making it easy and efficient to develop further.
User's choice: Eco- and Dark-modes
We brought the visual identity created by the client’s graphic designer to life and translated ecological principles into concrete, user-controllable functions.
- Eco-mode: Users can actively reduce the site’s bandwidth usage and carbon footprint by selecting the more ecological mode. This mode loads pages using lighter system fonts and processes images to consume less bandwidth.
- Dark-mode: To ensure a modern user experience, the site offers the ability to choose between the traditional light and dark modes, as well as the option to automatically follow the device’s system settings.
Technical architecture
1. Structured and scalable content management
We created a flexible and logical way for the client to manage content, which streamlines daily work and allows for easy expansion of the service in the future.
- Customized Content Types and Taxonomies: We implemented three precisely defined content types (FAQ, Links, Site Settings) along with a custom taxonomy (Category). This allows for efficient content organization and the creation of dynamic content lifts across the site without complex manual updates.
2. Uncompromising performance
Performance and green values were at the core of the project. We implemented several measures to ensure a fast user experience and reduce the site’s carbon footprint.
- Modern Image Formats: The site automatically utilizes the lightweight and efficient WebP image format, which significantly speeds up page loading.
- Analytics and Third-Party Optimization: Through code-level optimization, we ensured that tools like CookieBot and analytics software do not slow down the site’s operation.
- A customized Cookiebot Accessible Template was used with CookieBot, which is both more accessible than CookieBot’s standard styles and yields 5–8 points better scores in Google Core Web Vitals.
98
Homepage Page Speed Insights Performance Score
126,5 CO2mg
Emissions caused by the homepage in the client's browser (including language versions, according to CO2.js)
A+
Homepage rating (Website carbon)
Full website data: Across the entire site, which comprises 172 pages, the Page Speed Insights Performance Score has a median of 89. Furthermore, the median CO2 mg (according to CO2.js) is 116.1, and the median page size is a lean 0.41 MB.
Website Carbon gives the site the best possible rating of A+.
3. Modern and flexible content creation with native WordPress blocks
We built all custom functionalities using native WordPress tools. This ensures the best possible user experience for content creators, as well as the site’s stability and security.
- Custom plugins and blocks:
- Carousel and Listing Blocks: We developed dynamic blocks (carousel, FAQ listing, rolling page listing) that allow the content creator to highlight and filter content versatilely across the site—without writing a single line of code.
- Hero Block: We implemented a striking and manageable Hero block to provide visual prominence on the most important pages.
- Accessibility: The entire site has been implemented in accordance with WCAG accessibility standards, ensuring the service is accessible to all users.
4. A strong and modern technical foundation
We utilized modern technologies that adhere to industry best practices, ensuring the site’s maintainability and future development potential.
- Custom Theme: The site’s theme is based on the modern Roots Sage framework.
- Tailwind CSS: The look and feel is built with the Tailwind CSS framework, which enables fast, consistent, and easily maintainable user interface development.
- Laravel Blade: We use the Blade templating engine (language), which makes the code clearer and more modular.