Lead
Hi, I’m Pomarano.
I built and launched a small website called Cloud Gazing (Japanese name: くもながめ).
There is only one thing to do: watch soft clouds drift across the sky. No score, no win condition, nothing you have to do.
My blog tagline is “being not bored is better.” Building a do-nothing experience on purpose might sound contradictory.
But when I open the page and watch the clouds, my head gets a little quieter. That feeling is what I wanted to put into this site.
This post covers why I made it, how it works inside, and how I shipped it.
- Japanese version: 何もしない空を作って公開した
What is Cloud Gazing?
URL: https://cloud-gazing.com/
Tagline: “A sky where soft clouds drift by — nothing to do.”
| Item | Details |
|---|---|
| Interaction | Almost none (cloud speed, time of day, and language are in settings) |
| Clouds | 132 transparent PNGs (plain clouds + shaped clouds) |
| Languages | English / Japanese (default: English) |
| Price | Free (Ko-fi support link in settings) |
Works on phone or desktop — just open a browser. No app install.
Why I made it
The trigger was simple: I wanted a screen you only watch.
- A place between tasks where I don’t have to think about anything
- Not a social feed — just clouds passing by
- Not a game or a tool — a sky that simply exists
In Attachment Isn’t Just a Bad Habit, I wrote about noticing thoughts and stepping back. Cloud Gazing extends that idea: a place to step back from the whole screen.
How the clouds were made — 132 assets
Clouds were created with AI image generation, constrained by spec documents. Two main types:
Shaped clouds (cloud-vague)
Clouds that vaguely suggest animals or vehicles. Silhouette readability is capped at about 40% — at a glance they still look like ordinary clouds.
- Soft peach, apricot, and cream cumulus tones
- No faces, eyes, or similar detail
- Filenames:
cloud-vague-{subject}.png
Plain clouds (cloud-fluffy)
No recognizable object shapes — natural clouds only.
- 30 added; spawn 50/50 with shaped clouds
- Filenames:
cloud-fluffy-*.png
After generation, Python post-processing (transparency, sizing), then registration in manifest.json for the site to load.
132 images total. As I wrote in my harness engineering post, tying quality to spec JSON instead of “make it look nice” reduced variance.
Technical stack
No framework — HTML + CSS + Canvas API only.
| Piece | Choice | Why |
|---|---|---|
| Rendering | Canvas 2D | Cloud layers + sky gradients |
| Cloud loading | manifest.json + lazy load + LRU cache | Don’t load all 132 at once |
| On screen | Max 10 clouds | Balance lightness and emptiness |
| Time of day | Morning / noon / golden hour / dusk / night + auto | Sky color follows real time |
| i18n | i18n.js + localStorage | Remember language choice |
| a11y | prefers-reduced-motion | Respect reduced-motion settings |
Larger clouds move slower for a sense of depth.
Settings: ☁ button top-right; tap outside to close.
Shipping it
Domain and hosting
Production URL: cloud-gazing.com
Static files only — GitHub Pages, Cloudflare Pages, Netlify, or similar all work.
Before launch
- OGP image (1200×630) for social shares
- Favicon (SVG)
site.config.jsonfor the canonical URL →apply-site-config.mjsupdates HTML- Real-device checks on mobile
Cloud assets can total tens to hundreds of MB, so I checked size before deploy. The first visit only loads what the manifest needs, so the experience stays light.
What was awkward
Shapes were too obvious
Early clouds looked too much like animals. → 40% silhouette rule plus 50% plain cloud mix calmed it down.
Loading all 132 at once was heavy
→ manifest + lazy load + LRU cache (max 30 in memory). At most 10 on screen.
English as default?
Balancing global reach with the warmth of the Japanese name くもながめ. → UI defaults to English; Japanese in settings.
What’s next
- Maybe more clouds — depends on bandwidth
- Link from the blog and X so more people find the sky
- This English blog post (you’re reading it)
For now I want to grow it as a site where just watching the sky is enough.
Summary
- Cloud Gazing is a do-nothing web experience — clouds drifting, that’s all
- 132 AI-generated clouds managed by specs, drawn lightly on Canvas
- Shipped with no framework, static hosting
- Behind a “don’t be bored” blog, I also made a site that makes room for boredom
If you like, open it in your browser and watch the clouds for one minute.
コメント