Webデザイン・マーケティング課 授業26日目
1-3時間目
プロトタイプwebデザイン
使用テキスト
P187〜P222
■フッターのデザインを変更する
SP版のフッターのデザインを、PC版に変更する。特に注意する点はなく、コンポーネント内のオブジェクトの、幅の固定のチェックと、左右に固定のチェックを外すのを忘れなければOK。
■デスクトップ版のデザインを作る
キービジュアルを大きくし、コンセプトの文字を中央に配置する。
その後、よくある質問とオリジナルショップのデザインを変更する。
製品一覧は、リピートグリッドを維持したまま縦並びを横並びに変える。ここが少し手順的には難しいが、ゆっくりやれば問題ない。
以降、同じ要領で下層ページの分も作っていく。特に新しいことは無いので、ここでは割愛。
■画像の書き出し
デザインデータからコーディングに使う画像を書き出す。
まず、XDでデザインする前の、オリジナル画像を使える場合はそれを使う。
・書き出し対象を書き出し。
画像の比率などを変えたものは、XDから書き出す必要がある。
該当の画像を選択し、プロパティから書き出し対象にするをチェックする。
その後、「ファイルー＞書き出しー＞全書き出し対象」を選択し、2倍サイズのjpgで出力。
・画像を選択して書き出し
画像を選択して書き出すこともできる。
書き出したい画像を選択して、「ファイルー＞書き出しー＞選択したオブジェクト」をクリック。
サイズなどを設定して書き出せる。
■まとめ
デザイン部分に関しては、特に新しいことは全くなくなりました。
書き出しに関しては、特に選択して書き出せる機能が便利なので、覚えておきたいですね。