2026年10月9日(金)掲載 4,893件/本日 0件
HN27556

Webページをレトロに彩る!CSSで動くASCIIアートの作り方

Animated ASCII Art for Web Pages

turrini・1日前

議論

11件
0:turriniスレ主▲2751日前

Webサイトに少し遊び心が欲しいですか?実は、CSSと少々の工夫でASCIIアートをアニメーションさせることができます。シンプルかつインパクト抜群の演出をあなたのプロジェクトに取り入れてみましょう!

1:kirth_gersen1日前

美しいね。ただ、ピースがアニメーションしているようには見えないんだけど。何か見落としてるかな?

2:robbomacrae1日前

最高だね。自分も似たようなこと(もっと小規模だけど)をClaude Code/Piのためにやったよ。どれくらい動いてるか視覚化するやつ https://github.com/robdmac/flow (https://github.com/robdmac/flow) でも、このASCIIアートを見てたら、昔SSHでサーバーに入るたびに、今どこにいるのか頭の中で地図を描くための何かが欲しいと思ってたことを思い出したよ。今はもうSSHでサーバーに入ったりはしないけど、もし今やってたら、間違いなくターミナルでこのシーンを再現しようとしてたはず!

3:bredren1日前

いい感じ。自分のオンライン活動の最初期の貢献といえば、ローカルのダイヤルアップBBSだったな。掲示板のテーマに合わせて、丸一日かけてアニメーションするASCIIシーケンスを作ったりしたものだよ。

4:boguscoder1日前

見た目はすごくいいけど、これASCIIアートじゃないよね?ASCIIはどこにあるの?大きさがバラバラの点ばかりで、これってASCII文字じゃないよね。もしかしてユニコードアートなのかな?

5:gavmor1日前

豪華で、印象的で、よくできてるよ。でも、技術的な「簡素さ」を装っている感じが拭えないな。つまり、制限の多いメディアの信頼性を借りているのに、その制約自体は受け入れていないというか。繰り返すけど、すごく綺麗だよ。でも…テスラを改造してシトロエン2CVっぽく見せてるような感じかな。

6:BugsJustFindMe1日前

システム側で「視差効果を減らす」設定にしてるから、アニメーションが何も動いてない。配慮としては素晴らしいんだけど、デモページでその旨をもっと分かりやすく表示してほしかったな。あと、アートシーンのセクションはASCIIじゃないよ。

7:thih91日前

「シーン」は、ディザリングの回りくどい試みみたいに見える。期待してたものとは違うな。他の部分もかなりマキシマリストで装飾的だね。アニメーションとしては好きだけど、UIやTUIの一部としてはちょっと遠慮したい。

8:burmask1日前

スクロールしていくうちに、投稿者がこのライブラリを作るのをどれだけ楽しんでいたかが伝わってきて、どんどん感心させられたよ。スプリットフラップ(https://ascii.rest/split-flap/ )は最高だね。あと自然をテーマにしたやつ(https://ascii.rest/fern/ )を見て、これらを表示するデジタルフレームが欲しくなったよ。壁掛けアートとしてすごくクールだと思う。このASCIIはリラックスしたムードを作ってくれるね。あの震えるスピナーのページ以外はね @ZeWaka :)。投稿者さん、貢献してくれてありがとう!

10:cousin_it1日前

これかっこいいね!固定グリッドを使わずに同じ感覚を再現できるのか気になるところ。点描画とかハーフトーンレンダリングみたいな感じで、点を自由に配置できたらどうなるんだろう。