An online tool for innovators, designed to break creative blocks

Freelance project

An interactive online version of the Oblique Manoeuvres card game that supports the research project by Dr Ola Michalec.

View website

Services

  • Cloudflare Pages
  • Low-carbon website
  • Static website
  • Sustainable web development
  • Web design
Oblique Manoeuvres website homepage

Top level stats

0.02g

The average carbon per initial page view, thanks to the low-carbon static website

< 75 KB

A tiny page weight for high performance. With clever use of light weight data storage

100%

Hosted with renewable energy on Cloudflare Pages and the globally distributed CDN

Designed and built to support a research project by Dr Ola Michalec, this website includes an online version of the Oblique Manoeuvres card game, a tool for innovators designed to break creative blocks and encourage lateral thinking.

It was inspired by a similar card game called “Oblique strategies” designed by Brian Eno and Peter Schmidt, with Ola’s edition adapting the original intent to the world of Research & Development.

A lightweight, interactive website with a small energy footprint

From the inception of the project, Ola wanted to replicate the physical card game, whilst keeping the energy footprint of the website as low as possible.

How I achieved a low-impact website design and build

To make this possible, I decided the website should be static. This meant using plain HTML, CSS and limited JavaScript. No dynamic CMS included. Cloudflare Pages was chosen to host the website for a number of reasons. Firstly because it includes their renewably powered and globally distributed CDN for free. Secondly they offer high levels of caching, and as a bonus, AI bot blocking. All of which helps to improve the energy and carbon impact of the website.

Screenshot of the online card game for Oblique Manoeuvres

Creating the interactive card game

One challenge of creating light weight websites is handling data, for instance a growing list of cards in a game. For this website, instead of using a CMS tool like WordPress, I decided to utilise something really lightweight. JSON.

JSON provides a simple, compressible data store that can easily be queried with JavaScript, in effect creating a miniature database. Randomly selecting a card from the database on user interaction replicates the way the card game would play in the physical world.