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

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

   

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

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

メニュー一覧をテキストで入力し、ガイドを使って位置を調整します。



この動画で学べること

・メニュー一覧の作成方法



テキストボックスを作って、テキストを入力していこう

今回は、前回の続きでメニュー一覧の作成をしていきますが、2つのテキストレイヤーに分けて、メニューの種類と価格の部分を作りたいと思います。
まず、メニューの種類の所から見ていきましょう。
テキストツールに切り替えて、テキストボックスを作り、文字を入力しましょう。
今回は文字入力を確定をせず、スタイルの変更をしたい部分をドラッグで選択して文字の種類や色などを設定していきす。




レイヤーを複製して、テキストを入力していこう

次に価格の部分も見ていきましょう。
文字のスタイルはメニューの種類と同じなので、レイヤーを複製してテキストだけを価格に変更していきます。
文字の入力を確定したら、テキストボックスの幅を小さくしましょう。
文字の作成ができたら、移動ツールに切り替えて右側に移動させます。
この時、Shiftを押しながらずらすと上下にぶれないので、楽に配置させることができます。