こうしてWeb制作の本番前にプロトタイプってのを作ってみると楽しい！

1. サイトマップとワイヤーフレーム VS プロトタイプ サイトマップは、ウェブサイト内におけるコンテンツの配置図。 ワイヤーフレームは、画面上における情報の配置図。 二つともウェブサイトの設計図にあたる大切なものですが、ウェブサイトの動きを触って確かめられないのが弱点です。 それに対して、プロトタイプは「ウェブサイトの模型」として実際に動かせます。クリックしてリンク先のページを開きながら、操作性を体感しサイト全体の構成も追いかけられます。 2. 手書きのワイヤーフレーム たとえば、こんな手書き（雑…汚くてスミマセン）のワイヤーフレーム。トップページの「メールアイコン」と「contactの文字」をクリックすると「お問い合わせ」のページへ移動する仕様です。これをプロトタイプにしてみます。 3. プロトタイプの見本 手書きのワイヤーフレームから作ったプロトタイプの挙動を動画にしました。動画で見

[sm029]

こうしてWeb制作の本番前にプロトタイプってのを作ってみるのも楽しい！ Webサイト制作時の準備として、サイトマップやワイヤーフレームだけでなく、完成後の動きを触って試せるプロトタイプも作ってみましょう。楽し