まずはスマホ出席で出席登録を行ってください。
今回の4桁の認証コードは「 」です。
Sponsored Link
前回はワイヤーフレームの制作に取り掛かり始めましたね。
今回はその続きを行なっていきたいと思います。
非常にシンプルに言えば・・・
- 手書きデータを下書きにする。
- 長方形ツールで長方形レイヤーを作り、各ブロックや各アイテムをレイアウトする。
- 横書き文字ツールでテキストレイヤーを作り、名称や説明を記入する。
・・・といった作業の流れです。
最終的にはワイヤーフレームの最大の役割である「色や背景素材を変えたり写真を入れたらそのままデザインとして使える」というレベルまで持っていきましょう!
そのために今回は非常に重要な工程になりますので、1時間半を丸ごとワイヤーフレームの制作に充てたいと思います。
順次状況を見にまわりますのでいつでも声をかけてください。
Photoshopの基本設定
Photoshopの基本設定から行いましょう。
まずはPhotoshopを起動し、前回途中まで制作して保存したPSDファイルを開きましょう。
ファイル名は「学籍番号-wire.psd」としていたかと思います。
ワイヤーフレームの制作
では今回もワイヤーフレーム制作作業を始めていきましょう。
まずは目安としての完成形を再度確認しましょう。
実際の案件事例 その①
デザインラフ・ワイヤーフレーム・仕組みの説明・デザイン成果物
そして、再度工程を振り返ります。
では下の手順の⑤⑥⑦⑧をブロックごとに繰り返して、ワイヤーフレーム制作を進めていきましょう。
ワイヤーフレーム制作手順⑤ グループ(フォルダ)を作って名前をつける
ワイヤーフレーム制作手順⑥ 下書きを見本に長方形ツールでブロックを作成
本日のまとめ
前回に引き続きワイヤーフレームの制作を進めましたが、完成までどのくらい近づいたでしょうか?
このワイヤーフレーム制作の工程は時間がかかっても問題ありません。
なぜならワイヤーフレームの工程で後のデザインのクオリティが大きく左右されるからです。
ワイヤーフレームができていない人は「授業時間内」でも「授業時間外」でも、
時間が許す限り完成するまで付き合いますので声をかけてください。
来週からはデザイン制作に取り掛かる準備を始めたいと思っています。