Background
At CLEVER°FRANKE, we have a long history of working with weather data. Since our founding in the same city as the Royal Netherlands Meteorological Institute 17 years ago, we have explored the topic through posters, digital tools, and installations. When we moved into our new studio space, we wanted to mark the occasion with something that could reflect our story and our creative point of view. Read our article to learn more about this experiment.
Pattern flow explorations
Tools and process
We found it essential to work iteratively, combining manual refinement in Figma with programmatic experimentation. This approach let us fine-tune both the details and the overall behavior directly within our tools.
- We began with building the Weather Data Explorer, a browser-based tool built with the Open Meteo API and p5.js. It allowed us to analyze values, extremes, and trends across cities and years, zooming in on specific days or pulling back to observe long-term patterns.
- We used the Grid Explorer, a layout tool to prototype how tiles would behave at real-world window dimensions. This helped us test spacing, rhythm, and layering before finalizing designs.
- By exporting SVGs, we could quickly move into Figma, where the wider team iterated on refinements.
- After refining, we integrated these adjustments back into our system, which went through quite a few iterations, from less to more refined, all them can be found and explored here. This hybrid approach gave us greater control over visual quality while preserving the flexibility of a generative system, allowing us to move efficiently.
- A final version of the Panel Maker, which we used to create the final exports, can also be found in this experiment.
- Finally, with the polished exports, we conducted printing tests and produced the ready-to-print files.
On a fun note
While we originally built these tools to generate and perfect the final patterns, now known as the Weather Windows, we also created two extra tools that, although not part of the initial exploration, add a fun and interactive layer to the project:
- "Explore the data" is like traveling back in time to the early stages of this experiment. By hovering over each tile, people can see how they were created and where the designs originated.
- "Create a wallpaper" is a simple tool for generating desktop-sized wallpapers inspired by the Weather Windows theme. We kept some customizable controls, so people can add their own unique touch. It’s available in both black-on-white and white-on-black versions, and it’s open for everyone to use, so anyone can have a little piece of the tile.