懐中電灯エフェクト：暗いページを懐中電灯で探索する
懐中電灯エフェクトは、Webページの明かりを消し、訪問者に懐中電灯を手渡します。懐中電灯は一人称視点のゲームのように画面の隅の低い位置に構えられ、ポインターの行く先へ正確なパースで向きを変えて、縁のやわらかなスポットとそのまわりのほのかな周辺光を照らします。レンズから空中に光線が伸び、光の中をほこりが漂い、光の外のページは暗く沈んでピントが外れます。下にあるページは一切変わらず、リンクやボタンは暗闇の中でもそのまま動作します。
使い方
見た目を選ぶ
「夜の散歩」「暖かなトーチ」「ステージスポットライト」などの見た目から始め、プレビューの上でポインターを動かして、ページのあちこちを照らします。
光を整える
手と懐中電灯（削り出しアルミ、クラシックブラック、フラットな 2D）、スポットのサイズと縁、光線、もや、ほこり、そしてページの残りをどれだけ暗くぼかすかを選びます。「描画方式」では「WebGL（軽量）」か「Three.js（本物の 3D モデル）」を選べます。
使うか、エクスポートする
無料の UX Pilot アカウントでログインすると、UX Pilot キャンバスに配置したり、HTML または PNG でエクスポートしたりできます。
作れるもの
明かりを消したヒーロー
ローンチページやティザーを暗闇で始め、訪問者に懐中電灯で見出しを見つけてもらいます。
イースターエッグと隠し要素
光が当たったところにだけ現れるコード、割引、メッセージを隠せます。
ゲーム、ミステリー、ハロウィン
訪問者と一緒に動く光で、ゲーム、脱出ゲーム、ポッドキャスト、ハロウィンのキャンペーンの雰囲気を演出します。
1 つのものにスポットライトを
手のない「ステージスポットライト」を使えば、1 つの機能、商品、ポートレートを光の輪の中に浮かび上がらせられます。
よくある質問
懐中電灯エフェクトとは何ですか？
Webサイトにおける懐中電灯エフェクトとは、ページを暗くしてポインターのまわりの円だけを照らし、訪問者がトーチを手に探索しているように見せる演出です。懐中電灯エフェクトでは、光の方へ向きを変える手持ちの懐中電灯、空中を伸びる光線、漂うほこり、光の外のぼかしが加わります。
懐中電灯でページが変更されることはありますか？
いいえ。暗闇、光線、手はページの上に重ねて描かれ、下のページはそのままです。テキストは選択でき、リンクやボタンも動作します。視差効果を減らす設定がオンのときは、ページは光がついた暗い状態で開き、勝手に動くものはありません。
WebGL と Three.js の違いは何ですか？
どちらも同じ光、ほこり、暗闇を描きます。WebGL は軽量で、懐中電灯をシェーダーで描きます。Three.js は懐中電灯を本物の 3D モデルとして描き、フィン、ローレット加工のグリップ、ポケットクリップが光をとらえますが、読み込みに時間がかかります。「描画方式」でどちらかを選べます。
コードなしで懐中電灯エフェクトを作れますか？
はい。ブラウザで調整し、無料の UX Pilot アカウントでログインすると、UX Pilot キャンバスに配置したり、HTML または PNG でエクスポートしたりできます。