PerfectVector
Yazan Irene Kim9 dk okuma

Unreal Engine SVG içe aktarımı: Geometri kontrolü

Unreal Engine Motion Design için SVG hazırlayın, iç boşlukları ve ayrı parçaları inceleyin; sahne geometrisini doku ve çalışma zamanı arayüz görüntülerinden ayırın.

Bu sayfada

Unreal Engine'in SVG Importer eklentisi, Motion Design için bir geometri iş akışı sağlar. Epic'in SVG içe aktarım eğitimi, 2D vektör dosyalarını 3D geometriye dönüştürmeyi açıklar. Önce motor sürümünüz için eklentiyi ve belgeleri kontrol edin, ardından iç boşluklarını, renklerini ve ayrı parçalarını tanıyabileceğiniz küçük bir kaynak içe aktarın.

Bu, SVG'yi çalışma zamanında bir arayüz görüntüsü olarak göstermekten farklı bir iştir. Doku önizlemesi, sahne aktörü ve widget görüntüleyicisi farklı çıktılardır. Bu adım adım rehber, sahne geometrisi yolu için grafik hazırlamaya ve ortaya çıkan nesnelerin hareketli tasarıma uygun olup olmadığına karar vermeye odaklanır.

Örnek, ayrı bir eşkenar dörtgeni olan, içi boş özgün bir rozettir. Bu, projenizde deneyebileceğiniz, belgelere dayanan bir iş akışıdır; gerçekleştirilmiş bir Unreal içe aktarım veya ekstrüzyon testi sonucu değildir.

Grafiği değiştirmeden önce hedefini seçin

Grafiğin neye dönüşmesi gerektiğine karar verin. Tek başına SVG uzantısı bu soruyu yanıtlamaz.

Amaçlanan kullanımÖnce belirlenecek noktalarİncelenecek noktalar
Sahne geometrisi olarak oluşturulan grafikUyumlu SVG Importer ve Motion Design iş akışıİç boşluklar, yüzeyler, renk uygulaması, sınırlar ve nesne denetimi
Bir yüzeyde düz görüntüProjenin doku/materyal yoluÇözünürlük, saydamlık ve son materyal
Normal UMG widget'ları içinde bir simgeArayüzün desteklediği bir görüntüleme yaklaşımıWidget davranışı ve paketlenmiş hedef desteği
Uygulama başladıktan sonra alınan SVGAçıkça tanımlanmış bir çalışma zamanı yükleme/görüntüleme uygulamasıGirdinin işlenmesi, özellik kapsamı ve hata durumundaki davranış

Epic'in Motion Design hızlı başlangıç rehberi, yayın grafikleri için bir düzenleyici eklentisini açıklar. Arayüzü UMG'ye benzer, ancak widget'ların dışındaki yetenekleri de içerir. Bu benzerlik, normal bir UMG Image öğesinin herhangi bir SVG dosyasını yükleyebileceğinin kanıtı değildir.

Aynı kaynağı motorlar arasında taşıyorsanız Unity SVG içe aktarım rehberi, ayrı bir içe aktarıcıyı ve hedef seçimini ele alır. Bir motorun dosyayı kabul etmesi, diğerinin dosya desteğini doğrulamaz.

Motor sürümünüzde eklentiyi kontrol edin

Epic'in SVG Importer eklenti sayfası, şu anda Beta uyarısı taşır ve kategorisini Experimental olarak listeler. Bunu, özellikle eklentiye kapsamlı bir bağımlılık oluşturmadan önce, teslim edeceğiniz projede özelliği doğrulamak için bir gerekçe olarak değerlendirin.

Resmî eğitim Unreal Engine 5.4 ve 5.5 için etiketlenmiştir. Güncel API belgeleri ayrı bir başvurudur; bu nedenle eski bir videodaki panellerin veya etiketlerin yüklü başka bir sürümle tamamen eşleştiğini varsaymayın.

Motion Design kurulumu için sürümünüze uygun hızlı başlangıç talimatlarını izleyerek Motion Design ve Storm Sync Motion Design Bridge eklentilerini etkinleştirin. İlgili SVG Importer eklentisinin o projede mevcut ve etkin olduğunu kontrol edin. Grafiği araştırmaya başlamadan önce düzenleyicinin yeniden başlatma istemlerini uygulayın.

Önce küçük bir test seviyesi kullanın. Hızlı başlangıç rehberi, boş bir seviye veya şablonla başlayıp ardından Motion Design > Create Defaults > Spawn yolunu izlemeyi açıklar. Eksik aktörü, kamera sorununu veya eklenti kurulum sorununu hatalı bir kaynaktan daha kolay ayırabilmek için bu testi karmaşık bir sekanstan ayrı tutun.

Tek bir ayrı parçayla içi boş bir rozet hazırlayın

Bu özgün örneği hollow-badge.svg olarak kaydedin:

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 180 140">
  <path fill="#147D78" fill-rule="evenodd"
    d="M24 24H116V116H24Z M46 46H94V94H46Z"/>
  <path fill="#EF8067" d="M150 30L168 48L150 66L132 48Z"/>
</svg>

Turkuaz yol, ortasında boş bir kare olan kare çerçeve oluşturur. Mercan renkli eşkenar dörtgen, çerçeveyle arasında boşluk bulunan ayrı bir yoldur. Dosyada arka plan dikdörtgeni, kontur, metin, filtre, harici görüntü veya animasyon yoktur.

Bu öğelerin bulunmaması bilinçli bir tercihtir. Karmaşık bir illüstrasyonu denemeden önce birkaç yararlı soru sormanızı sağlar: orta kısım açık kalıyor mu, eşkenar dörtgen ayrı duruyor mu ve iki renk de amaçlandığı gibi gösteriliyor mu?

Kendi kaynağınızı bir vektör düzenleyicisinde de inceleyin. Yalnızca bir fotoğrafı SVG kapsayıcısına sarıyorsa gömülü raster kontrolü, bu durumu belirlemenize yardımcı olur. Bitmap'in adını değiştirmek veya onu bir kapsayıcıya sarmak, bu geometri alıştırması için gereken kapalı sınırları sağlamaz.

Düzenlenebilir ana dosyayı saklayın ve teslim için bir kopya dışa aktarın. Başlangıç noktası olarak basit, kapalı, dolgulu şekiller kullanın; efektleri, degradeleri veya ayrıntılı kırpmayı yalnızca proje bunları gerektiriyorsa ve nasıl işlendiğini doğrulayabiliyorsanız ekleyin. API başvurusunda benzer adlı bir sınıfın bulunması, o özellik için tam bir uyumluluk garantisi değildir.

Düz, içi boş kare rozet ve ayrı eşkenar dörtgeni, aynı şekillerin az derinlikli halini ve sahneye yerleştirilmiş geometriyi gösteren çizim
Çizim: kaynak grafik, oluşturulmuş geometri ve sahne yerleşimi farklı soruları yanıtlar. Gerçek içe aktarım sonucunu kontrol ederken iç boşluğu ve ayrı vurgu öğesini görünür tutun.

Bir dosya içe aktarın ve ortaya çıkan varlığı belirleyin

Deney için bir proje içerik klasörü seçin. Epic'in genel varlık içe aktarım rehberi, Content Browser içindeki Import düğmesini ve sürükleyip bırakarak içe aktarmayı belgeler. Uyumlu SVG içe aktarıcısı etkinken küçük SVG'yi seçin ve yüklü sürümünüzde içe aktarıcıya özgü seçeneklerle tanılama mesajlarını inceleyin.

Dosya reddedilirse veya beklenen içe aktarıcı görünmezse önce motor sürümünü ve eklenti kurulumunu doğrulayın. Grafiği tekrar tekrar sadeleştirmek, kullanılamayan bir içe aktarım özelliğini düzeltmez.

İçe aktardıktan sonra yerleştirmeden önce varlık türünü belirleyin. Epic'in SVGImporter API'si, SVG verilerini, SVG aktörlerini ve dinamik mesh bileşenlerini içerir. Bunlar yararlı ayrımlardır: kaynak veri varlığı, sahnede amaçlanan geometrinin bulunduğunu tek başına kanıtlamaz.

Varlığı test sahnesine getirmek için sürümünüzün SVG aktörü yerleştirme iş akışını kullanın. Motion Design araç kutusu SVG aktörleri içerir. Yerleştirilen sonucu seçin ve derinliği, materyalleri veya animasyonu değiştirmeden önce önden inceleyin. Başka bir ekip arkadaşının kurulumu tekrarlayabilmesi için hangi varlığı ve aktörü kullandığınızı kaydedin.

İçe aktarılan varlıkları kaydedin ve özgün SVG'yi saklayın. Unreal'ın genel içe aktarım rehberi, içe aktarılan içeriğin proje varlıklarında saklandığını açıklar; kaynak dosya, sonraki düzenlemeler ve yeniden içe aktarma için önemini korur.

İç boşluğu, renk uygulamasını ve ayrı nesneleri kontrol edin

Rozetin kare iç boşluğuyla başlayın. Onu kontrast oluşturan bir arka plan önünde ve sonuç derinlik içeriyorsa başka bir açıdan görüntüleyin. Ortayı kapatan açık renkli bir yüzey, önden bakıldığında boşluk gibi görünebilir. Kabul kontrolü, amaçlanan boş bölgenin gerçekten boş kalıp kalmadığıdır.

Orta kısım doluyorsa daha fazla efekt eklemeden önce kaynağın alt yollarını ve dolgu davranışını inceleyin. SVG iç boşluk sorunlarını giderme rehberi, boyalı bir iç bölgeyle gerçek bir açıklığın düz önizlemede neden birbirine benzeyebileceğini açıklar.

Ardından eşkenar dörtgenin yanındaki boşluğu inceleyin. İstenmeyen bir bağlantı, fazladan yüzey veya arka plan bölgesi arayın. Sonra animasyon için gereken nesneleri seçin. Eşkenar dörtgen bağımsız hareket edecekse mevcut aktör/bileşen düzeninin, çerçeveyi değiştirmeden onu taşımanıza izin verdiğini doğrulayın. Görsel olarak ayrı bir vurgu öğesi, istenen seçim yapısının var olduğunu tek başına kanıtlamaz.

Geometriyi kontrol ettikten sonra renk uygulamasını kontrol edin. Turkuaz çerçeveyi ve mercan renkli eşkenar dörtgeni, kompozisyonda kullanılacak materyal ve ışık koşulları altında kaynakla karşılaştırın. Gölgeli bir yan yüzeyi yalnızca ön yüzeyden daha koyu olduğu için kaynak renk hatası olarak değerlendirmeyin.

Derinlikle ilgili sorunlarda SVG ekstrüzyon kontrol listesi, araştırabileceğiniz kaynak geometri soruları sunar. Unreal'a özgü bir komut rehberi değildir ve bu testte başarılı görünüm, üretim için su geçirmez, kapalı bir mesh bulunduğunu göstermez.

Eğrili grafikleri inceleyin ve bilinçli biçimde yeniden içe aktarın

Kare örnek eğri kullanmaz, ancak çoğu logo kullanır. Epic'in SVGImporter API'si, spline'ları çoklu çizgilere dönüştürmek için bir dönüşüm kalitesi ayarını açıklar. Bu, kaynak eğrilerinin ve oluşturulan gösterimin ayrı ayrı incelenmesi gerektiği anlamına gelir.

Yuvarlak hatlı bir logoda, çekimde kullanılan en yakın kamera mesafesinde dış eğriyi ve en küçük iç boşluğu kontrol edin. Kenarlar köşeli görünüyorsa motor sürümünüzdeki ilgili dönüşüm denetimlerini inceleyin. Kaynak vektör olduğu için gelişigüzel bir maksimum değer ayarlamayın.

Epic'in sürümlendirilmiş 5.4 SVGData başvurusu, kalite geçersiz kılma ayarını değiştirmenin yeniden içe aktarmayı ve geometrinin yeniden oluşturulmasını tetiklediğini belirtir. Bunu, sonraki tüm çalışmaların etkilenmeden kalacağını varsaymak yerine, bir başlangıç halini kaydedip kaynak veya dönüşüm ayarlarını değiştirdikten sonra sahneyi yeniden kontrol etmek için bir gerekçe olarak değerlendirin. Bu başvurudaki özellik adları, sonraki her düzenleyici paneli için verilmiş bir söz değildir.

Yeniden içe aktardıktan sonra iç boşluk, aralık, materyal ve nesne denetimi kontrollerini tekrarlayın. Tüm grafik setini düzenlemeden önce sahneyi gerçek teslim koşullarında deneyin. Bu rehber, eklenti için paketlenmiş çalışma zamanı desteğini, tarayıcıyla eşdeğer SVG görüntülemeyi veya her durumda geçerli bir performansı ortaya koymaz.

Raster bir amblemin yeniden oluşturulması gerektiğinde

Vektör ana dosyası eksikse ve kaynak basit bir PNG veya JPG amblemiyse PerfectVector'ın görüntüden vektöre dönüştürme iş akışı, statik bir SVG adayı hazırlayabilir. Görüntüyü tasarımın sınırlarına göre kırpın, önizlemede iç boşluğu ve ayrı vurgu öğesini inceleyin ve adayı kaynakla karşılaştırın. Kabul ettiğiniz SVG'yi indirin, ardından Unreal'da aynı geometri kontrollerini yapın.

Vektörleştirme sahne birimlerini seçmez, bir animasyon iskeleti (rig) oluşturmaz, üretimde kullanılacak materyalleri atamaz veya belirli bir mesh topolojisini garanti etmez. Varsa mevcut bir vektör ana dosyasını kullanın. Görünümlerini daha iyi koruyorsa fotoğrafları ve karmaşık boyama efektlerini raster olarak tutun. Basit bir geometrik rozette, gereken birkaç şekli doğrudan oluşturmak onları piksellerden yeniden oluşturmaktan daha fazla denetim sağlayabilir.

Kısa bir devir teslim kaydı tutun: kaynak dosya, motor/eklenti sürümü, içe aktarıcı ayarları, boş kalması beklenen alanlar, bağımsız hareket eden parçalar ve inceleme için kullanılan kamera mesafesi. Blogun grafik hazırlama rehberleri, motora özgü bu adımdan önce kaynakla ilgili kararları ele alır.

Sık sorulan sorular

Unreal Engine SVG dosyalarını içe aktarabilir mi? Evet. Epic, Motion Design geometrisiyle kullanılan bir SVG Importer sağlar. Motor sürümünüz için özelliği ve belgeleri kontrol edin, ardından içe aktarılan varlığı ve sahne sonucunu doğrulayın.

SVG içe aktarımı, UMG'nin çalışma zamanında her SVG'yi gösterebileceği anlamına mı gelir? Hayır. Motion Design geometri iş akışı, normal UMG widget'larında çalışma zamanında herhangi bir SVG'nin yüklenebileceğini göstermez. Arayüzün gerektirdiği görüntüleme yolunu seçin ve deneyin.

SVG'mdeki iç boşluk neden içe aktardıktan sonra dolu görünüyor? Kaynağın gerçek bir açıklık mı yoksa boyalı bir iç bölge mi içerdiğini inceleyin, ardından alt yolları ve dolgu davranışını kontrol edin. Yalnızca önden görünümüne güvenmek yerine içe aktarılan geometriyi kontrast oluşturan bir arka plan önünde doğrulayın.

PNG logoyu Unreal'a hazır bir 3D nesneye dönüştürebilir miyim? Vektörleştirme statik kaynak şekillerini yeniden oluşturabilir, ancak Unreal sahnesini tamamlamaz. Kabul ettiğiniz SVG'yi içe aktarın, oluşturulan geometriyi ve materyalleri inceleyin ve projenizin ihtiyaç duyduğu nesne denetimini doğrulayın.

Kaynaklar

  1. Epic Games — Importing + SVG importer — Motion Design geometri yolu ve eğitimin sürüm bağlamı.
  2. Epic Games — SVG Importer plugin — Eklentinin kapsamı, Beta uyarısı ve Experimental kategorisi.
  3. Epic Games — Motion Design Quick Start Guide — Proje kurulumu, düzenleyici kapsamı ve SVG aktörü araç kutusu.
  4. Epic Games — Importing Assets Directly — Genel Content Browser içe aktarımı ve varlıkları kaydetme.
  5. Epic Games — SVGImporter API — Veriler, aktörler, dinamik mesh sınıfları ve spline dönüşümü kavramları.
  6. Epic Games — SVGData, Unreal Python 5.4 — Sürüme özgü kalite geçersiz kılma ayarı ve yeniden oluşturma davranışı.

Seti içe aktarmadan önce tek bir rozetin iç boşluğunu, ayrı parçasını ve sahnedeki davranışını doğrulayın. Yalnızca raster grafik kaldıysa bir SVG adayı hazırlayın, geometrisini inceleyin ve kabul ettiğiniz dosyayı Unreal projenizde kontrol edin.

Bloga daha fazlası

Düzenlemesi daha kolay,
daha temiz bir SVG ile başlayın