PhotoshopでWebデザイン

モックアップをスライスする

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
スライスの仕方と各スライスの設定方法をみていきます。
講師:
03:38

字幕

では、実際に「スライスツール」を使って切っていきましょう。「スライスツール」に持ち替えます。この中クリック長押しで「切り抜きツール」の下に入っています「スライスツール」ですね。もし、左上にこの「01」という区分が入っていない場合「表示」>「表示・非表示」>「スライス」にチェックを入れてあげると、出てきます。この状態でまず、切っていきましょう。一番上のバナーから切っていきます。マウスでクリック・ドラッグでぴったりくっ付きます。もし失敗しても、こう後から直せるので適当に切っても大丈夫です。次にこの左下のを切っていきます。失敗したら、直す。おっと、失敗。クリック・ドラッグと。クリック・ドラッグ。4枚切ることができました。切れましたら、今度はスライスの「選択ツール」の方に切り替えてこの各セクションをきれいに名前を付けていきたいと思います。このスライスで区切る時にいま、このバナーがある4カ所だけを切ったんですがこの空白のところにもきれいに自動的にこの区分に名前を入れてくれています。では、順番に名前を付けていきましょう。まずは、このアドバタイズメントのこのバナーですね。バナーの名前のところに行きたいと思います。 「728×90」のAdはこれですね。右クリックから「スライスオプションを編集...」若しくは、ダブルクリックでいけます。「728×90_ad」後々、ここの名前がファイルを書き出す際の名前にも使えるのできれいに付けておきます。次はこの「250×250」の正方形のバナーですね。「250×250_ad」これは、今度小さい方の長方形ですね。「468×60」「468×60_ad」最後に、「125」の正方形ですね。「125×125_ad」きれいに名前がつけられました。書き出す際は「ファイル」>「Web 用に保存...」こちらを使います。普通、ドキュメントを書き出す際は「別名で保存...」とか使いますよね。「Web 用に保存」します。そうすると、スライスした場所別々のオプションで書きさす事ができます。例えばここは JPEG にしようかなとかここは PNG にしようかなということが可能です。恐らく、普通は全部統一してPNG-24 とかにするとは思います。こうやって書き出すことで一枚のドキュメントから複数のイメージを書き出すことができます。

PhotoshopでWebデザイン

このコースではウェブデザイナーの方を対象に、Photoshopを使ってWebグラフィックやワイヤーフレーム、サイトのモックアップを作成する方法を学習します。具体的には最大効率化するためのカスタムWebワークスペースの作成やカラーリング方法、グラフィクスを最適化する方法を学びます。

4時間27分 (71 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2014年04月13日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。