写真上の基準線から求める比率。
おでこ測定AIの数理モデル

このツールの入力から出力まで

現行コードの確認日：2026-10-12

入力

正面の人物写真を選び、生え際と眉間の基準線を写真に合わせて調整します。

処理

ランドマーク10・151・152を線の初期位置に使い、3本の線の距離から比率を計算して画像へ描きます。

出力

1人を検出し、長辺1500px以下の写真へ線と数値を描き、JPEG品質0.95で保存します。

まず確認する点：モデルは生え際そのものを測っていません。基準線の置き方や撮影角度で値が変わり、医療や健康状態の判断には使えません。

仕上がりの例

顔写真におでこの比率の測定表示を重ねた例です。

画像を拡大

サンプルにはAIで生成した架空の人物画像を使用しています。

加工前・加工後

閉じる

掲載画像はサイトにある既存の公開作例です。保存済みの資料ではAIで作成した架空の人物・手の画像を使用しています。今回の確認日が、この作例を実行した日を表すわけではありません。

保存済み検証記録の条件を見る

資料の種類は「ツールの出力画像を保存した記録」です。公開作例と保存済み記録で素材や色などが異なる場合があるため、下の数値は保存済み検証記録の条件として読んでください。

記録の入力画像

1788×2400px (JPEG)

記録の出力画像

1117×1500px (JPEG)

保存済み記録の主な操作・出力条件

画面の項目	記録の値	現行コードの初期値・範囲
記録の上の基準線の移動	0	—
記録の中央の基準線の移動	0	—

資料ファイルの作成日は実行日として扱っていません。個別端末の処理速度や、ほかの写真に対する検出・加工の精度を測定した資料でもありません。

実装の確認箇所：src/pages/ai/face-lan/forehead-scanner/index.astro。以下のコード抜粋と出力条件は、この本番実装に基づいて説明します。

仕組みを読み進めるときは、MediaPipeの顔ランドマーク（顔の点を使う描画と変形）、Canvas APIと画像処理（画像寸法、drawImage、画素と透明度の扱い）が参考になります。

1. ピクセルの間隔を割合へ変換する計算

Webツールで画像を扱う際、最大の課題は「カメラとの距離（解像度）」が毎回異なることです。昨日と今日で10pxの差があっても、それが髪の後退なのか、単にカメラに近づいたからなのかを判断できません。

この問題を解決するため、本ツールでは顔全体の縦幅を分母とした比率算出を採用しています。AI（MediaPipe）が検知した特定のランドマーク座標から、顔全体の長さとおでこの長さを同時に抽出。縦方向の間隔を割り算するため、画像全体を同じ倍率で拡大縮小したときの影響は小さくなります。一方、顔の傾き、遠近感、撮影位置や基準線の置き方の違いは残ります。

画面へ表示する比率の計算です。topY・midY・bottomYは調整後の基準線のY座標で、実寸の長さではありません。

function lineRatio(topY, midY, bottomY) {
  const total = Math.round(Math.abs(bottomY - topY));
  const forehead = Math.round(Math.abs(midY - topY));
  return {total, forehead,
    percent: total > 0 ? (forehead / total * 100).toFixed(1) : '0.0'};
}

2. requestAnimationFrameによるリアルタイム・キャンバス合成

AIが返す顔ランドマークは、生え際の位置を直接測定したものではありません。前髪、顔の傾き、照明などにより、写真で確認したい位置と基準線が合わない場合があります。本ツールでは「AIにおまかせ」で終わらせず、ユーザーがスライダーで画像上のピクセル単位の位置調整を行えるようにしました。

この際、スライダーを動かすたびに再描画を行うと、特にモバイル端末でUIが重くなります。そこで、ブラウザの描画更新タイミングに同期する requestAnimationFrame (RAF) を活用。入力イベントと描画処理を分離し、次の画面更新に合わせて座標と文字を描き直します。60fpsの固定動作を保証するものではなく、実行中の処理を別スレッドへ移すわけでもありません。

出力の仕様と確認する点

基準線の初期位置にはランドマーク10・151・152を使います。上と中央の線は-100〜100pxで調整できます。生え際や眉間に合っているかは写真を見て確認する必要があり、表示値に検証済みの測定精度は設定されていません。

1人を検出し、長辺1500px以下の写真へ線と数値を描き、JPEG品質0.95で保存します。比較する場合は撮影方向や表情、基準線の置き方を揃えてください。それでも写真条件の影響は残ります。

表示する比率は、この3本の線から算出した値です。脱毛の進行や医学的な異常、美しさの基準を判定する機能ではなく、「黄金比」との比較から健康状態を判断することもできません。