※今日の内容は難易度が高いです。わからなくなったら聞いてください。
また忘れてしまったらこの記事に戻ってこられるように覚えておいてください。
まずはスマホ出席で出席登録を行ってください。
今回の4桁の認証コードは「 」です。
Sponsored Link
みなさんの手元には自分自身が描いたデザインラフがあると思いますが、
（なかったらこちらを参考にダウンロードしてね）
いよいよそのデザインラフからワイヤーフレームを制作したいと思います。
この記事の目次
Photoshopの基本設定
Photoshopの基本設定から行いましょう。
まずはPhotoshopを起動し、新規ファイルを作成しましょう。
ワイヤーフレームの概要
ワイヤーフレームの概要は以下の記事より。
ワイヤーフレームの作り方
ワイヤーフレームの作り方は以下の記事より。
本日のまとめ
ワイヤーフレームは完成デザインの土台
ワイヤーフレームの理想形は「完成デザインの着色前の段階」、いわば完成デザインの土台です。
そのため、この段階で最終的なクオリティが決まってしまうことが多くなります。
ここで設計ミスをしてしまうと後々の修正が大変になりますのでじっくりと作りこんでみましょう。
もちろんそのまま本デザインに移行するので実寸のサイズを考慮して作らなければいけませんが、
Photoshopのようなツールのいいところは何度でも作り直しができるところです。
自分が書いた手書きデザインラフを、思い描く完成形に少しでも近づけるために、
よくにらめっこしながらワイヤーフレームを作っていくといいと思います。
ワイヤーフレームの制作に必要なツールは揃った
今回からいよいよワイヤーフレーム制作の段階に進むことができましたね。
ひとまず大まかな工程の説明になりましたが、次回はブラッシュアップを行っていき、更なるクオリティアップを目指していきましょう。
以前、ワイヤーフレームはページデザインの土台であると言いました。
ワイヤーフレームの制作時は、その先にあるトップページデザインをしっかり見据えて取り掛かりましょう。
またトップページデザインの制作に進んでからは、デザイン着手時の配色の順番だとか画像の選び方・補正の仕方などをレクチャーする予定です。
次回はワイヤーフレーム制作の続きとブラッシュアップ、
さらに仕組みの説明の記述を行いましょう。
