ハクソク

世界を動かす技術を、日本語で。

ASCIIクラウド

93日前原文(caidan.dev)

概要

このテキストは、Retro CRTスタイルのTerminalエミュレーターのプリセット設定を説明。
各項目は、画面効果やノイズ、色調整、グリフ閾値などの詳細なパラメータを含む。
設定は、視覚効果や操作性をカスタマイズするためのもの。
パラメータ値の調整により、独自のCRT体験を作成可能。
主なコントロール項目を箇条書きで整理。

Retro CRT Terminal プリセット設定

  • Fullscreen：フルスクリーン表示切り替え
  • Presets：デフォルト、Terminal、Retro CRT、Cosmic Fog、Red などのプリセット選択
  • 操作
    • Save：設定の保存
    • Copy：設定値のコピー
    • Paste：設定値の貼り付け
  • ノイズ調整
    • Noise Intensity：ノイズ強度（例：0.125）
  • セルサイズ
    • Cell Size：セルの大きさ（例：18）
  • 波形効果
    • Wave Amplitude：波形の振幅（例：0.50）
    • Wave Speed：波形の速度（例：1.00）
  • タイムコントロール
    • Time Speed：時間進行速度（例：1.5）
    • Seed：ノイズ生成用シード値
  • ビネット効果
    • Vignette Intensity：ビネット（周辺減光）強度（例：0.50）
    • Radius：ビネット半径（例：0.50）
  • 色調整
    • Color Hue：色相（例：180）
    • Saturation：彩度（例：0.50）
    • Brightness：明度（例：0.00）
    • Contrast：コントラスト（例：1.25）
  • グリフ閾値設定
    • Glyph Thresholds：各記号への変換閾値設定
      • dot（.）：0.25
      • dash（-）：0.30
      • plus（+）：0.40
      • O ring（O）：0.50
      • X cross（X）：0.65

設定活用のポイント

  • Retro CRTの雰囲気を強調するには、Noise IntensityやVignette Intensityの調整が効果的
  • 色調整で独自のテーマカラーを作成可能
  • Glyph Thresholdsで文字表現を細かくカスタマイズ
  • プリセットを活用し、用途や好みに応じた即時切り替えが可能
  • 設定値の保存・コピー・貼り付けで他環境への展開や共有も容易

Hackerたちの意見

もしかしたらもっと色々あるかもしれないけど、テキストポストプロセッシングシェーダーを作って、3Dシーンや動画に適用するのは割と簡単だよね。 https://post-processing.tresjs.org/guide/pmndrs/ascii https://forum.babylonjs.com/t/ascii-shader-using-glsl-postpr... https://threejs.org/examples/?q=ascii#webgl_effects_ascii https://fwdapps.net/l/asci/ https://codesandbox.io/p/sandbox/ascii-postprocessing-n628p8... https://www.youtube.com/watch?v=NxeRcnLr0ko
ずいぶん前に書いたCプログラムで似たような効果を出したことがあるよ（確か2007年かな？）。動画はこちら: https://www.youtube.com/watch?v=H4j-BkwMB20 で、コードはこれ: https://github.com/kristopolous/ascsee 最近、現代のシステムでコンパイルできるように更新したんだ。考古学者気分になりたいなら、元のバージョンも見つけたよ: https://9ol.es/tmp/gol.c
これいいね…でも、各シンボルに違う色や明るさがあると、結局シンボルが異なる強度にしか対応してないから、ASCIIの意味が薄れる気がする。
└
そうだね、こんなに色があったら、1文字だけで十分だよね。
単一の文字だけをレンダリングすることもできるよ。まず、HTMLの「Glyph Thresholds」の「max」属性を1.1に変更する必要がある。で、希望する文字とその上の文字には0.0を設定して、残りの文字には1.1を設定する。例えば、ダッシュだけが欲しいなら、ドットとダッシュを0.0にして、プラス、リング、クロスの文字には1.1を設定すればいい。
名前からして、もっと実際のASCII文字やオプション、選択可能なテキストがあると思ってたけど、見た目は魅力的で遊ぶのも楽しいね。
「衛星ビューの雲」をモデル化するには良い方法に見えるけど、「地上ビューの雲」をモデル化するにはあまりうまくいかないと思う。そういうのをやるための良い（速い）アルゴリズムを探してるんだけど、誰かアドバイスがあればありがたいな。
すごく好きなんだけど、一部のセルが揺れたり、2つのシンボルの間で急に切り替わったりするのが気になるな。もう少しスムーズにできる方法があればいいんだけど。
いいね。でも、もし本当にASCIIのことなら、テキストエディタに雲の空をコピー＆ペーストできるようにしてほしいな ;-P
いい感じ！これ、私が実装したやつに似てるね: https://www.npmjs.com/package/asciiground。私はもっとライブラリとして、ユーザーが既存のシステムを拡張して自分のパターンをプログラムできるようにしたかったんだけど。残念ながら、私のGitHubアカウントがフラグされちゃって、今はリポジトリやデモ用のGitHubページにアクセスできないんだ。
└
初めて見たけど、なんでGitHubアカウントがフラグされるの？
すごく美しいね。根底にあるアルゴリズムはパーリンノイズ（詳しくは https://ja.wikipedia.org/wiki/パーリンノイズ を見てね）で、もう40年以上前のものなんだ！生成された画像は、ガラスや氷の変形、安っぽい水のようなエフェクトに使える素晴らしいツールなんだよ。それに、地形を生成したり、ランダムなパターンを活かしたクールなビジュアルエフェクトを作ることもできる。私にとってのコアな特性は、すごくオーガニックで自然な感じがすること。昔のFlash AS3では、驚くようなエフェクトやゲームを作るために、これがすごく一般的なツールだったんだ。今はそんなビジュアル系のものを作ることはあまりないけど、今でもこの分野では普通に使われてるんじゃないかな？だって、そうする理由があるしね！