photoshop 書き出し 2倍

Retina対応のWebデザインをするときの注意点。PhotoshopやIllustratorでWebデザインをつくるときの、Retina対応の方法ちゃんとわかっていますか？Retinaってなに？とりあえず2倍でつくればいいの？なんていうWebデザイナーさんの為にRetina対応の方法についてまとめたので見てください。 普通サイズと2倍サイズの画像が一気に書き出しされました！ まとめ. 透過PNGを書き出す場合は下のレイヤーを非表示にしなくてはならないし…。 Photoshopで画像を書き出す方法はいかがでしたか？ 画像の書き出しはPhotoshopで編集したら必ず行います。 書き出しをしない限り「psd 」というPhotoshopの形式になるためWebで使用することが出来 … 2019.08.21. もし2倍の大きさで書き出したければ、「200% logo.png」とします。他にも画質や書き出しサイズを設定するオプションもありますが、よく使うのはパーセント指定での拡大や縮小なので、これだけは覚えておいてください。 画像アセットにまつわる暗黙のルール 1. WebデザインカンプをPhotoshopで制作した時、コーディングの準備として、psdからjpgやpngなどに書き出しを行う必要がありますが、「画像アセット生成」を使うと正確に効率的に行えます。2倍書き出しの設定なども初期設定で一行追加するだけで一括して設定できるので、かなり便利です！ csでは… スライスは切るのに手間がかかり、2倍解像度画像を書き出せない ccなら… レイヤーごと書き出す「クイック書き出し」、高解像度素材も一括して書き出す「書き出し形式」などで素早く書き出し 1. 使わない手はない！ この記事ではAdobeのPremiereとPhotoshopを使って、動画にテロップをつける方法に紹介しています。Photoshopを使うことでデザインを適用したテロップをスムーズに作ることができるので、おすすめの … レイヤーパネルの右上をクリック→「書き出し形式…」を選択します。, 左上の「すべてのスケール」で書き出すサイズとファイル名につける接尾辞の設定をします。 この記事ではAdobeのPremiereとPhotoshopを使って、動画にテロップをつける方法に紹介しています。Photoshopを使うことでデザインを適用したテロップをスムーズに作ることができるので、おすすめ … 機会がありましたらやってみてくださいね！. 2：「画像アセット」で画像を書き出す。 ファイル名を変更できたら、 書き出したいレイヤーを選択 します。 「（メニュー）ファイル」→「生成」→「画像アセット」 これだけで、 元のファイルと同じ階層に保存 されます。 Photoshopのアセット機能で画像を拡大書き出ししたら、なぜか書き出した画像がボケることありませんか？ある解決方法を見つけたのでその方法をお伝えししたいと思います。 「カンバスのサイズ初期設定方法」自分でイチから印刷用データを作る際のコツ、Photoshopを使った印刷用データの作成方法と注意点をご紹介いたします。- 高品質な印刷物を短納期・低価格でご提供。万全のサポート体制で初めての方も安心してご利用いただけます。 2016年11月上旬にベータ版がリリースされたAdobe XD。数々の機能の中からPNG、SVG、PDFファイルのエクスポートが可能な「書き出し」機能の使い方をお伝えします。 というやり方をしていました。（CC 2015より、「Web用に保存（従来）」に機能名が変わりました。）, このやり方だと、Retina対応などで数が多いアイコンを複数のサイズに展開して作るときなど、とっても面倒なのですよね。 Photoshop上で600×400のサイズで作成していますが、2倍(200%)の1200×800でアセットが生成されます。 2倍のpanda.jpgが生成された 画質の指定. 僕はよく、小さめの画像は200%で2倍書き出しを行うことが多いです。 画像の書き出し方法について、詳しくは下記のサイトが参考になります。 Photoshop CCの基本 第4回：Web用画像を書き出す4つの方 … 2019.08.21. Photoshopの小さいテクニック. 2018.04.25. ホームページ. Photoshopのアートボードの背景を透明にする方法. ホームページ. 2．「書き出し」でjpg 3．「書き出し」でbmp保存後、Photoshopで「Web用に保存」でjpg 4．「書き出し」でbmp保存後、Photoshopで「保存」でjpg 5．Photoshopに貼り付け後、「Web用に保存」でjpg 6．Photoshopに貼り付け後、「保存」からjpg スマートオブジェクトは、拡大、縮小を繰り返しても劣化しないというのが特長です。もちろん、オリジナルのサイズより大きくする場合は別ですが、いったん縮小してから再び拡大しても、その都度オリジナルからピクセルを生成しますので、常に最適な画質が保持されるというわけです。 1. こんにちは.2万5千分の1地形図の縮尺を変えたいのですが,コンビニのコピー機などで縮尺変更するにはどうしたらいいでしょうか？・・・％の変更とかがよく分かりません.1：25,000の地図は実際の1／25,000の大きさになっています。片や、 1枚の画像のみ切り抜く方法. Web用に保存できない場合は、Photoshopのサイズ制限を超えている場合を先ず疑ってみる必要があります。続いて、macOSとPhotoshopのバージョンによる衝突が原因でエラーになるケース。他には、どんなものがあるか見てみましょう。 ホームページ. 例えば、rabbitという名前のレイヤーを書き出すと、書き出されたファイル名は「rabbit.拡張子」になります。2倍サイズで書き出した際、接尾辞を変更しなければファイル名は「rabbit@2x.拡張子」です。, あとは、書き出す拡張子(JPEG,PNG,GIF,SVG)を選んでから右下の「すべてを書き出し」をクリックし、保存先を指定して書き出すだけ！ 1. Retina対応のWebデザインをするときの注意点。PhotoshopやIllustratorでWebデザインをつくるときの、Retina対応の方法ちゃんとわかっていますか？Retinaってなに？とりあえず2倍でつくればいいの？なんていうWebデザイナーさんの為にRetina対応の方法についてまとめたので見てください。 作業をしていて、参考サイトなどPhotoshop画面外の色を取得したいという時、ありますよね！, わざわざキャプチャをしてPhotoshopに持ってきて色を取ったり、 前回の記事の『Web用に書き出し』の解説でも登場した、『バイキュービック法』ってやつですね。最新のPhotoshopでは『ディティールを保持(拡大)』という新しい項目が追加されています。 ② 今度は解像度を2倍にして書き出します。「Web用に保存」だと、サイズを2倍にして書き出すと画像が劣化してしまいます。そのため、いったん「イメージ」→「解像度」からサイズを2倍にし、「Web用に保存」を開いて等倍で書き出します。 数字だけ見ると「32bit → 64bit」で2倍パワーアップ！？ もし、64bit版が速いなら Windowsをメインマシンにしようかなと考え、32bit版(MacOSX 10.5) と 64bit版(Vista 64bit) のRAW → PSD書き出し速度比 … 「カンバスのサイズ初期設定方法」自分でイチから印刷用データを作る際のコツ、Photoshopを使った印刷用データの作成方法と注意点をご紹介いたします。- 高品質な印刷物を短納期・低価格でご提供。万全のサポート体制で初めての方も安心してご利用いただけます。 Photoshop CC2019、およびCC2018. Copyright © GRANFAIRS inc. All Rights Reserved. PSDと同じ階層に「(PSDファイル名)-assets」フォルダが自動生成され、その中に等倍の「rabbit.png」と2倍サイズの「rabbit@2x.png」の２つの画像が書き出されています。, 比較したところ、どちらも書き出した際のファイルサイズに差はなく、綺麗にサイズ違いの画像を書き出すことができました。 この手間を何とか省エネできないかな？一度で複数のサイズに書き出せたらいいのに…。, ということで！ どちらの書き出し方を選ぶかは、その時々の状況によって使い分けてみると良さそうです。 あとは、書き出す拡張子(jpeg,png,gif,svg)を選んでから右下の「すべてを書き出し」をクリックし、保存先を指定して書き出すだけ！ これだけで、等倍と2倍、2つのサイズの画像が作成できました！ 別の書き出し方もありますので、そちらも見てみましょう。 Photoshopのアートボードの背景を透明にする方法. Photoshopスマートオブジェクト二倍書き出し時にボケる現象と戦う Posted on 2018年3月20日 (2018年3月19日) by ore_new Retina対応するために、Photoshopにてレイヤー名を200% hoge01.jpgとして二倍書き出しを行いましたが、ボケてしまいました。 さらにこの「書き出し形式」ではサイズ「2x」を選ぶ事で、レティーナディスプレイ用画像を2倍に書き出したり、両サイズ一気に書き出したりする事も可能なのだ！ その2：「画像アセット」機能を使い、常に自動で一気に書き出す方法 画像書き出しについては「2x」「3x」と選択をすると、自動で2倍書き出しできるので、一見便利そうですが、書き出す画像をいちいち選択しないと一括書き出しができなかったりするので、photoshopのアセット機能の方が使いやすいと思います。 前回の記事の『Web用に書き出し』の解説でも登場した、『バイキュービック法』ってやつですね。最新のPhotoshopでは『ディティールを保持(拡大)』という新しい項目が追加されています。 MacOS 10.13.6. 第5回「写真をレタッチして、配置しよう」では、PhotoshopでWebデザインを完成させました。今回は、完成したWebデザインから、実際のWebページで使用する画像やCSSコードを生成する方法を解説します。 ※Photoshopは最新版を使用してください（執筆時のバージョンはCC 14.2）。記事では、Mac OS Xを基本に解説しています。ショートカットは、「command（Ctrl）」のように、Windowsの場合を括弧内で表記しています。 非常に大まかに言うと、Webページは「テキスト」と「画像」で構成さ … 再サンプル：自動（初期設定） 再サンプル：ディテールを保持（拡大） / ノイズを軽減20％ 再サンプル：ディテールを保持2.0 / ノイズを軽減20％ 書き出し方法その2 画像アセットの生成編 ... 昨今のRetina対応（高解像度ディスプレイへの対応）、psdデータが2倍のサイズで作られていればいいのですが、2倍サイズのpsdは挙動が重くてデザイナーも嫌います。 ... 対応バージョン：Photoshop CC. さらにこの「書き出し形式」ではサイズ「2x」を選ぶ事で、レティーナディスプレイ用画像を2倍に書き出したり、両サイズ一気に書き出したりする事も可能なのだ！ その2：「画像アセット」機能を使い、常に自動で一気に書き出す方法 Photoshopのスライス作業が不要になる便利なテクニック『画像アセット生成』を使っていますか？「まだ使ったことない」「なんか上手くいかないんだけど」という方に向けて、画像アセット生成の書き出し方などの基礎からよくあるつまずき＆解決法の応用編までをたっぷりと解説します。 2018.04.25. 入社から2か月経ちました。新人のはなたつです。 周りにスーパーマンが多すぎて戦々恐々としている日々です。 Photoshop CCがリリースされてから半年程になりますが、今回は新機能の1つ「画像アセット」を使ってみると中々便利でしたのでご紹介致します。 ブラウザ上だけでなく、デスクトップアイコンの色なども取得できます。 純粋に書き出したい画像のx倍のサイズで書き出せばRetina用の画像を作成することができます。 （「横300px 縦100px」の2倍のRetina画像の場合は「横600px 縦200px」） そりゃそうですね（汗） ですが、 1-2. iPhone Xや最新のAndroidなど、超高精密度の液晶ディスプレイを搭載したデバイスが続々登場しています。サイトの閲覧にもっとも身近である端末・スマホで快適に閲覧できる画像制作の知識はWeb制作者にとって欠かせません。そこでどのようなトレンドがあるか調べてみました。 Photoshopで書き出した画像が鬼サイズになってしまう原因と対処法. 今回は、上図のようにサイズ違いを作ることなく、一度で2倍、3倍など複数のサイズで画像を書き出す方法をご紹介します！, 書き出す対象のフォルダーまたはレイヤーを選択した状態で、 原寸で用意してしまうと、拡大したサイズで書き出した時に画像がぼけてしまいます…！, そして必ずスマートオブジェクトの中身はPSD、PSBにする必要があります。 私はつい最近フォトショップを使い始めたばかりの初心者です。キャプチャした画像が横長で、それを普通の幅に直したいのです。友人に聞いたところ手順は、編集→変形→拡大縮小で調整してみて下さい。ということでやってみたら、編集クリッ 今まで、スライスで画像を書き出す時間が手間でしたが、このツールを知ってから作業のスピードが比べものにならないくらい上がりました！ 皆様も今日から使ってみてください！ 書き出し形式: Webサイトの制作なら「Web」の一択です。 設定サイズ 「1x」と「2x」が選べます。1倍か2倍って意味ですが、1倍を選んでも2倍のキャパがある画像なら2倍の画像も出力されます。特に気にせず「1x」でいいかと思います。 書き出し先 素材の書き出し. Photoshopで書き出した画像が鬼サイズになってしまう原因と対処法. こんにちは！ Photoshopのデザインカンプ上で、スマートオブジェクトを50％以下に縮小しておき、画像アセット生成などで200％にして書き出す手法があります。スマホなどの高解像度ディスプレイ対策としては定番ですね。しかし、ある条件下では、元の画像を50％以下に縮小しているにも関わらず、書き出し後の200％画像がぼけてしまうことがあります。この点について気になったので、少し整理してみました。（2016.4.15／注意点を追記）, スマートオブジェクトは、拡大、縮小を繰り返しても劣化しないというのが特長です。もちろん、オリジナルのサイズより大きくする場合は別ですが、いったん縮小してから再び拡大しても、その都度オリジナルからピクセルを生成しますので、常に最適な画質が保持されるというわけです。, Photoshopでデザインカンプを作るうえで、高解像度ディスプレイ用の画像を書き出す予定があるときは、あらかじめ大きいサイズでスマートオブジェクト化しておき、それを50％以下のサイズにしてレイアウトするのが一般的です。これを200％などに拡大して書き出すことで、簡単に高解像度用の2倍画像が作成できるわけです。このとき、「画像アセットの生成」や「書き出し形式」などの機能を使えば、元画像を自動で200％に拡大しながら書き出すこともできるのでとても便利です。, ここでひとつ注意したい点があります。ドラッグ＆ドロップや“ファイル”→“埋め込みを配置／リンクを配置”でドキュメントに配置した場合、スマートオブジェクトを50％以下に縮小しているにも関わらず、書き出し後の2倍画像が、通常の画像のようにぼけてしまうことがあります。, 一方、同じ方法で配置したスマートオブジェクトを、同じように拡大して書き出してもぼけない場合もあります。ということは、配置のやり方が問題ではなさそうですね。では、ぼける、ぼけないがどういう条件で決まるのでしょうか。, ご存知の方も多いと思いますが、スマートオブジェクトをものすごくざっくりと説明すると、PSDの中に別の画像をまるっと内包する技術です。つまり、内包された画像にも、通常の画像ファイルと同様に画像形式が存在するということです。それは、JPEGであったり、PNGであったり、PSDであったり……とさまざまです。リンクで配置している場合を考えれば、イメージしやすいと思います。, ドラッグ＆ドロップや、“ファイル”→“埋め込みを配置／リンクを配置”で配置したスマートオブジェクトは、オリジナルのファイルと同じ画像形式で保持されます。例えば、JPEGのファイルをドラッグ＆ドロップで配置すれば、そのスマートオブジェクトの中身はJPEGになります。スマートオブジェクトの中身が何の形式になっているかは、［レイヤーパネル］でスマートオブジェクトのレイヤーサムネールをダブルクリックして中身を開き、その画像のファイル名（拡張子）を見ることで判別できます。あるいは、属性パネルでファイル名を確認できる場合もあります。, 外部ファイルを配置する以外にも、レイヤーの画像を直接スマートオブジェクトに変換することもできます。このときの画像形式は、PSB（ビッグドキュメント形式）となります。PSBは、PSDとほぼ同じ特徴を持っています。詳しくは公式のヘルプを参照してください。, ひとつ実験をしてみましょう。JPEG、PNG、PSDの外部ファイルを埋め込み配置したもの、レイヤーを直接スマートオブジェクト化したもの、合計4つのスマートオブジェクトを用意しました。直接変換したもの以外は、すべてドラッグ＆ドロップで配置しています。元の画像サイズは、それぞれ256pixel四方ですが、スマートオブジェクトを50％に縮小して、128pixelのサイズにしています。これらを、画像アセットの生成で、200％に拡大して書き出ししてみましょう。なお、今回実験に使ったPSDは、下記よりダウンロードできるようにしていますので、興味のある方はご自由にお試しください。, まず、画像アセットを生成するためにレイヤー名を変更しましょう。今回は、すべてPNGとして書き出します。200％に拡大するので、レイヤー名を「200% xxx.png」としました。あとは、“ファイル”→“生成”→“画像アセット”を選択し、続けてドキュメントを上書き保存すれば、PSDと同じ階層にアセット用のフォルダが作成され、その中に画像が書き出しされます。, 元がJPEGとPNGのものは、拡大によって画像がぼけています。一方、PSDと直接変換したものは、きれいに拡大されています。つまり、スマートオブジェクトの中身が、Photoshopのネイティブ形式であるPSDとPSBの場合に限り、拡大に対応しているということですね。, スマートオブジェクトにスマートフィルタをかけていてもぼけるので注意。／Photoshopのスマートオブジェクトを拡大して書き出すとぼける現象について - saucer https://t.co/v6O1vLo7eL, 確かに、スマートフィルターが適用されている場合、中身がネイティブ形式でもぼけてしまう現象がありました。フィルター項目を非表示にしていても同様なので、書き出す前にスマートフィルター自体を削除する必要がありそうです。, ちなみに、フィルター自体は50％の画像を等倍として実行されるため、この挙動必然であり仕様と言ってしまっていいでしょう。また、念のため確認しましたが、レイヤー効果はぼけることなく書き出しできるようでした。, 今回の実験で、拡大したスマートオブジェクトによる画像の劣化は、配置方法が原因ではないことがわかりました。すべての形式を試したわけではないので、これ以外にも拡大に対応しているものがあるかも知れませんが、少なくとも、PSDかPSBにしておけば大丈夫だということです。スマートフィルターの適用されていない状態で、中身をPSDかPSBにしておけば大丈夫だということです。このように仕組みを理解しておくことで、意図しない結果が出た時でも、無駄のない対処ができるようになるはずです。重箱の隅をつつくような細かい内容ですが、今回の記事がPhotoshopでWebデザインをされている方の一助になればうれしいです。, Photoshopの書籍（共著）がく発売されました。ベーシックなレタッチや補正から、アートワークの作成、Webサイトのモックアップ作成手順を丁寧に解説しています。これからPhotoshopを始める方には最適な一冊です！ぜひ！, 出版社：ソシム／発売日：2016.2.5／サイズ： [書き出し形式…]ダイアログが開きます。左側のリストには、選択した「im1」「im2」「im3」の3つの画像が表示されています。 左側の「すべてのスケール」には、2倍や3倍、0.5倍などを指定すると、複数の解像度のファイルを一度に書き出せます。 元の写真. IllustratorのWeb書き出しはPhotoshopと比較すると機能的に使いにくいので、まずpsdファイルに書き出します。 ... 144ppiで書き出されたpsdデータは、通常の72ppiと比較すると縦横サイズ（pixel）が2倍 … 2018.11.28. これだけで、等倍と2倍、2つのサイズの画像が作成できました！, 今回は等倍と2倍のサイズで書き出したいので、「rabbit.png,200%rabbit@2x.png」という名前にしました。カンマ（,）で区切ることで複数のサイズや拡張子を指定でき、200%とつけることで2倍サイズで書き出してくれます。, たったこれだけで、 ② 今度は解像度を2倍にして書き出します。「Web用に保存」だと、サイズを2倍にして書き出すと画像が劣化してしまいます。そのため、いったん「イメージ」→「解像度」からサイズを2倍にし、「Web用に保存」を開いて等倍で書き出します。 サイトの表示を0.1秒でも速く！お手軽画像圧縮ソフト Antelope 使ってみた. 素材の書き出し. ぼやけている問題＞ 高dpi向けにはメディアクエリなどの機能で画面解像度に適した出し分けをすることが多いので、最近のcmsでは解像度がデカい画像を入れておいて、あとはcmsにお任せするパターンも増えてきたと思います。 なお、自分でhtmlを書く場合は以下のページが参考になります。 まずは「＋」ボタンを押して、書き出すサイズの種類を追加しましょう。 Photoshopのアセット機能で画像を拡大書き出ししたら、なぜか書き出した画像がボケることありませんか？ある解決方法を見つけたのでその方法をお伝えししたいと思います。 Photoshop（フォトショップ）のレイヤースタイルを登録、書き出しする方法を徹底解説します。スタイルの新規登録、aslファイルの作成方法など、どのサイトよりも分かりやすく解説します。 追加した数だけ、サイズ違いの画像が一度に書き出されます。, 2倍サイズである2xを選ぶと、自動的に接尾辞が@2xになります。（接尾辞は変えることもできます。）, この書き出し形式では、書き出されるファイルの名前は該当のフォルダーまたはレイヤー名を継承します。 読み込み速度への影響を考えると、ホームページに使用する画像はなるべく容量が少ないほうが良いですよね。 Photoshpデータから必要な画像を書き出す方法が知りたい、コーディング案件をWeb制作会社から受注したけどデザインツールは使ったことがない、そういう方に向けて記事を書きました。Photoshopデータからの画像書き出し方法、画像形式種類の違いを説明しています。 IllustratorのWeb書き出しはPhotoshopと比較すると機能的に使いにくいので、まずpsdファイルに書き出します。 ... 144ppiで書き出されたpsdデータは、通常の72ppiと比較すると縦横サイズ（pixel）が2倍 … Photoshop（フォトショップ）のアートボードを使ってサイズの違うバナーを効率的に作る方法について徹底解説します。1つのPSDに複数のアートボードを設定し、GDNやYDN等サイズの違うバナーの作り方を初心者の方にも分かりやすく解説します。 画質も違いは見受けられません。, というわけで… 書き出し形式: Webサイトの制作なら「Web」の一択です。 設定サイズ 「1x」と「2x」が選べます。1倍か2倍って意味ですが、1倍を選んでも2倍のキャパがある画像なら2倍の画像も出力されます。特に気にせず「1x」でいいかと思います。 書き出し先 iPhone Xや最新のAndroidなど、超高精密度の液晶ディスプレイを搭載したデバイスが続々登場しています。サイトの閲覧にもっとも身近である端末・スマホで快適に閲覧できる画像制作の知識はWeb制作者にとって欠かせません。そこでどのようなトレンドがあるか調べてみました。 Photoshopの小さいテクニック. JPEG画質が改善したPhotoshop CC 2015の新方式の画像保存機能まとめ – ICS LAB, モバイル・Web用のデザインや画像を書き出す新しい方法 | Adobe Photoshop CCチュートリアル, Photoshopレッスンブック CC2015/CC2014/CC/CS6/CS5/CS4対応. 2016年11月上旬にベータ版がリリースされたAdobe XD。数々の機能の中からPNG、SVG、PDFファイルのエクスポートが可能な「書き出し」機能の使い方をお伝えします。 WebデザインカンプをPhotoshopで制作した時、コーディングの準備として、psdからjpgやpngなどに書き出しを行う必要がありますが、「画像アセット生成」を使うと正確に効率的に行えます。2倍書き出しの設定なども初期設定で一行追加するだけで一括して設定できるので、かなり便利で … OSもアプリも64bit化し、メモリもストレージも大容量化したこのご時世に、PSD形式のファイルは2GBを突破する事が出来ない。代替のファイル形式は用意されているが、とても使いにくい。 B5変型／ページ：304P／価格：本体2,200円＋税, スマートオブジェクト入門～直しに強いPhotoshopデータを作ろう～ 第1回：劣化知らずの「スマートオブジェクト」, Web用保存は古い!? 元の写真を2倍に拡大して、それぞれ見比べてみます。 ※拡大画像はすべてjpeg（最高画質）で書き出し. スマートオブジェクト入門～直しに強いPhotoshopデータを作ろう～ 第1回：劣化知らずの「スマートオブジェクト」 リンク先の記事では「クイック書き出し」もアクション登録できるような記述ですが、「メニュー項目を挿入」からアクション登録できたのは「書き出し形式」と「Web用に … 使わない手はない！ 私が感じたそれぞれの特徴をまとめてみました。, 冒頭で出た、スライスツールを使った「Web用に保存（従来）」の書き出し機能ですが、1999年からPhotoshopに追加された機能でコードも古いため、この機能自体がなくなる可能性もありますので、今回ご紹介した「書き出し形式」や「画像アセット」などの比較的新しい書き出し方に慣れておくと良さそうですよ…っ！, 考えてみれば当然なのですが、2倍サイズなどに拡大して書き出す場合は、該当するレイヤーの画像は、あらかじめ2倍以上のサイズのものをスマートオブジェクトにし、縮小して配置しておきましょう。 Photoshopで、複数の画像が重なっているデータを編集しているとき、「 この画像だけ切り抜きたい（キャンバスごとは切り抜きたくない） 」ということがよくあります。 そんなときは、以下の手順で一部の画像だけを切り抜きましょう。 このレイヤーから、Photoshop で以下のアセットが生成されます。 Delicious.jpg （120 ％に拡大された 90 ％の画質の JPG 画像） Delicious.png （42 ％に縮小された 24 ビットの PNG 画像） Delicious_2.jpg （絶対サイズ 100x100 px 、画質 90 ％の JPG 画像）