M.
Webツール Web / PWA

デジタル照度計 LX-26(Web Lux Meter)

スマホのカメラで部屋や屋外の明るさ(ルクス)を推定する、ハンディ照度計風のWebアプリ。場所や時間帯ごとに「ちょうどいい明るさか」を判定。PWA対応。

デジタル照度計 LX-26

スマートフォンのカメラで部屋や屋外の明るさ(照度・ルクス)を推定する、ハンディ照度計風のWebアプリ。アプリのインストールは不要で、URLを開いてカメラを許可すれば、その場で明るさを測れる。リビング・寝室・屋外などの場所の目安や、寝る前・朝・作業中などの時間帯・用途ごとに、今の明るさがちょうどいいかを判定する。

主な機能

  • 照度計風の表示: 7セグメント液晶風の照度表示(lx / fc 切替)と対数バーグラフ。LCDバックライトや前/後カメラの切り替えもキーで操作する。
  • 色温度の推定: ホワイトバランスを固定できる端末では、光の色温度(K)も表示する。
  • HOLD・MAX/MIN・AVG: 値の固定、最大・最小の記録(長押しで消去)、5秒平均。
  • 早見表と判定: 場所・環境ごとの照度の目安と、寝る前/夜中/朝/作業/読書/団らんの用途ごとの判定を、アイコンつきで表示する。
  • 調光アドバイス: 「あと約○%暗く」のように、目安に合わせるための調整量を示す。
  • キャリブレーション: 既知の照度に合わせて補正し、機種・カメラごとに保存する。補正コードで他の人と共有もできる。
  • テーマと言語: ライト/ダークテーマ、日本語/英語に対応。
  • PWA対応: ホーム画面に追加すればオフラインでも起動でき、測定中は画面が消灯しない。

使い方

  1. ページを開いて「POWER」を押し、カメラの使用を許可する。
  2. 机や床の明るさを測るときは、前カメラを上に向けて置く。
  3. 部屋の雰囲気を測るときは「CAMERA」キーで後カメラに切り替えてかざす。

技術構成

ビルド不要の静的サイトで、HTML・CSS・JavaScriptを1ファイルにまとめ、GitHub Pagesで配信している。測定方式は端末の機能に応じて3段階に切り替える。照度センサー(AmbientLightSensor)が使える端末ではその値をそのまま使い、カメラの露出を手動制御できる端末(主にAndroid Chrome)では露出時間とISO感度を自動調整して、画面中央の輝度から E = 250·N²·(Y/0.18) / (t·S) で照度を推定する。露出を制御できない端末(iOS Safariなど)では、相対的な明るさを表示する。

工夫した点

スマホのカメラは自動露出で明るさを打ち消してしまうため、そのままでは照度を測れない。露出を固定できる端末では露出時間とISOを読み取り、写真の露出計算の式から照度に逆算している。機種ごとのずれは補正係数で吸収し、キャリブレーションの結果を補正コードとして共有できるようにした。表示は実物のハンディ照度計を意識した液晶風のデザインにし、縦持ちのスマホで本体が1画面に収まるようにしている。

よくある質問

本物の照度計の代わりになりますか?

スマホのカメラによる推定なので、専用の照度計ほど正確ではない。目安として±30〜50%程度、端末によってはさらにずれる。既知の照度に合わせるキャリブレーションで近づけられるが、参考値として使ってほしい。

iPhoneでも使えますか?

使える。ただしiOS Safariはカメラの露出を手動で制御できないため、ルクスの推定ではなく相対的な明るさ(画面に「REL」と表示)になる。

机の上の明るさを測るには?

前カメラを上に向けてスマホを置く。レンズに白い紙をかぶせると、光を均等に受けて照度計らしい値になる。部屋の雰囲気を見たいときは、CAMERAキーで後カメラに切り替えてかざす。

カメラの映像は外部に送られますか?

送られない。映像は端末内で明るさの計算に使うだけで、保存も送信もしない。キャリブレーション値は端末内に保存する。

同じカテゴリの制作物

Moeter のタイトル画像。AIが生成した4人のキャラクターイラストが並んでいる
Webツール Web

Moeter

4枚のイラストから好きな1枚を選ぶ30問の回答から好みのキャラ属性を読み解き、結果に合わせたオリジナルキャラをAIが1枚描く診断Webアプリ。

  • #TypeScript
  • #Vite
  • #Hono
  • #Cloud Run
  • #Cloudflare
  • #画像生成AI
非公式 学マス プレイリストメーカーの画面。アイドルの選択欄と動画一覧、プレイリストが並んでいる
Webツール Web

非公式 学マス プレイリストメーカー

学園アイドルマスターのMVや歌唱動画から自分だけのプレイリストを作って連続再生できる非公式Webアプリ。アイドル・曲で絞り込み、URLで共有もできる。

  • #Next.js
  • #TypeScript
  • #YouTube IFrame API
  • #Cloudflare Pages
てまぬい図鑑ジェネレーター
Webツール Web

てまぬい図鑑ジェネレーター

写真をアップロードするだけでてまぬい図鑑カードを作れるWebアプリ。AI背景除去・フォント選択・PNG書き出し対応。

  • #JavaScript
  • #Canvas
  • #@imgly/background-removal