← 進捗表に戻る
共有資料の一覧 / なんでやねん

「なんでやねん」ページのデザイン検討資料

2026-09-01 制作 / 2026-09-02 公開

これは「ひとこと帖(Pocket Kobito)」という、訪日外国人向けに日本語フレーズを1ページ1フレーズで紹介する冊子・ページのデザイン検討画像です(2026-09-01制作)。

「なんでやねん」はその中の1フレーズ(Chapter 03 COMEDY)で、このページのデザインを決めようとしています。

01〜06はレイアウト5案(見本文は「お疲れ様です」ページを使用。日本語とローマ字のどちらを主役にするかの構図比較)+比較一覧。

07〜11は日本語:ローマ字の大きさ比率4案(A=2:1/B=1.5:1/C=1:1同格/D=1:1.2。こちらは「なんでやねん」ページ実物)+比較一覧。

12〜13は現時点の作り込み版「なんでやねん」ページ(PC幅とスマホ幅)。決めたいのは「どのレイアウト構図」と「どの日本語:ローマ字比率」でいくか、です。

注記:レイアウト5案(01〜06)の見本文は「お疲れ様です」ページで作ったもの(構図の比較用)。「なんでやねん」本体が写っているのは 07〜13 だけ。

一、レイアウト5案(見本文は「お疲れ様です」。構図の比較)

01 レイアウト案1:日本語が支配、ローマ字を拡大見本文は「お疲れ様です」ページ(構図比較用)
レイアウト案1:日本語が支配しローマ字を拡大した構図。見本文は「お疲れ様です」ページ(構図比較用)
02 レイアウト案2:ローマ字が主役見本文は「お疲れ様です」ページ(構図比較用)
レイアウト案2:ローマ字を主役にした構図。見本文は「お疲れ様です」ページ(構図比較用)
03 レイアウト案3:縦2段・同格見本文は「お疲れ様です」ページ(構図比較用)
レイアウト案3:日本語とローマ字を縦2段で同格に置いた構図。見本文は「お疲れ様です」ページ(構図比較用)
04 レイアウト案4:上下分割見本文は「お疲れ様です」ページ(構図比較用)
レイアウト案4:画面を上下に分割した構図。見本文は「お疲れ様です」ページ(構図比較用)
05 レイアウト案5:単色(monocolor)を強めた版見本文は「お疲れ様です」ページ(構図比較用)
レイアウト案5:単色(monocolor)の質感を強めた構図。見本文は「お疲れ様です」ページ(構図比較用)
06 レイアウト5案の比較一覧01〜05を横並びにしたもの
レイアウト5案(案1〜案5)を横並びにした比較一覧。見本文は「お疲れ様です」ページ

二、日本語:ローマ字の大きさ比率4案(「なんでやねん」ページ実物)

07 比率案A:日本語 2 対 ローマ字 1「なんでやねん」本体
比率案A:日本語2対ローマ字1。「なんでやねん」ページ実物
08 比率案B:日本語 1.5 対 ローマ字 1「なんでやねん」本体
比率案B:日本語1.5対ローマ字1。「なんでやねん」ページ実物
09 比率案C:1 対 1(同格)「なんでやねん」本体
比率案C:日本語とローマ字が1対1の同格。「なんでやねん」ページ実物
10 比率案D:日本語 1 対 ローマ字 1.2「なんでやねん」本体
比率案D:日本語1対ローマ字1.2。「なんでやねん」ページ実物
11 比率4案の比較一覧07〜10を横並びにしたもの
比率4案(A〜D)を横並びにした比較一覧。「なんでやねん」ページ実物

三、現時点の作り込み版「なんでやねん」ページ

12 作り込み版:PC幅「なんでやねん」本体
現時点の作り込み版「なんでやねん」ページ、PC幅の表示
13 作り込み版:スマホ幅「なんでやねん」本体
現時点の作り込み版「なんでやねん」ページ、スマホ幅の表示
← 進捗表に戻る