実践Webデザインスキル - 第6章 Lesson6

第3回:既存のレイヤーを再利用してメニュー一覧を作ろう-4

   

テクノロジーとクリエイティブのプロを目指す人のためのオンラインスクール
月額2500円で500以上のレッスンが受けられます

このスキルのデータをダウンロード: Windows Mac

レイヤーを複製して、メニュー一覧を完成させます。



この動画で学べること

・レイヤーを複製して、メニュー一覧を作成する方法



レイヤーを複製して、テキスト部分を変更していこう

まずは、前回作成した「Cut」の部分のレイヤーをグループにまとめましょう。
そして、前回作成した「Cut」の部分と「Color」「Perm」の部分は同じスタイルなので、Altを押しながらグループをドラッグし、複製します。
移動ツールに切り替えて複製したグループを移動させ、20pxの余白をとって配置します。
あとは、文字を変更するだけです。




バウンディングボックスを表示させるショートカットを使ってみよう

Basic Menu背景の部分の大きさを変えていきましょう。
背景のレイヤーを自動選択ツールで探します。

そして、ショートカットキー
[Mac] command ⌘+T
[Windows] Ctrl +T
でバウンディングボックスを表示し、背景を引き伸ばしていきましょう。
ガイドに沿って、ぴったりに収まる大きさにすれば、完成です。



このようなメニュー一覧ができあがりました。