雰囲気と背景 · ページの空気
フィルムグレイン胶片颗粒
- 質感
- フィルム的
- 細かい
細かいノイズが写真の上に乗り、毎フレーム変わります。そのおかげで平面的な画像が「撮影したもの」の質感になります。ほとんど気づかれませんが、外すと画像はきれいに、そして安っぽくなります。
使いどころ
写真や動画が主役の場所に使います。ポートフォリオ、映像のカバー、ファーストビューの大きな画像などです。ページ全体に同じフィルム感を出したいときは、画像ごとではなく一番外側に 1 層だけ足してください。小さなアイコンや単色ボタンには使わないでください。加える質感がなく、縁がざらつくだけです。小さな文字の近くも避けてください。ノイズが読みやすさをはっきり損ないます。
パラメータ
noise 88×60 scaled to frame · overlay · opacity 0.5 · 72ms a frame, discrete frames · fades out 420ms ease-out every 3s
レシピ
フィルムグレイン → 72ms ease-outフィルムグレイン → noise 88×60 scaled to frame · overlay · opacity 0.5 · 72ms a frame, discrete frames · fades out 420ms ease-out every 3s
AI に渡す一文
この画像にフィルムグレインを追加してください。88×60 の小さなキャンバスを重ね、各ピクセルを 128±75 のランダムなグレーで埋め、image-rendering: pixelated で画像全体に拡大します。等倍で塗り切らないでください。遅いうえに細かすぎます。拡大された粗い粒のほうがフィルムらしく見えます。層は overlay で合成し、不透明度は 0.5 にします。ノイズは画面のリフレッシュごとではなく 72ms（約 14fps）ごとに更新してください。そうしないとテレビの砂嵐になります。3 秒ごとに層全体をフェードアウトさせて戻し、粒がある場合とない場合の差が見えるようにします。