Hareketli grafik sayfası veya doku atlası oluşturun ve mobil uygulamalar ile oyun motorları için animasyonlarınızı dışa aktarın. Eklentiyi kullanarak Unity'ye veya sevdiğiniz oyun motorlarına bir doku atlasını içe aktarın.

Genel bakış

Animate CC, hareketli grafik sayfası veya doku atlası animasyonları oluşturup bunları mobil uygulamalar ve oyun motorları için dışa aktarmanıza olanak sağlar. 

Hareketli Grafik Sayfası

Hareketli grafik sayfası, döşenmiş ızgara düzeninde birkaç daha küçük grafik içeren bitmap görüntü dosyasıdır. Birden fazla grafiği tek bir dosyada derleyerek, yalnızca tek bir dosyanın yüklenmesiyle Animate'in ve diğer uygulamaların grafikleri kullanmasına olanak tanırsınız. Bu yükleme verimliliği, performansın özellikle önemli olduğu oyun geliştirme gibi alanlarda faydalı olabilir.

Hareketli Grafik Sayfası
Hareketli grafikleri kare kare bir animasyonda bulunduran bir hareketli grafik sayfası.

Film kliplerinin, düğme sembollerinin, grafik sembollerinin veya bitmap'lerin herhangi bir kombinasyon seçiminden hareketli grafik sayfası oluşturabilirsiniz. Öğeleri Kütüphane panelinde veya Sahne Alanı'nda seçebilirsiniz, ancak ikisinden aynı anda seçemezsiniz. Seçili sembollerin her bitmap'i ve her karesi, hareketli grafik sayfasında ayrı bir grafik olarak görünür. Sahne Alanı'ndan dışa aktarırsanız, sembol örneğine uyguladığınız tüm dönüştürmeler (örneğin, ölçekleme, eğme vb.) görüntü çıktısında korunur.

Doku atlası

Doku atlası, dokuların tek bir büyük görüntü şeklindeki koleksiyonudur. Oyununuzu doku atlası oluşturarak ve bunu oyun uygulamanızda kullanarak en iyileştirebilirsiniz. 

Animate'te film klipleri, grafikler veya düğmeler gibi sembollerden doku atlası oluşturabilirsiniz. Öğeleri Kütüphane panelinde veya Sahne Alanı'nda seçebilirsiniz, ancak ikisinden aynı anda seçemezsiniz. Seçili sembollerin her vektörü ve her anahtar karesi, doku atlasında ayrı bir bitmap olarak görünür. Sahne Alanı'ndan dışa aktarırsanız, sembol örneğine uyguladığınız tüm dönüştürmeler (örneğin, ölçekleme, eğme vb.) görüntü çıktısında korunur.

Hareketli grafik sayfası ve doku atlası arasındaki farklar

Mobil uygulamalarınızda gereksiniminize göre hareketli grafik sayfası veya doku atlası kullanabilirsiniz. Hareketli grafik sayfası ile doku atlası arasındaki bazı temel farklılıklar aşağıdaki tabloda verilmiştir. 

Özellik Hareketli Grafik Sayfası Doku Atlası
Mobil uygulamalarda performans Düşük Yüksek
Yüklenen uygulamada verimlilik İşlem olmadığı için yüksek JSON dosya işlemi olduğu için düşük 
Boyut Daha fazla alan kaplıyor Daha az alan kaplıyor
Animasyonun kalitesi Orta Yüksek
Oluşturulan dosya sayısı İki dosya: bir bitmap ve bir json Üç dosya: bir bitmap ve iki json dosyası
Oluşturulan bitmap sayısı Hareketli grafik sayfasında kullanılan kare sayısına göre bitmap dosyalarının sayısı artabilir, bu da hareketli grafik sayfası boyutunun artmasına yol açar Hareketli grafikte yalnızca benzersiz bitmapler oluşturulur, böylece toplam boyut azaltılır.

Hareketli grafik sayfası oluşturma

Hareketli grafik sayfası oluşturmak için şu adımları uygulayın: 

  1. Kütüphane'de bir veya daha fazla sembol ya da Sahne Alanı'nda sembol örnekleri seçin. Seçim bitmap de içerebilir.

  2. Seçimi sağ tıklatın ve Grafik Sayfası Oluştur'u seçin.

    generate-spritesheet
  3. Hareketli Grafik Sayfası Oluştur iletişim kutusunda, gerekli seçenekleri belirleyin ve ardından Dışa Aktar'ı tıklatın.

    Dışa Aktar seçeneği Açıklama
    Görüntü boyutu Hareketli grafik sayfasının piksel cinsinden toplam boyutu. Varsayılan ayar, eklediğiniz tüm hareketli grafikleri sığdıracak şekilde sayfayı boyutlandıran Otomatik Boyut ayarıdır.
    Görüntü biçimi Dışa aktarılan hareketli grafik sayfasının dosya biçimi. PNG 8 bit ve PNG 32 bit, saydam bir arka plan (alfa kanalı) kullanarak destekler. PNG 24 bit ve JPG saydam arka planları desteklemez. Genel olarak, PNG 8 bit ve PNG 32 bit arasındaki görsel farklılık çok azdır. PNG 32 bit dosyaları, 8 bit PNG dosyalarından dört kat daha büyüktür.
    Kenarlık Dolgusu Hareketli grafik sayfasının kenarlarının etrafındaki dolgu (piksel cinsinden).
    Şekil Dolgusu Hareketli grafik sayfasındaki her bir görüntünün arasındaki dolgu (piksel cinsinden).
    Algoritma

    Görüntüleri hareketli grafik sayfasında paketlemek için kullanılan teknik. İki seçenek vardır:

    • Temel (varsayılan)
    • MaxRects
    Veri Biçimi Görüntü verisi için kullanılan dahili biçim. Dışa aktarmadan sonra istediğiniz hareketli grafik sayfası iş akışına en iyi şekilde uyan biçimi seçin.
    Döndür Hareketli grafikleri 90° döndürür. Bu seçenek yalnızca bazı veri biçimleri için kullanılabilir.
    Kes Bu seçenek, sayfaya eklenen her sembol karesindeki kullanılmayan pikselleri keserek hareketli grafik sayfasında yer tasarrufu yapar.
    Kareleri Yığınlama Bu seçeneğin belirlenmesi, seçili sembollerdeki aynı karelerin sonuç olarak ortaya çıkan hareketli grafik sayfasında çoğaltılmasını engeller.

Mobil uygulamalar için hareketli grafik sayfası animasyonunu dışa aktarma

Mobil uygulamalar için hareketli grafik sayfası animasyonunu dışa aktarma
Train Simple - Matthew Pizzi

Doku atlası oluşturma

Oyun geliştiricileri, Animate'i animasyonları düzenleyip Unity oyun motoruna veya diğer sevilen oyun platformlarından birine Doku atlası olarak dışa aktarmak için kullanabilir. 

Animate'te doku atlası oluşturma ve bu atlası Unity'ye içe aktarma süreçleri aşağıdaki şemada tasvir edilmiştir: 

flow-diagram-Texture-Atlas
Doku atlası oluşturmaya ve bunu Unity'ye içe aktarmaya yönelik iş akışını gösteren bir çizim.

Animasyonunuz için doku atlası oluşturmak üzere aşağıdaki adımları uygulayın: 

  1. Animate'te Kütüphane'den seçilen bir sembol veya sahne alanından sembol örneği için doku atlası oluşturabilirsiniz. 

  2. Sembolü sağ tıklatın ve menüden Doku Atlası Oluştur seçeneğini belirleyin. Doku Atlası Oluştur penceresi görünür. 

    generate-texture-atlas (2)
    Doku atlası oluşturma
  3. Doku atlası için uygun dışa aktarma seçeneklerini belirleyin. 

    Dışa Aktar seçeneği Açıklama
    Görüntü boyutu Doku atlasının piksel cinsinden toplam boyutu. Varsayılan ayar, eklediğiniz tüm görüntüleri sığdıracak şekilde sayfayı boyutlandıran Otomatik Boyut ayarıdır.
    Görüntü biçimi Dışa aktarılan hareketli grafik sayfasının dosya biçimi. PNG 8 bit ve PNG 32 bit, saydam bir arka plan (alfa kanalı) kullanarak destekler. Genel olarak, PNG 8 bit ve PNG 32 bit arasındaki görsel farklılık çok azdır. PNG 32 bit dosyaları, 8 bit PNG dosyalarından dört kat daha büyüktür.
    Kenarlık Dolgusu Doku atlasının kenarlarının etrafındaki dolgu (piksel cinsinden)
    Şekil Dolgusu Doku atlasındaki her bir görüntünün arasındaki dolgu (piksel cinsinden).
    Algoritma

    Görüntüleri doku atlasında paketlemek için kullanılan teknik. İki seçenek vardır:

    • Temel (varsayılan)
    • MaxRects
    Veri Biçimi Görüntü verisi için kullanılan dahili biçim. Varsayılan biçim JSON biçimidir.
    Döndür Görüntüleri 90° derece döndürür. Bu seçenek yalnızca bazı veri biçimleri için kullanılabilir.
    Eğriltilmiş nesneleri bitmap'e düzleştir Nesneleriniz için eğim dönüştürmeleri kullanıyorsanız bu seçeneği belirleyin. Bazı oyun motorları eğim dönüştürmelerini yorumlayamadığından Animate bu nesneleri bitmap görüntülerine dönüştürür. 
  4. Doku atlası çıktısını önizlemek için Önizleme sekmesini tıklatın.

    texture-atlas-preview
    Oluşturduktan sonra doku atlası önizlemesi
  5. Gözat seçeneğini tıklatıp çıktı dosyası için bilgisayarınızdaki hedef yolunu seçin veya metin alanına yolu girip Dışa Aktar'ı tıklatın. 

Doku atlası için oluşturulan çıktı klasörü şu dosyaları içerir:

Animation.json

Bu dosya Animasyon hakkındaki bilgileri içerir. 

spritemap.json

Bu dosya, spritesheet.png dosyası hakkındaki bilgileri içerir.

spritemap.png

Bu dosya, dışa aktarılan sembol için animasyonu yeniden oluşturmak üzere gereken minimum benzersiz dokuların tümünün Bitmap gösterimini içerir.

Oluşturulan doku atlasını Unity gibi uygun içe aktarıcı eklentisini içeren tüm oyun motorlarında kullanabilirsiniz.

Doku atlasını Unity'ye içe aktarma

Animate'te oluşturulan doku atlası dosyalarınızı sevilen oyun motorlarına içe aktarabilirsiniz. Doku atlası dosyalarını içe aktarmak için oyun motorlarınıza uygun eklentiler oluşturabilirsiniz. Unity aracı için örnek bir içe aktarma eklentisi sağlanır. 

Şu adımları uygulayarak doku atlasını Unity'ye içe aktarın:

  1. Unity'de, belirli herhangi bir konumda bir proje oluşturun. Bu konumda, içinde Varlıklar alt klasörünü içeren bir klasör oluşturulur. 

  2. Varlıklar altında Kaynaklar ve Düzenleyici olarak iki alt klasör oluşturun. 

  3. Unity için örnek içe aktarma eklentisini indirmek üzere burayı tıklatın. İndirilenler sekmesinden Unity Plugin seçeneğini belirleyin ve indirilecek ilgili sürümü seçin. 

    unity-plugin.zip; Plugin.cs, WrapperPlugin.cs, AnimateEditor.cs ve Effect.shader dosyalarından oluşur.

    Örneği indirerek Kullanım Koşulları'nı ve Çevrimiçi Gizlilik İlkesi'ni kabul etmiş olursunuz. 

  4. Animation.json, spritemap.json, spritemap.png gibi doku atlası dosyalarını ve Plugin.cs ile Effect.shader gibi Unity eklenti dosyalarını Varlıklar > Kaynaklar yoluna taşıyın.

  5. AnimateEditor.cs ve WrapperPlugin.cs dosyalarını Varlıklar klasörüne taşıyın. 

  6. Unity'de, AnimateEditor.cs dosyasını tıklatın ve bunu Ana Kamera'ya sürükleyin.

  7. Oynatın. Projeyi oynatmak, spritemap öğesini farklı hareketli grafiklere böler.

  8. AnimateEditor.cs öğesini Düzenleyici klasörüne taşıyın.

  9. Unity'de, WrapperPlugin.cs dosyasını tıklatın ve Ana Kamera'ya sürükleyin. Ayrıca, Ana Kamera öğesinden AnimateEditor.cs seçimini kaldırın veya öğesini çıkarın.

  10. Çıktıyı ihtiyaçlarınıza uygun şekilde oynatın veya yayınlayın. 

WrapperPlugin.cs dosyasını ihtiyaçlarınıza uygun şekilde değiştirerek eklentiyi bile özelleştirebilirsiniz. 

Unity eklentisi, Animate tarafından oluşturulan doku atlası dosyaları için renk efektlerini destekler. Ayrıca, eklenti katmanlar boyunca maskelemeyi de destekler. Maskeleme özelliği yalnızca Unity 2017 sürümünden itibaren geçerlidir. 

Doku yayımlama

Animasyoncu olarak vektör formatında içerik oluşturmaya devam edip içeriği HTML 5 platformları için vektör veya raster formatında dışa aktarabilirsiniz. Animasyonların performansını iyileştirmek için yayımlama ayarlarına animasyonları bir doku atlası olarak dışa aktarma seçeneği eklendi.

Dosya > Yayımlama Ayarları seçeneklerini tıklatın.Belgeyi doku olarak dışa aktar seçeneği Temel sekmesinde etkinleştirilmişse Görüntü Ayarları sekmeside Doku Yayımlama seçenekleri görüntülenir. Varsayılan olarak, tüm semboller Doku yayımlamaya dahildir. Dokular için ayrı ayrı sembol seçmek üzere yanındaki ayarlar simgesini tıklatın. 

Bu seçenek varlıkların boyutunu artırabilir ancak performansı geliştirir. Ayrıca, HiDPI ekranları için görüntülerin çözünürlüklerini orijinal görüntü çözünürlüklerinin 2 ve 3 katı kadar artırabilirsiniz. Çözünürlük ayarlarını değiştirmek için aşağıdaki ekran görüntüsünde gösterilen şekilde Belgeyi doku olarak dışa aktar seçeneğinin yanındaki anahtar simgesini tıklatın. 2 ve 3 katını elde etmek için sayıları Çözünürlük kısmına sürükleyin.

Varsayılan olarak, doku yayımlama 2 kat çözünürlükte ayarlıdır. Ayrıca, çözünürlük aralığı 0,3'ten 3 katına değiştirilebilir.

Not:

Doku yayımlama, yalnızca HTML5 Canvas belgesi türüne yöneliktir. 

Belgeyi doku olarak dışa aktarma
Belgeyi doku olarak dışa aktarma

Vektör veya raster dosyası seçme, dosya türleri ve performans arasında seçim yapmak gibidir. HTML5 platformları, raster içeriği için optimize edilir. Dolayısıyla bazı karmaşık şekiller için vektör görüntülerini önceden raster'e dönüştürmek daha iyidir. Bazı temel içerikler için yine de vektör içeriği kullanabilirsiniz. Animate'te bu seçeneğe kısmi sembol seçimi iletişim kutusundan erişebilirsiniz. Kısmi sembol seçimi, raster'e dönüştürülmesi gereken sembolleri seçerken geri kalanları vektör olarak tutmanıza olanak sağlar.

Kısmi sembol seçimini açın ve Yayınlama ayarları iletişim kutusundaDeğiştir'i tıklatıp listeden bir sembol seçin. Varsayılan olarak tüm semboller seçilir.

Kısmi sembol seçimini değiştirme
Kısmi sembol seçimini değiştirme

İstediğiniz sembolü listeden seçin. 

Kısmi sembol seçimi
Kısmi sembol seçimi

Doku yayımlama hakkında bir eğitim

Doku yayımlama hakkında bir eğitim
Esneklik ve doğruluk için vektörleri kullanarak varlıklarınızı oluşturmayı ve ardından bitmap dokuları olarak yayınlamayı öğrenin.

Bu çalışma Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License kapsamında lisanslanmıştır  Creative Commons şartları, Twitter™ ve Facebook sitelerinde paylaşılanları kapsamaz.

Yasal Uyarılar   |   Çevrimiçi Gizlilik İlkesi