DE-K23｜情報Ⅰ 対策問題

正答

1

この問題のポイント

ワイヤーフレーム（レイアウトの設計図） を問う問題です。制作の流れの中で位置づけて覚えましょう。

解説

ワイヤーフレームは、Webページや画面の「どこに・何を・どんな大きさで」配置するかを、線(ワイヤー)と枠(フレーム)だけで表した設計図です。ロゴ・メニュー・見出し・本文・画像などの位置を、色や装飾を付けずに検討します。

なぜ最初から作り込まないのでしょうか。色や写真まで作り込んだ後で「メニューの位置を変えたい」となると、やり直しの手間が大きいからです。線と枠だけの段階なら、情報の優先順位(何を一番目立たせるか)や、ユーザの視線・操作の流れ(導線)を、素早く何案も比較できます。

制作の流れの中で整理しましょう。「目的・ターゲットの明確化 → ラフスケッチ → ワイヤーフレーム(配置の設計) → プロトタイプ(試作) → 評価・改善」。ワイヤーフレームは「設計」、プロトタイプは「試作」と役割が異なります。映像制作でこれに当たるのが絵コンテです。

共通テストでは、用語の意味を問う形のほか、「制作手順の並べ替え」「この段階で作るものはどれか」という流れの中で出題されます。

選択肢の確認

1．○ 配置を線と枠で表した設計図=ワイヤーフレーム。
2．× ソースコードはHTMLやプログラムの記述そのもので、設計図ではない。
3．× サイトマップはサイト全体のページ構成(階層)を示す図。1ページ内の配置図ではない。
4．× ファビコンはブラウザのタブに表示される小さなアイコン。

ここだけは覚えよう

ワイヤーフレーム=線と枠だけの配置設計図 — 作り込む前に優先順位と導線を検討する。