UI/UX tasarımın Sarı Yakutu; Sketch 3

Merhabalar herkese, bu hafta sizlere Sketch 3 adlı programı tanıtacağım. Kullanışlı ara yüzü, kolay ve etkileyici özellikleri ile şu an mobil tasarımın gözdesi olmuş durumda.

Peki nedir Sketch 3?

Sketch 3, Bohemian Coding tarafından yaratılan ve şu an, Apple, Facebook, Dropbox, Twitter ve bunlar gibi bir çok şirketin kendi uygulamalarını tasarlamak için kullandığı bir UI/UX tasarım programıdır.

Biz ismini yeni duymaya başlasak da, Apple tarafından 2012 Tasarım Ödülü’ne layık görülmüştür. Ardından 2014’ün Best of listesine girmeyi başarmış, DigitalArts ve Macworld gibi platformlardan oldukça yüksek puanlar almıştır.

Sketch yalnızca Mac Platformunda çalışmakta olup, ücreti 99 dolardır. Bu fiyatı, öğrenciyseniz yarı fiyatına düşürebilirsiniz.

Sketch 3 bize ne gibi imkanlar sağlıyor?

Sketch 3 ile aslında Photoshop ve Illustrator gibi programlarda yapabildiğiniz her şeyi yapabiliyorsunuz. Diyeceksiniz ki; “Eee. Bunları zaten bu programlarda yapabiliyoruz. Neden bu programı öğreneyim?” İşte, konu burada başlıyor zaten. UI/UX tasarım hakkında bir fikriniz olmasa bile Sketch 3 ile harika ekranlar tasarlayabilir ve kendinizi bir anda müthiş bir UI/UX tasarımcısı ilan edebilirsiniz 🙂

Sağladığı imkanlara gelecek olursak, size tek tek örnekleri ile anlatacağım.

1.Kolay Arayüz Tasarımı

Oldukça sade ve sizin istediğiniz herşeye kolayca ulaşabilmenizi sağlayacak bir tasarıma sahip. Sol tarafta açılan menü üzerinden bir Artboard yaratabilir, bu artboardlarda çizim yapmayanızı sağlayacak araçlara kolayca ulaşabilirsiniz. Sağ tarafta bulunan menüde ise artboard’un, ikonların ya da görsellerin boyutları ile oynayabilir, görsel öğelerin renklerini değiştirebilir, onlara kolayca gölge atayabilirsiniz.

2.Hazır Artboardlar ve Templateler

 Sketch’in sevdiğim özellikleri ise istediğiniz boyutlara hızlıca kavuşabilmeniz.

Örneğin, bir ikon tasarlıyorsunuz. Bu ikonu hem iOS için hem de Web için yapmak istiyorsunuz. Klavyeden “A” kısa yolu ile ulaşabildiğiniz bu ekrandan istediğiniz boyutu seçebilirsiniz.

Bir diğeri ise Sketch-> File -> New from template‘e tıklayarak buradan yaratmak istediğiniz alanın template’ini seçmek. Örneğin, App ikonu tasarlamak ve boyutlandırmak istiyorsunuz; burada size sunulan artboardlarda kolayca Apple’ın istediği boyutlarda ikon hazırlayabilir ve export edebilirsiniz.

3.Hem Vektörel Hem de Pixel Tabanlı Çalışma Ortaklığı

Bilindiği üzere Adobe Photoshop Pixel tabanlı, Adobe Illustrator ise vektörel tabanlıdır. Birbiri ile uyumlu olsa bile, hem vektörel hem de pixel tabanlı çalışmak oldukça zordur. Sketch size bu özelliği sağlar. Vektörel bir ikon çalışırken, pixel tabanlı bir görseli oldukça rahat bir şekilde kullanabilirsiniz, hem de çözünürlük farkı oluşmadan.

4.SVG, Ai, EPS Gibi Her Türlü İkon ve Dosya Formatını Kolayca Açabilme

Sketch elinizde bulunan hazır görsel ve ikonları kullanmanız için gerekli olan her formatı açabilme özelliğine sahip. SVG,EPS gibi formatları direk Sürükle-Bırak yöntemi ile açabiliyorsunuz. Ai formatında bir ikona sahipseniz, Illustrator üzerinden açıp, kopyala-yapıştır yöntemi ile Sketch’e çağırabilirsiniz. PSD formatındaki dosyalarınız içinde SVG formatında kaydedip, Sketch’te açabilirsiniz.

5.Grid özelliği

Diğer programlarda olan Ruler mantığıyla birlikte getirilen Grid Sistemi pixel pixel ölçüp yerleştirme eziyetini ortadan kaldırıyor. Hizalamayı kolaylaştırıyor.

6.İşi Kolaylaştırıcı, Hızlandırıcı Pluginler’i

Sketch’te bulunan pluginler’i Github gibi ortamlardan indirebilir ve hızlıca kurup kullanmaya başlayabilirsiniz.

7.Kolayca Slice ve Export Edebilme Özelliği

İşin en çetrefilli kısmı export etmek. Yazılımcılara iletirken kullandığımız her parçayı tek tek kaydetmek oldukça güç iken, Sketch sayesinde slice edip, istediğimiz formatta kaydedebiliyoruz.

8.Skecth Mirror Kullanarak Telefon Üzerinden Önizleme Yapabilme

Çalışmayı bitirdiniz! Tebrikler 🙂 Fontları ve görselleri güzelce yerleştirdiniz. Fakat çalışmanızı bilgisayar ekranında doğru mu görüyorsunuz? Belki fontlar küçük oldu ya da Row yapıları ekranda büyük kaldı. Bunu anlayabileceğiniz ve test edebileceğiniz en iyi ortam mobil platformdur; Sketch’in App Store’dan ulaşabileceğiniz Mirror Programı size bu test platformunu sağlar. Aynı Wi-Fi Ağına sahipseniz rahatlıkla ikisi arasında bağ kurup kullanabilirsiniz.

Önümüzdeki haftalarda; sizlere birer birer bu özellikleri, örnekleri ile anlatacağım. Görüşmek üzere 🙂