Tasarım Aracı Karşılaşması – Adobe XD ve Sketch (2019)

Köklü bir tasarım aracı olan Sketch, 2010'daki tanıtımından bu yana olağanüstü bir büyüme yaşadı. 2016'da Adobe, XD'yi zorlu bir rakip olarak tanıttı. Yaklaşık üç yıllık geliştirme sürecinin ardından Adobe XD, tasarımcıların bir değişikliği düşünmeleri için yeterince zorluk sunuyor mu?

UX tasarım süreci karmaşıktır ve belirli araçların, metodolojilerin ve çerçevelerin kullanılmasını gerektirir. Kullanıcı araştırması, analizi, tel çerçeve oluşturma, maketler, yineleme, kullanılabilirlik testi ve UI prototipleme, tasarımcıların geliştiriciler, paydaşlar ve diğer ekip üyeleriyle iletişim kurarken birlikte çalıştığı eserlerden ve süreçlerden sadece birkaçıdır.

UX tasarımcılarının güvendiği, yaygın olarak tanınan iki tasarım aracı Adobe XD ve Sketch'tir.

Sketch, basit arayüzü, çok sayıda eklentisi, eksiksiz araç seti işlevselliği ve sık güncellemeleri nedeniyle dijital tasarımcıların büyük çoğunluğu için fiili standart haline geldi.

Sketch, UX tasarımcıları için tercih edilen araç haline gelirken, uzun süredir ödüllü tasarım yazılımları ve tasarım topluluğuyla derin bağları ile tanınan Adobe'nin benzer bir seçeneği yoktu. Photoshop, Illustrator ve Fireworks'e sahiplerdi, ancak tasarımcıların Sketch'in tek bir uygulamada sağlayabileceği görevleri gerçekleştirmek için üç araç kullanma iştahı yoktu.

Adobe, 2016'da XD'yi (Deneyim Tasarımı) tanıttı. Sketch için ciddi bir rakip, hala yapacak çok şeyi vardı. O zamanlar Sketch altı yaşındaydı, geniş bir kullanıcı tabanına ve eksiksiz bir eklenti ekosistemine sahipti ve bu da onu güçlü bir tasarım aracı haline getiriyordu. Önümüzdeki iki yıl içinde rekabet arttı ve Adobe XD, çevik bir rakipten, birçok profesyonel tasarımcıyı kazanmış, saygın bir tasarım aracına dönüştü.

Toptal Design Blog, 2017'de henüz beta aşamasındayken Sketch vs Adobe XD hakkında bir makale yayınladı. Şimdi, iki yıl sonra, Adobe XD, net bir hedefi olan çok sayıda revizyon gördü: Bir UX tasarımcısının ihtiyaç duyduğu her şeyi yerel olarak ve mükemmel performansla sunun.

UX tasarımcılarının Sketch'ten Adobe XD'ye geçme zamanı geldi mi?

Adobe XD ve Sketch

Adobe XD'nin Sketch ile nasıl karşılaştırıldığını keşfedelim. Aşağıdaki özellikleri karşılaştıracağız:

• Kullanıcı arayüzü
• Izgarayı Tekrarla
• Semboller ve Varlık Panelleri
• Duyarlı Tasarım Araçları
• Eklentiler ve Eklentiler
• Auto-Animate ile Prototip Oluşturma
• Paylaşım ve Yorumlar
• Geliştiricilerle Çalışmak
• Sürüm Kontrolü ve Gerçek Zamanlı İşbirliği

Kullanıcı arayüzü

Photoshop gibi araçlara aşina olan tasarımcılar, hepsi benzer bir kullanıcı arayüzünü paylaştığı için Adobe XD veya Sketch'i öğrenirken sorun yaşamamalıdır.

Dikkate değer bir UI farkı, Adobe XD'de bir Araç Çubuğunun olmamasıdır. Kullanıcı arayüzünün üst kısmında bulunan Araç Çubuğu, nesneleri gruplama gibi yaygın olarak kullanılan işlevler ve araçlar için özelleştirilebilir kısayollara sahip, Sketch'te kullanışlı bir özelliktir. Adobe, yazılımın sağ tarafında bulunan araç kutusu adı verilen benzer, küçültülmüş bir özellik sunar.

Sketch vs XD : Sketch, yararlı Araç Çubuğu için bir kenara sahiptir.

Izgarayı Tekrarla

Adobe XD'deki dikkate değer bir özellik, tekrarlama ızgarasıdır. Bu, ayarlanabilir listelerin ve ızgara tabanlı ekranların kolayca oluşturulmasını sağlayan kullanışlı bir araçtır. Sketch bu özellikten yoksun olsa da, eklentilerle aşağı yukarı çoğaltılabilir.

Sketch vs XD : Adobe XD, yazılıma özgü olan tekrarlama ızgarasına sahip bir kenara sahiptir.

Semboller ve Varlık Panelleri

Semboller, Sketch'in başarısına önemli katkısı olan erken bir özellikti. Semboller, CSS (Basamaklı Stil Sayfaları) web sitesi tasarımı gibi Sketch içindir. Tasarımcıların çok zaman kazandıran, hazır bir tasarım sistemi oluşturmaya yardımcı olan ve tüm ekranlarda tutarlılık sağlayan varlıkları kolayca yeniden kullanmalarına ve toplu düzenlemelerine olanak tanır.

Adobe, temel sembollerle başladı ve ardından sembolleri, yazı tiplerini ve renkleri tek bir konumda birleştiren varlıklar panelini tanıttı. Bu öğelerden herhangi birinin düzenlenmesi, ortaya çıkan güncellemeleri gerçek zamanlı olarak gösterir. Sketch bu özelliklere sahiptir, ancak Adobe XD daha uyumlu ve gelişmiş bir kullanıcı deneyimi sağlamıştır.

Sketch vs XD : Adobe XD, varlıklar panelindeki birleşik UI öğeleri nedeniyle hafif bir kenara sahiptir.

Duyarlı Tasarım Araçları

Adobe XD, güçlü bir duyarlı tasarım araçları seti sağlar. Öne çıkan bir özellik, duyarlı otomatik mod , ekranın değişen cihaz boyutlarına nasıl yanıt vermesi gerektiğini tahmin eder.

Bu, basit bir kaydırma düğmesi kullanılarak açılıp kapatılabilen inanılmaz derecede kullanışlı bir özelliktir. Otomatik mod beklenen davranışın altında kalırsa, tasarımcı yanıt veren özellikleri manuel olarak değiştirebilir.

Sketch'te bu özellik yerleşik değildir, ancak Anima Toolkit gibi işi iyi yapan birçok eklentiye sahiptir.

Sketch vs XD: Adobe XD'nin burada avantajı var. UI öğeleri üzerinde duyarlı etkileri görmenin yerleşik bir yolunu sunarlar.

Eklentiler ve Eklentiler

Sketch içindeki eklenti ekosistemi, tartışmasız en büyük özelliklerinden biridir. Sketch'in işlevselliğini artıran ve tasarımcıların Sketch ekosisteminde kalırken gelişmiş özellikleri kullanmalarına olanak tanıyan yüzlerce eklenti vardır.

Eklentiler, eklentilerin Adobe XD eşdeğeridir. Adobe, eklenti ekosistemine 2018'de başladı, bu nedenle Sketch kadar sağlam değil. Bu, Adobe için bir endişe değil, çünkü amaçları eklentilere olan ihtiyacı denemek ve azaltmak ve yazılımda yerleşik özellikler oluşturmaya odaklanmak.

Sketch vs XD: Sketch, kapsamlı eklenti kitaplıkları ile avantajlıdır.

Auto-Animate ile Prototip Oluşturma

Adobe kısa süre önce XD'yi UX tasarımcıları için inanılmaz derecede kullanışlı bir özellikle güncelledi: auto animate . Farklı ekranların öğeleri arasında akıllı, yumuşak geçişler yaparak çalışır. Sonuçlar etkileyici, prototip oluşturmayı potansiyel müşterilerle etkileşim kurmak için keyifli bir deneyim haline getiriyor. Sketch, bir eklentiyle bile bu işlevi sunmaz.

Adobe'nin sunduğu bir başka harika prototipleme özelliği, örneğin bir paneli ekranın kenarından çekme veya bir klavyenin görünmesini sağlama gibi mikro etkileşimleri desteklemesidir. Adobe XD ayrıca ses tabanlı kullanıcı arayüzlerinin (Alexa veya Google Home gibi) prototiplenmesini de destekler.

Sketch vs XD: Adobe XD, zaman kazandıran otomatik canlandırma özellikleri ve Sketch'in eksik olduğu mikro etkileşimler için destek ile burada avantaja sahiptir.

Paylaşma ve Yorumlama

Tasarımcılar sıklıkla diğer ekip üyeleri, geliştiriciler ve paydaşlarla iletişim kurar; tasarımları paylaşma ve geri bildirim alma yeteneği tasarım sürecinin çok önemli bir parçasıdır. Bu nedenle, Adobe XD, herkesin genel yorumlar ekleyebilmesi veya bir mizanpajdaki belirli konumlara işaret edip geri bildirim bırakabilmesi için çevrimiçi olarak paylaşılacak maketler ve prototipler için yerleşik işlevsellik içerir.

Adobe XD'nin dinamik prototipleme moduyla birleştirilen bu özellikler, yerel Adobe XD uygulamasına sahip cep telefonlarında da test edilebilir ve hatta etkileşimli olmayan gösterimler için kaydedilebilir.

Sketch, Zeplin gibi işbirliği araçlarını kullanarak veya Invision gibi 3. taraf araçlarla entegrasyonları kullanarak paylaşım ve yorumlardan yararlanabilir.

Sketch vs XD: Adobe, yerleşik çevrimiçi paylaşım ve yorum ile burada hafif bir avantaja sahiptir.

Tasarım Özellikleri

Bir tasarım projesi boyunca, UX tasarımcılarının genellikle tasarım özelliklerini geliştiricilerle paylaşması gerekir. Adobe, bu işlevi XD'ye dahil ederken, Sketch kullanıcılarının Zeplin veya InVision gibi entegrasyonları kullanmaları gerekecek.

Sketch ve XD: Tasarım özellikleri yerleşik olduğundan ve üçüncü taraf entegrasyonu gerektirmediğinden Adobe'nin Sketch'e göre üstünlüğü vardır.

Sürüm Kontrolü ve Gerçek Zamanlı İşbirliği

Tasarımcıların ve geliştiricilerin güvendiği iki önemli özellik, sürüm kontrolü ve gerçek zamanlı işbirliğidir. Aynı proje üzerinde birlikte çalışan büyük tasarım ekipleri, değişikliklerin ne zaman yapıldığını görebilmeli ve bu değişikliklerin geçmişine erişebilmelidir.

Adobe, bulut belgelerinin tanıtımıyla işbirliğine değindi. Bu, geliştiriciler de dahil olmak üzere ekipteki herkese çalışmak için merkezi bir yer sağlar. Adobe'ye göre, bulut belgeleri özelliği için bir sonraki adım sürüm kontrolü olacak.

Sketch, sürüm kontrolü ve eklentilerle gerçek zamanlı işbirliği sunar, ancak bu özellikler üründe yerleşik değildir.

Sketch vs XD: Sketch bunu kazanır. Eklentilerle de olsa sürüm kontrolüne sahiptirler; bu şu anda XD'de sunulmamaktadır.

Özellik Özeti: Adobe XD ve Sketch

Adobe XD ve Sketch'in mevcut sürümü arasında benzerlikler olduğu kadar farklılıklar da var. İşte her ürünün bir karşılaştırması:

UX Tasarım Araçlarını Değiştirmenin Zamanı Geldi mi?

Karşılaştırma özellikleri, Sketch ve XD yakındır. Sketch, otomatik animasyon, otomatik yanıt veren tasarım ve XD'ye özgü tekrarlama ızgarası gibi bazı özelliklerden yoksundur.

Adobe XD'de hala eksik olan tek önemli şey, Sketch'in eklentiler sayesinde sahip olduğu sürüm kontrolüdür. Adobe, bulut belgeleri özellik setini geliştirmeye devam eder etmez, bunun XD'ye ulaşmasını bekleyin.

XD, Sketch dosyalarını mükemmel bir doğrulukla açabildiğinden, Sketch'ten (ve Photoshop veya Illustrator'dan) XD'ye geçiş yapmak diğer yoldan daha kolaydır. Abstract veya InVision Craft gibi yalnızca Sketch eklentilerine bağlıysanız bazı sorunlarla karşılaşabilirsiniz.

Bazı senaryolarda seçim açıktır: Windows kullanıcıları için Sketch mevcut değildir ve Adobe Creative Cloud aboneleri için XD, sınırsız paylaşılan prototiplerle ücretsiz olarak dahildir. Bu tesadüfen olmadı.

Ama Sketch direniyor. Şirket kısa süre önce 20 milyon dolarlık finansman sağladı ve ekip işbirliği, yerel devir ve uygulamanın 2019'da bir web sürümü gibi önemli özellikler vaat ediyor.

Sürüm kontrolü kritik bir sorun değilse, Adobe XD kullanmayı düşünmek için hiç bu kadar iyi bir zaman olmamıştı. Adobe'nin kullanıcı deneyimi tasarım topluluğuna bağlılığı, otomatik yanıt modu, ızgarayı tekrarlama ve yerleşik prototip oluşturma gibi özelliklerle kendini gösterir. Geç başlamalarına rağmen Adobe, Sketch için zorlu bir mücadele sağlayabileceklerini kanıtladı.

Toptal Tasarım Blogunda daha fazla okuma:

• Adobe XD ve Sketch - Hangi UX Aracı Size Uygun?
• Atomik Tasarım ve Eskiz - İş Akışını Geliştirme Rehberi
• Hassas Tasarım - Bir Adobe XD İncelemesi
• Sketch'te Tipografi Hakkında Bilmediğiniz Şeyler
• Sketch Plugin Geliştirme ile Tanışma