User Guide Cancel

Extract assets

  1. Panduan Pengguna Photoshop
  2. Pengantar Photoshop
    1. Bermimpi. Wujudkan.
    2. Yang baru di Photoshop
    3. Edit foto pertama Anda
    4. Buat dokumen
    5. Photoshop | Pertanyaan Umum
    6. Persyaratan sistem Photoshop
    7. Berkenalan dengan Photoshop
    8. Selalu perbarui Photoshop
  3. Photoshop dan produk serta layanan Adobe lainnya
    1. Bekerja dengan karya seni Illustrator di Photoshop
    2. Bekerja dengan file Photoshop di InDesign
    3. Materi Substance 3D untuk Photoshop
    4. Menggunakan ekstensi Capture dalam aplikasi di Photoshop
  4. Photoshop di perangkat seluler (tidak tersedia di Tiongkok daratan)
    1. Panduan pengguna
    2. Yang Baru 
    3. Persyaratan teknis    
  5. Photoshop di iPad (tidak tersedia di Tiongkok daratan)
    1. Photoshop di iPad | Pertanyaan umum
    2. Berkenalan dengan ruang kerja
    3. Persyaratan sistem | Photoshop di iPad
    4. Membuat, membuka, dan mengekspor dokumen
    5. Menambahkan foto
    6. Bekerja dengan lapisan
    7. Menggambar dan melukis dengan kuas
    8. Membuat seleksi dan menambahkan mask
    9. Memoles komposit Anda
    10. Bekerja dengan lapisan penyesuaian
    11. Menyesuaikan tonalitas komposit Anda dengan kurva
    12. Menerapkan operasi transformasi
    13. Memangkas dan memutar komposit Anda
    14. Memutar, menggeser, men-zoom, dan mereset kanvas
    15. Bekerja dengan lapisan Ketikan
    16. Bekerja dengan Photoshop dan Lightroom
    17. Mendapatkan font yang hilang di Photoshop di iPad
    18. Teks Bahasa Jepang di Photoshop di iPad
    19. Mengelola pengaturan aplikasi
    20. Pintasan sentuh dan gestur
    21. Pintasan keyboard
    22. Mengedit ukuran gambar Anda
    23. Livestream saat Anda berkarya di Photoshop di iPad
    24. Mengoreksi imperfeksi dengan Kuas Reparasi
    25. Membuat kuas di Capture dan menggunakan di Photoshop di iPad
    26. Bekerja dengan file Camera Raw
    27. Berkreasi dan bekerja dengan Objek Cerdas
    28. Menyesuaikan eksposur dalam gambar Anda dengan Pencerah dan Penggelap
    29. Perintah penyesuaian otomatis di Photoshop di iPad
    30. Mencoreng area dalam gambar Anda dengan Photoshop di iPad
    31. Menambah atau mengurangi saturasi gambar Anda menggunakan alat Spons
    32. Isian berdasarkan konten untuk iPad
  6. Photoshop di web (tidak tersedia di Tiongkok daratan)
    1. Panduan pengguna
    2. Yang baru di Photoshop
    3. Persyaratan teknis
    4. Pertanyaan umum
    5. Menggambar dan mengedit Bentuk
    6. Bekerja dengan siapa saja di web
  7. Photoshop (beta) (tidak tersedia di Tiongkok daratan)
    1. Mulai menggunakan aplikasi Creative Cloud Beta
    2. Photoshop (beta) di desktop
    3. Gambar Referensi
  8. AI generatif (tidak tersedia di Tiongkok daratan) 
    1. Pertanyaan umum tentang AI generatif di Photoshop
    2. Isian Generatif di Photoshop di desktop
    3. Menghasilkan Gambar dengan prompt teks deskriptif
    4. Perluasan Generatif di Photoshop di desktop
    5. Mengganti latar belakang dengan Generasikan latar belakang
    6. Mendapatkan variasi baru dengan Hasilkan yang Serupa
    7. Isian Generatif di Photoshop di iPad
    8. Perluasan Generatif di Photoshop di iPad
    9. Fitur AI generatif di Photoshop di web
  9. Autentisitas konten (tidak tersedia di Tiongkok daratan)
    1. Content credentials di Photoshop
    2. Identitas dan asal-usul untuk NFT
    3. Menghubungkan akun untuk atribusi kreatif
  10. Dokumen Cloud (tidak tersedia di Tiongkok daratan)
    1. Dokumen cloud Photoshop | Pertanyaan umum
    2. Dokumen cloud Photoshop | Pertanyaan alur kerja
    3. Mengelola dan bekerja dengan dokumen cloud di Photoshop
    4. Memutakhirkan penyimpanan cloud untuk Photoshop
    5. Tidak dapat membuat atau menyimpan dokumen cloud
    6. Mengatasi kesalahan dokumen cloud Photoshop
    7. Mengumpulkan log sinkronisasi dokumen cloud
    8. Mengundang orang lain untuk mengedit dokumen cloud Anda
    9. Membagikan file dan memberi komentar dalam aplikasi
  11. Ruang Kerja
    1. Dasar-dasar ruang kerja
    2. Preferensi
    3. Belajar lebih cepat dengan Panel Temukan Photoshop
    4. Membuat dokumen
    5. Menempatkan file
    6. Pintasan keyboard default
    7. Kustomisasi pintasan keyboard
    8. Galeri alat
    9. Preferensi performa
    10. Bar Tugas Kontekstual
    11. Menggunakan alat
    12. Preset
    13. Kisi-kisi dan garis bantu
    14. Gestur sentuh
    15. Menggunakan Bar Sentuh dengan Photoshop
    16. Kemampuan sentuh dan ruang kerja yang dapat disesuaikan
    17. Pratinjau teknologi
    18. Metadata dan catatan
    19. Menempatkan gambar Photoshop di aplikasi lain
    20. Penggaris
    21. Menampilkan atau menyembunyikan Ekstra non-cetak
    22. Menentukan kolom untuk gambar
    23. Urungkan dan riwayat
    24. Panel dan menu
    25. Menempatkan elemen dengan pengaitan
    26. Menempatkan dengan alat Penggaris
  12. Dasar-dasar warna dan gambar
    1. Cara mengubah ukuran gambar
    2. Bekerja dengan gambar raster dan vektor
    3. Ukuran dan resolusi gambar
    4. Mendapatkan gambar dari kamera dan pemindai
    5. Membuat, membuka, dan mengimpor gambar
    6. Melihat gambar
    7. Kesalahan Penanda JPEG tidak valid | Membuka gambar
    8. Melihat banyak gambar sekaligus
    9. Menyesuaikan pemilih warna dan contoh warna
    10. Gambar high dynamic range
    11. Mencocokkan warna dalam gambar Anda
    12. Konversi antar-mode warna
    13. Mode warna
    14. Menghapus bagian gambar
    15. Mode campuran warna
    16. Memilih warna
    17. Menyesuaikan tabel warna terindeks
    18. Informasi gambar
    19. Filter distorsi tidak tersedia
    20. Tentang warna
    21. Penyesuaian warna dan monokrom menggunakan saluran
    22. Memilih warna di panel warna dan contoh warna
    23. Sampel
    24. Mode Warna atau mode Gambar
    25. Semburat warna
    26. Menambahkan perubahan mode bersyarat ke tindakan
    27. Menambahkan contoh warna dari HTML CSS dan SVG
    28. Kedalaman bit dan preferensi
  13. Lapisan
    1. Dasar-dasar lapisan
    2. Pengeditan non- destruktif
    3. Membuat dan mengelola lapisan dan grup
    4. Memilih, mengelompokkan, dan menautkan lapisan
    5. Menempatkan gambar ke dalam bingkai
    6. Opasitas lapisan dan campuran warna
    7. Lapisan mask
    8. Menerapkan Filter Cerdas
    9. Komp lapisan
    10. Memindahkan, menumpuk, dan mengunci lapisan
    11. Lapisan mask dengan mask vektor
    12. Mengelola lapisan dan grup
    13. Efek lapisan dan gaya
    14. Mengedit mask lapisan
    15. Mengekstraksi aset
    16. Menampilkan lapisan dengan mask pemotongan
    17. Menghasilkan aset gambar dari lapisan
    18. Bekerja dengan Objek Cerdas
    19. Mode campuran warna
    20. Menggabungkan beberapa gambar ke dalam potret grup
    21. Menggabungkan gambar dengan Campur Warna Lapisan Secara Otomatis
    22. Menyejajarkan dan mendistribusikan lapisan
    23. Menyalin CSS dari lapisan
    24. Memuat seleksi dari batas lapisan atau mask lapisan
    25. Knockout untuk memunculkan konten dari lapisan lain
  14. Seleksi
    1. Mulai menggunakan seleksi
    2. Membuat seleksi dalam komposit Anda
    3. Pilih dan Mask ruang kerja
    4. Memilih dengan alat seleksi
    5. Memilih dengan alat laso
    6. Menyesuaikan seleksi piksel
    7. Memindahkan, menyalin, dan menghapus piksel yang dipilih
    8. Membuat mask cepat sementara
    9. Memilih rentang warna dalam gambar
    10. Mengonversi antara jalur dan batas seleksi
    11. Dasar-dasar saluran
    12. Menyimpan seleksi dan mask saluran alfa
    13. Memilih area gambar dalam fokus
    14. Menduplikasi, membagi, dan menggabungkan saluran
    15. Kalkulasi saluran
  15. Penyesuaian gambar
    1. Mengganti warna objek
    2. Warp perspektif
    3. Mengurangi blur goyangan kamera
    4. Contoh kuas reparasi
    5. Mengekspor tabel pencarian warna
    6. Menyesuaikan ketajaman dan blur gambar
    7. Memahami penyesuaian warna
    8. Menerapkan penyesuaian Kecerahan/Kontras
    9. Menyesuaikan detail bayangan dan sorotan
    10. Penyesuaian level
    11. Menyesuaikan rona dan saturasi
    12. Menyesuaikan vibrance
    13. Menyesuaikan saturasi warna di area gambar
    14. Melakukan penyesuaian tonal cepat
    15. Menerapkan efek warna khusus ke gambar
    16. Menyempurnakan gambar Anda dengan penyesuaian keseimbangan warna
    17. Gambar high dynamic range
    18. Melihat histogram dan nilai piksel
    19. Mencocokkan warna dalam gambar Anda
    20. Memangkas dan meluruskan foto
    21. Mengonversi gambar berwarna menjadi hitam dan putih
    22. Penyesuaian dan lapisan isian
    23. Penyesuaian kurva
    24. Mode campuran warna
    25. Gambar target untuk ditekan
    26. Menyesuaikan warna dan rona dengan eyedropper Level dan Kurva
    27. Menyesuaikan eksposur HDR dan peronaan
    28. Mencerahkan atau menggelapkan area gambar
    29. Membuat penyesuaian warna selektif
  16. Adobe Camera Raw
    1. Persyaratan sistem Camera Raw
    2. Yang baru di Camera Raw
    3. Pengantar Camera Raw
    4. Membuat panorama
    5. Lensa yang didukung
    6. Membuat penyesuaian warna dan rona di Camera Raw
    7. Efek vinyet, grain, dan kabut di Camera Raw
    8. Pintasan keyboard default
    9. Koreksi perspektif otomatis pada Camera Raw
    10. Filter Radial di Camera Raw
    11. Pengaturan Camera Raw
    12. Membuka, memproses, dan menyimpan gambar di Camera Raw
    13. Memperbaiki gambar dengan alat Penghilangan Spot yang Disempurnakan di Camera Raw
    14. Memutar, memangkas, dan menesuaikan gambar
    15. Menyesuaikan rendering warna di Camera Raw
    16. Memproses versi di Camera Raw
    17. Membuat penyesuaian lokal di Camera Raw
    18. Menghilangkan orang-orang yang tidak diinginkan
    19. Hilangkan pantulan
    20. Lihat Status Edit AI dan kelola pembaruan
  17. Perbaikan dan restorasi gambar
    1. Alat Penghilang
    2. Menghilangkan objek dari foto Anda dengan Isian Berdasarkan Konten
    3. Tambalan dan Geser Berdasarkan Konten
    4. Memoles dan memperbaiki foto
    5. Koreksi distorsi dan noise gambar
    6. Langkah-langkah pemecahan masalah dasar untuk memperbaiki sebagian besar masalah
  18. Penyempurnaan dan transformasi gambar
    1. Mengganti langit dalam gambar Anda
    2. Mentransformasikan objek
    3. Menyesuaikan pemangkasan, rotasi, dan ukuran kanvas
    4. Cara memangkas dan meluruskan foto
    5. Membuat dan mengedit gambar panorama
    6. Membungkus gambar, bentuk, dan jalur
    7. Titik Lenyap
    8. Penskalaan berdasarkan konten
    9. Mentransformasikan gambar, bentuk, dan jalur
  19. Menggambar dan melukis
    1. Melukis pola simetris
    2. Menggambar persegi panjang dan memodifikasi opsi goresan
    3. Tentang menggambar
    4. Menggambar dan mengedit bentuk
    5. Alat melukis
    6. Membuat dan memodifikasi kuas
    7. Mode campuran warna
    8. Menambahkan warna ke jalur
    9. Mengedit jalur
    10. Melukis dengan Kuas Pencampur
    11. Preset kuas
    12. Gradasi
    13. Interpolasi gradasi
    14. Seleksi, lapisan, serta jalur isian dan goresan
    15. Menggambar dengan alat Pena
    16. Membuat pola
    17. Membuat pola menggunakan Pembuat Pola
    18. Mengelola jalur
    19. Mengelola pustaka pola dan preset
    20. Menggambar atau melukis dengan tablet grafis
    21. Membuat kuas bertekstur
    22. Menambahkan elemen dinamis ke kuas
    23. Gradasi
    24. Melukis goresan bergaya dengan Kuas Riwayat Seni
    25. Melukis dengan pola
    26. Menyinkronkan preset di beberapa perangkat
    27. Memigrasikan preset, tindakan, dan pengaturan
  20. Teks
    1. Menambahkan dan mengedit teks
    2. Unified Text Engine
    3. Bekerja dengan font OpenType SVG
    4. Memformat karakter
    5. Memformat paragraf
    6. Cara membuat efek ketikan
    7. Mengedit teks
    8. Jarak garis dan karakter
    9. Ketikan Arabic dan Hebrew
    10. Font
    11. Memecahkan masalah font
    12. Ketikan Asia
    13. Membuat ketikan
  21. Filter dan efek
    1. Menggunakan Galeri Blur
    2. Dasar-dasar filter
    3. Referensi efek filter
    4. Menambahkan Efek Pencahayaan
    5. Menggunakan filter Sudut Lebar Adaptif
    6. Menggunakan filter Cat Minyak
    7. Menggunakan filter Likuifikasi
    8. Efek lapisan dan gaya
    9. Menerapkan filter tertentu
    10. Mencoreng area gambar
  22. Menyimpan dan mengekspor
    1. Menyimpan file Anda di Photoshop
    2. Mengekspor file Anda di Photoshop
    3. Format file yang didukung
    4. Menyimpan file dalam format grafis
    5. Memindahkan desain antara Photoshop dan Illustrator
    6. Menyimpan dan mengekspor video dan animasi
    7. Menyimpan file PDF
    8. Proteksi hak cipta Digimarc
  23. Manajemen Warna
    1. Memahami manajemen warna
    2. Menjaga warna tetap konsisten
    3. Pengaturan warna
    4. Duotone
    5. Bekerja dengan profil warna
    6. Mengelola warna dalam dokumen untuk tampilan online
    7. Mengelola warna dalam dokumen saat mencetak
    8. Mengelola warna dalam gambar yang diimpor
    9. Proofing warna
  24. Desain aplikasi, web, dan layar
    1. Photoshop untuk desain
    2. Lembar kerja
    3. Pratinjau Perangkat
    4. Menyalin CSS dari lapisan
    5. Halaman web irisan
    6. Opsi HTML untuk irisan
    7. Mengubah tata letak irisan
    8. Bekerja dengan grafis web
    9. Membuat galeri foto web
  25. Video dan animasi
    1. Pengeditan video di Photoshop
    2. Mengedit lapisan video dan animasi
    3. Gambaran umum video dan animasi
    4. Pratinjau video dan animasi
    5. Melukis bingkai di lapisan video
    6. Mengimpor file video dan rangkaian gambar
    7. Membuat animasi bingkai
    8. Animasi 3D Creative Cloud (Pratinjau)
    9. Membuat animasi timeline
    10. Membuat gambar untuk video
  26. Mencetak
    1. Mencetak objek 3D
    2. Mencetak dari Photoshop
    3. Mencetak dengan menajemen warna
    4. Lembar Kontak dan Presentasi PDF
    5. Mencetak foto dalam tata letak paket gambar
    6. Mencetak warna spot
    7. Mencetak gambar ke mesin cetak komersial
    8. Meningkatkan kualitas cetakan warna dari Photoshop
    9. Memecahkan masalah pencetakan | Photoshop
  27. Otomatisasi
    1. Membuat tindakan
    2. Membuat grafik berbasis data
    3. Pembuatan skrip
    4. Memproses batch file
    5. Memutar dan mengelola tindakan
    6. Menambahkan tindakan bersyarat
    7. Tentang tindakan dan panel Tindakan
    8. Alat Rekam dalam tindakan
    9. Menambahkan perubahan mode bersyarat ke tindakan
    10. Kit alat Photoshop UI untuk plug-in dan skrip
  28. Pemecahan masalah
    1. Masalah yang diperbaiki 
    2. Masalah yang diketahui
    3. Mengoptimalkan performa Photoshop
    4. Pemecahan masalah dasar
    5. Memecahkan masalah kerusakan atau macet
    6. Memecahkan masalah program
    7. Memecahkan masalah kesalahan gores disk penuh
    8. Memecahkan masalah driver grafis dan GPU
    9. Menemukan alat yang hilang
    10. Photoshop 3D | Pertanyaan umum seputar fitur yang dihentikan

As of the 2015 release of Photoshop CC, extract assets functionality is no longer available in the form described in this article. More intuitive functionality to export artboards, layers, layer groups, and documents as image assets has been introduced in Photoshop.

For details of these newer export options, see Export artboards, layers, and more.

Extract Assets is a feature in Photoshop CC (2014) and earlier that provides an interface on top of Adobe Generator to extract assets quickly for web and screen design from Photoshop files. You can select layers or layer groups in Photoshop and use a graphical user interface to extract them as JPG, PNG, SVG, or GIF image assets.

With Extract Assets you can:

  • Extract a layer or a layer group from a PSD into one or more image assets
  • Create image assets that are PNG, JPG, GIF, or SVG
  • Set up 1x, 2x, or more versions of all image assets
  • Preview each image asset
  • Easily extract assets into your preferred folder
  • Ensure that the extracted assets are updated whenever the PSD changes

Extract layers or layer groups

When multiple layers or layer groups are selected for extraction, you are presented with options to generate a separate asset from each of the selected items.

  1. Select one or more layers or layer groups.
  2. Do one of the following:
  • Right-click the selected items and then select Extract Assets from the context menu.
  • Press the Cmd+Opt+Shift+W (Mac) or Ctrl+Alt+Shift+W (Windows) keyboard shortcut.
  • Select File > Extract Assets.
Note

Extract Assets honors layer names that conform with the Photoshop Generator syntax. For example, if you try to extract an asset from a layer named layer.gif, the Extract Assets dialog displays GIF as the default format for the image asset.  

  1. In the Extract Assets dialog, specify the following settings for each asset that you want to generate:

    Asset format:
    Select PNG-8, PNG-24, PNG-32, GIF, JPG, or SVG.
    Quality scaling:
    For JPEG assets, you can specify a value from 0–100% to scale the quality of the asset. Adjust the slider in the appropriate direction.
  1. To extract more than one version of the asset, click the + icon next to the asset in the Extract Assets dialog. You can specify different format, quality, and scaling parameters for each asset.
  2. Click Extract.
  3. Photoshop notifies you that it requires a change in layer name to continue with the asset extraction. This is because Photoshop uses the underlying Generator framework to create assets through the Generator syntax. Click OK to continue with extracting assets.
  4. Navigate to the folder where you want to save the generated assets.
  5. Click Extract. Photoshop creates the image assets and opens their containing folder in the Finder (Mac) or Windows Explorer. In the process of creating the assets, the relevant layers are automatically renamed in accordance with the Photoshop Generator syntax.
Note

Layers/layer groups that you extract as image assets are displayed in the Extract Assets dialog the next time you invoke image asset extraction functionality.  

Specify asset resolutions

You can specify extraction settings and create assets for different purposes using a number of pre-populated setting combinations. For example, you can generate assets for Retina displays. Any settings that you specify are applied document-wide.

  1. Specify one or more resolutions you want in the Extract Assets section on the right.
  2. If you want a resolution that is not listed, or to change the destination subfolder for assets to be extracted at different resolutions, click Settings.
  3. You can either use the default suffixes for each resolution or add your own.
  4. You can also choose to use the default subfolders for each resolution or specify a different subfolder name that you prefer.
  5. Clicking Done in the Extract Assets dialog saves these settings to the document. Whenever you next create assets, the same settings are used. All future assets are created for the resolutions you have chosen when the document is opened in any instance of Photoshop CC.

Automatically generate assets

If necessary, you can select the Automatically Generate Assets While Updating Document option. This option is synchronized with the Generate > Image Assets option for Photoshop Generator. When you enable the Extract Assets option, the Generator option is also automatically enabled.

Share with developers

  1. Save your PSD file to the Creative Cloud folder you synchronized with Creative Cloud.
  2. Open Extract Assets (File > Extract Assets) and add the assets you want. Click Extract and choose the default folder to save to.
  3. When you open the PSD in Creative Cloud, you will now be able to view your Photoshop file along with a list of assets you have extracted.
  4. You can now share your PSD and the assets you have created with developers you want to collaborate with through Creative Cloud.

Common errors

Layers that are empty or are not capable of rendering images cannot be rendered in Extract Assets dialog. These layers can be Clipping Masks, Adjustment Layers, or just layers that have no pixels in them.

If you have layers with the same name but split across different groups, they are likely to overwrite each other because assets are usually rendered into one single directory. To prevent this, Photoshop automatically rename a layer when we detect a conflict.

If you override the renaming, you receive this error to prevent you from overwriting an existing asset with the name you have chosen.

If your asset names contain invalid characters, you also receive this error. Rename the file without the invalid characters to resolve the issue.

Extract was unable to render the image because it bleeds off the canvas. Move the image so that it fits within the canvas.

This error occurs if Adobe Generator stops responding while the Extract Assets dialog box is open. To fix it, click Done to close the Extract Assets dialog, save your file, and then restart Photoshop.

Dapatkan bantuan lebih cepat dan lebih mudah

Pengguna baru?