CUEVANCE Aspect Ratio Calculator | ユーザーマニュアル & 操作ガイド

1

全画面構成 & 各部位のUIマップ

無駄を削ぎ落とした高効率シングル画面設計とリアルタイムHUDインターフェース

CUEVANCE Aspect Ratio Calculator — 画面全体マップ

UI構成図

①

ロゴ & ブランドヘッダー CUEVANCE ASPECT RATIO CALCULATOR

②

ハンバーガーメニュー (Drawer) 言語切替 (JP/EN/CN)・テーマ (Neon/Studio)・URL共有・奇数解説

③

🖼️ リアルタイム HUD モニター (Live Canvas & Quick Tools)

16:9 (1920 × 1080 px / 1.78:1)

④

MEGAPIXELS: 2.07 MP

•

DIAGONAL: 2203 px

•

DECIMAL RATIO: 1.78:1

⑤

🎞️ 業界標準プリセット (Presets)

ドロップダウン: Cinema / Broadcast / SNS / Display / AI

クイックチップ: 16:9, 9:16, 2.39:1, 1:1, 4:5, 21:9

⑥

🔢 比率 & 解像度入力 (Inputs & Lock)

比率入力: ASPECT (X) : ASPECT (Y)

解像度入力: WIDTH px × 🔒 LOCKED × HEIGHT px

⑦

奇数ピクセル警告バナー & ワンタップ修正 奇数検出時に自動表示。YUV 4:2:0破損防止と安全な偶数(mod 2/mod 16)への修復

⑧

ワンタップコピー (Copy Actions) 「解像度をコピー (1920×1080)」/「比率をコピー (16:9)」

番号	部位名称	機能概要 & 現場での役割
①	ブランドヘッダー	アプリタイトルおよびバージョンを表示。クリックで初期状態へのリセットが可能。
②	ドロワーメニュー	日/英/中の言語切替、サイバーネオン/ウォームスタジオのテーマ切替、設定値を含む共有URLの生成・コピー、バージョン更新確認を実行。
③	リアルタイム HUD モニター	入力された比率・解像度をSVGベクトルでリアルタイム描画。グリッド（4/6/9分割）、セーフエリア（90%/80%/SNS 60%）、90度縦横回転を1タップで切替可能。
④	テレメトリー指標バー	総画素数（Megapixels）、対角線ピクセル長（Diagonal px）、小数比率（Decimal Ratio: 1.78:1等）をリアルタイム自動算出。
⑤	プリセットセレクター & チップ	16:9, 9:16, 2.39:1, 1:1, 4:5, 21:9 などの業界標準プリセットを1タップで即時適用。ドロップダウンからCinema/Broadcast/SNS/Display/AIの詳細プリセットを選択可能。
⑥	比率 & 解像度入力欄 (連動ロック)	比率（X:Y）と解像度（幅×高さ）の相互双方向計算。連動ロック（LOCKED）時は比率を維持したまま幅または高さを打ち替えるだけで相手方の数値を完全自動逆算。
⑦	奇数ピクセル警告 & 1クリック修正	動画エンコード事故を引き起こす奇数幅・奇数高さを検知して即座に警告表示。タップでYUV 4:2:0の理由解説モーダルを開き、安全な偶数（mod 2 / mod 16）へワンクリック修正。
⑧	ワンタップコピーボタン	「1920×1080」形式の解像度文字列や「16:9」形式の比率文字列をクリップボードに瞬時にコピー。編集ソフトや設計書への転記を高速化。

2

リアルタイム HUD プレビュー & 各種ガイド機能

構図設計・字幕配置・SNS UI被りを防止するプロ仕様の視覚検証ツール

中央のHUDモニターは、入力された比率（横:縦）に合わせてSVGベクタービューポートがリアルタイムに形状を変形させます。画面上部の3つのツールピル（GRID / SAFE / ROTATE）により、現場に必要な構図ガイドを瞬時に重ねて確認できます。

📐 GRID

分割グリッド (4 / 6 / 9分割)

ボタンを押すたびに「OFF → 4分割（十字）→ 6分割（2×3）→ 9分割（三分割法・Rule of Thirds）」が循環します。1マスあたりのピクセル寸法も自動計算され、構図バランスやオブジェクト配置の基準線として機能します。

🛡️ SAFE AREA

セーフエリア (Action / Title / SNS)

「OFF → 90% アクションセーフ（映像見切れ防止）→ 80% タイトルセーフ（テロップ保証範囲）→ 60% SNS UI保護（TikTok/Reels等のいいね・コメント・説明文被り回避ゾーン）」を順次切り替えて検証できます。

🔄 ROTATE

90° 縦横回転 (Rotate / Swap)

「ROTATE」ボタンを押すと、比率（X ↔ Y）および解像度（幅 ↔ 高さ）の縦横値が瞬時にスワップされます。横型映像（16:9 / 1920×1080）から縦型ショート動画（9:16 / 1080×1920）への切り出し確認に最適です。

3

比率 & 解像度の連動計算ロジック

比率ロック時の自動スケーリングと最大公約数（GCD）による最小整数比算出

🔒 連動ロック (Ratio Lock) の仕組み

「LOCKED 🔒」状態では、アスペクト比（X : Y）が固定されます。幅（WIDTH）を変更すると高さ（HEIGHT）が自動計算され、高さを変更すると幅が自動計算されます。

Height Calculation: Height = round(Width × (Y / X))

Width Calculation: Width = round(Height × (X / Y))

操作ケース	ロック状態	アプリの自動計算動作
比率 X/Y を変更	🔒 LOCKED	現在の幅（WIDTH）を基準とし、新しい比率に合わせて高さ（HEIGHT）を自動逆算します。
幅 (Width) を変更	🔒 LOCKED	比率 X:Y を保持したまま、高さ（HEIGHT）を即時再計算します。
高さ (Height) を変更	🔒 LOCKED	比率 X:Y を保持したまま、幅（WIDTH）を即時再計算します。
解像度を直接変更	🔓 FREE	ロック解除時は幅・高さを独立して入力できます。入力された解像度から最大公約数（GCD: ユークリッド互除法）を用いて最小整数比を自動約分し、比率入力欄を更新します。

4

業界標準プリセット一覧 & 用途ガイド

放送・映画・SNS縦型・PCウルトラワイド・AI生成の主要規格を網羅

カテゴリ	比率 (Ratio)	代表解像度	業界用途 & 現場での主な使用シーン
Broadcast / Video	16:9	1920×1080 (FHD) 3840×2160 (4K UHD)	地上波テレビ放送、YouTube標準、一般的なPCモニターやプロジェクターの標準画角。
Broadcast (SD)	4:3	1440×1080 (HD) 640×480 (VGA)	旧世代テレビ放送（NTSC/PAL）、レトロゲーム、iPad等のタブレット画面、クラシックシネマ。
Cinema (Scope)	2.39:1 (64:27)	4096×1716 (DCI 4K Scope) 2048×858 (DCI 2K)	劇場公開用シネマスコープ（スコープサイズ）。ハリウッド映画やドラマチックなMVのワイド画角。
Cinema (Flat)	1.85:1 (37:20)	3996×2160 (DCI 4K Flat) 1998×1080 (DCI 2K)	劇場公開用アメリカンビスタ（フラットサイズ）。劇場用映画の二大標準比率の一つ。
SNS Vertical	9:16	1080×1920 (FHD) 720×1280 (HD)	スマートフォン縦型動画の絶対標準。TikTok、Instagram Reels、YouTube Shorts、LINE VOOM。
SNS Feed / Square	1:1 / 4:5	1080×1080 (Square) 1080×1350 (Portrait Feed)	Instagramフィード投稿用。4:5はタイムライン上での占有面積が最も広く視認性が最大化。
Ultrawide Display	21:9 / 32:9	3440×1440 (UWQHD) 5120×1440 (Dual QHD)	ゲーミング・クリエイター向けウルトラワイドモニター、展示会場のパノラマLEDウォール。
AI Image Gen	Custom mod 8	896×1152 (3:4) 1344×768 (7:4)	Stable Diffusion SDXL, Midjourney, FLUX等の潜在拡散モデル（VAE 8倍ダウンサンプリング整合）。

5

映像工学: 奇数ピクセル警告と YUV 4:2:0 / マクロブロック

なぜ「奇数解像度」は動画制作で厳禁なのか？エンコードクラッシュと緑色ノイズの原因

⚠️ 奇数解像度（Odd Pixel）が引き起こす 3 大事故

① NLE書き出し停止エラー: Premiere Pro, DaVinci Resolve, After Effects, Final Cut Pro で「エラーコード -1609629695」「フレームレンダリング失敗」が発生。
② 最下部・右端の緑色/黒色ノイズ線: YouTubeやTikTokへのアップロード時、またはGPUデコード時に境界データが欠落し、緑色の帯状ノイズ（Green Line Artifact）が発生。
③ ハードウェアアクセラレーション無効化: NVENC (NVIDIA), QuickSync (Intel), VideoToolbox (Apple Silicon) のハードウェアエンコーダーが拒絶し、CPU低速フォールバックまたはクラッシュ。

🔬 1. CHROMA

YUV 4:2:0 クロマサブサンプリング

H.264、H.265 (HEVC)、ProRes、AV1、WebMなどの主要ビデオコーデックは、人間の目が輝度（Y）に敏感で色差（U/V）に鈍感な性質を利用し、2×2画素（計4画素）で1つの色差情報を共有します。縦横どちらかが奇数だと2×2ブロックが二分割され、不完全な色差セルによりエンコーダーが強制終了します。

⚙️ 2. MACROBLOCK

マクロブロック整合性 (mod 2 / 8 / 16)

動画圧縮（DCT離散コサイン変換）やGPUハードウェアは、16×16（H.264マクロブロック）または8×8（DCTブロック・AI生図VAE）のグリッド単位で処理します。偶数（mod 2）は書き出しの絶対条件であり、mod 8やmod 16に揃えることでパディング無駄のない最高効率の圧縮が保証されます。

💡 アプリの自動修復機能 (1-Click Safe Fix)

奇数が検出された場合、アプリ上部に警告バナーが表示されます。タップすると詳細モーダルが開き、以下の2種類の修復を1クリックで適用できます：

安全な偶数（mod 2）に修正: 元の寸法に最も近い偶数（+1 または -1 px）へ瞬時に丸め、YUV 4:2:0の書き出し安全性を即座に確保します。
マクロブロック（mod 16）に修正/最適化: H.264/HEVCハードウェアエンコーダーの完全倍数（16の倍数）へ丸め、プロ仕様の最高圧縮効率を実現します。

6

テレメトリー工学指標 & 計算式解説

画面設計・GPU負荷見積もり・視覚解像度の定量的評価パラメータ

指標名 (Metric)	単位	工学計算式 (Formula)	現場での活用・工学的意義
総画素数 (Megapixels)	MP	`MP = (Width × Height) / 1,000,000`	GPUビデオメモリ（VRAM）消費量、レンダリング負荷、LEDプロセッサーのポート収容限界（1ポート約65万画素）の見積もりに使用。
対角線長 (Diagonal)	px	`D = √(Width² + Height²)`	ピタゴラスの定理による対角線画素数。ディスプレイのインチ数と組み合わせることで画素密度（PPI: Pixels Per Inch）を逆算可能。
小数比率 (Decimal Ratio)	X.XX:1	`R = (Width / Height) : 1`	幅と高さを正規化した小数表現（例: 16:9 → 1.78:1、21:9 → 2.33:1）。シネマスコープや特型LEDビジョンの比率比較を直感化。
最小整数比 (GCD Reduction)	X : Y	`X' = Width / GCD(W, H) Y' = Height / GCD(W, H)`	ユークリッド互除法により幅と高さを最大公約数で約分し、最も簡潔な整数比率（16:9, 4:3, 16:10等）を即座に特定。

7

現場ワークフロー & FAQ (よくある質問)

各種動画編集ソフト（NLE）との連携、現場でのトラブル解決手順

🎬 プロの現場ワークフロー: 4 ステップ

Step 1: 比率または目標解像度の選定: プリセット（16:9 / 9:16 / 2.39:1 等）を選択するか、カスタム寸法を入力します。
Step 2: 構図 & セーフエリアの確認: GRID（三分割）や SAFE（SNS 60% / Title 80%）を点灯させ、見切れやUI被りを事前シミュレーションします。
Step 3: 奇数警告のチェック & 1クリック修正: 奇数警告（⚠️）が出ていないか確認し、出ている場合は「mod 2」または「mod 16」で即座に安全化します。
Step 4: 解像度コピー → 編集ソフトへペースト: 「Copy Resolution」ボタンを押し、Premiere Pro や DaVinci Resolve のカスタムシーケンス設定にそのままペーストします。

Q1

Premiere Pro や DaVinci Resolve でカスタム解像度を設定するには？

Premiere Pro では「シーケンス設定 → 編集モード: カスタム → フレームサイズ」に本ツールのコピーした幅と高さを入力します。DaVinci Resolve では「プロジェクト設定 → マスター設定 → タイムライン解像度: Custom」に入力します。

Q2

オフラインの現場（電波のない地下等）でも動作しますか？

はい。PWA（Progressive Web App）およびローカル Service Worker キャッシュに対応しているため、一度アクセスした端末であれば完全オフライン環境や機内モードでも100%スタンドアロンで動作します。

Q3

設計した比率や解像度をチームに共有するには？

右上のメニューから「Copy App URL」を実行すると、現在の比率・解像度・ロック状態・グリッド設定をURLパラメータ（クエリ文字列）に埋め込んだディープリンクが生成され、Slackやメールで一発共有できます。

Q4

LED Wall Configurator と連携して使うには？

大型LEDビジョンで特型アスペクト比（32:9や円形・帯状など）の画面を組む際、まず本ツールで映像素材の書き出し解像度とマクロブロック整合性を検証し、その数値を CUEVANCE LED Wall Configurator に入力することで、送出から表示まで完璧な整合性を担保できます。

CUEVANCE Aspect Ratio Calculator 操作マニュアル