İçeriğe geç
SaytPro
Bize yazın

Teknolojiler

Figma

Figma, web sitesi ve mobil uygulama arayüzlerini tasarlamak için tarayıcıda çalışan bir araçtır. 2016 yılında Figma, Inc. tarafından yayınlanmıştır ve birden fazla kişinin aynı dosyada aynı anda çalışmasına olanak tanır.

GeliştiriciFigma, Inc.
İlk sürüm2016
Resmi sitefigma.com

Figma nedir?

Figma, web sitesi ve uygulama arayüzleri tasarlamak için geliştirilmiş bir programdır. Geleneksel tasarım yazılımlarından farklı olarak kurulum gerektirmez; sıradan bir tarayıcıda açılır ve çalışır. Dosyalar bulutta (uzak sunucularda) saklandığı için tasarım her bilgisayardan açılabilir ve klasik "son dosyayı gönderir misin" sorunu ortadan kalkar.

Figma'nın en belirgin özelliği gerçek zamanlı iş birliğidir: tasarımcı, proje yöneticisi ve müşteri aynı dosyaya aynı anda bakabilir, birbirlerinin imleçlerini görebilir ve yorum bırakabilir, tasarım için Google Docs gibi düşünebilirsiniz. 2016'da çıktığında bu bir yenilikti ve Figma'yı kısa sürede Adobe XD ve Sketch gibi rakiplerinin önüne geçirdi.

Statik tasarımın ötesinde Figma'da prototip (gerçek bir site gibi davranan, tıklanabilir etkileşimli model) hazırlamak mümkündür: tek satır kod yazılmadan butonlara basıp sayfalar arasında gezinebilirsiniz. Dev Mode adlı mod ise geliştiricilere tasarımdaki ölçüleri, renkleri ve yazı tiplerini doğrudan kod değerleri olarak gösterir; tasarımdan koda geçiş belirgin şekilde kolaylaşır.

Figma ticari bir üründür ancak kişisel kullanım ve küçük projeler için yeterli olan cömert bir ücretsiz planı vardır. 2022'de Adobe, Figma'yı 20 milyar dolara satın almak için anlaşmıştı; ancak AB ve Birleşik Krallık düzenleyicilerinin rekabet endişeleri nedeniyle anlaşma Aralık 2023'te iptal edildi ve Figma bağımsız bir şirket olarak kaldı.

İşletmeniz için ne anlama geliyor?

Web sitesi yaptıran bir işletme sahibi için Figma, tek satır kod yazılmadan önce sitenizin tam görünümünü görüp onaylayabilmeniz demektir. Değişiklikler pahalı olan kod aşamasında değil, hızlı ve ucuz olan tasarım aşamasında yapılır. İncelemek için tarayıcıda bir bağlantı açmanız yeterlidir; hiçbir program kurmanız gerekmez.

SaytPro bunu nasıl kullanıyor?

SaytPro her projeye Figma tasarımıyla başlar: önce sayfa taslakları hazırlanır, müşteri bağlantı üzerinden inceleyip doğrudan tasarımın üzerine yorum bırakır. Onaydan sonra ekip, Dev Mode'dan aldığı kesin ölçü ve renklerle siteyi Next.js ve Tailwind CSS kullanarak kodlar. Bu akış, onaylanan tasarım ile yayına giren site arasındaki farkı en aza indirir.

Bu teknolojiyle sunduğumuz hizmetler

Sık sorulan sorular

Figma, web sitesi ve mobil uygulama arayüzleri tasarlamak için kullanılan bir araçtır. Tarayıcıda çalışır, kurulum gerektirmez ve birden fazla kişinin aynı dosyada aynı anda çalışmasına izin verir. Bir web sitesi yapılırken ilk aşama olan görünümün belirlenmesi genellikle Figma'da gerçekleşir.

Photoshop fotoğraf düzenleme ve piksel tabanlı grafikler için, Figma ise arayüz tasarımı için geliştirilmiştir. Figma tarayıcıda çalışır, dosyaları bulutta tutar ve birden fazla kişinin aynı dosyada eş zamanlı çalışmasına izin verir; Photoshop böyle bir ortak çalışma akışı için tasarlanmamıştır. Web tasarımı için Figma'da yeniden kullanılabilir bileşenler ve prototipleme gibi özel araçlar bulunur.

İkisi de arayüz tasarımı içindir; ancak Adobe, XD'nin geliştirilmesini fiilen durdurdu ve yeni kullanıcılara aktif olarak sunmuyor. Figma ise aktif geliştiriliyor, çok daha büyük bir topluluğa ve eklenti ekosistemine sahip. Bugün yeni projeler için sektör standardı Figma kabul ediliyor.

Figma'nın gerçekten kullanılabilir bir ücretsiz planı var; kişisel işler ve sınırlı sayıda proje dosyası için yeterlidir. Sınırsız dosya, tam sürüm geçmişi ve Dev Mode'un tüm özelliklerine ihtiyaç duyan ekipler için düzenleyici başına aylık ücretli planlar sunulur.

Tasarımcı size sıradan bir bağlantı gönderir; tarayıcıda açarsınız, kurulum gerekmez, çoğu zaman hesap açmak bile gerekmez. İstediğiniz öğeye tıklayıp üzerine yorum bırakabilirsiniz; tasarımcı yorumu görüp düzeltmeyi yapar. Bu, e-postayla ekran görüntüsü göndermekten çok daha pratiktir.

Prototip, kod yazılmadan hazırlanan, tıklanabilir ve etkileşimli bir tasarım modelidir. Butonlara basabilir, menüleri açabilir ve sayfalar arasında gezinebilirsiniz; site sanki çalışıyormuş gibi davranır. Böylece geliştirme başlamadan önce, değişikliklerin hâlâ ucuz olduğu aşamada gezinmeyi ve kullanım kolaylığını test edersiniz.

Dev Mode, Figma'nın geliştiricilere yönelik modudur: her öğenin kesin boyutlarını, renk kodlarını, yazı tiplerini ve boşluklarını koda hazır değerler olarak gösterir. Geliştirici görselden tahmin etmek yerine kesin rakamlarla çalışır. Sonuçta yayına giren site, onaylanan tasarıma büyük ölçüde sadık kalır.

Üç nedenle: tarayıcıda çalıştığı için Windows, Mac ve Linux'ta aynı şekilde açılır; gerçek zamanlı iş birliği dosya sürümü karmaşasını ortadan kaldırır; bileşen sistemi büyük projelerde tasarımı tutarlı tutar. 2016'dan bu yana bu avantajlar onu Sketch ve Adobe XD'nin önüne geçirdi.

Hayır. Adobe 2022'de Figma'yı 20 milyar dolara satın almak için anlaşma imzalamıştı; ancak AB ve Birleşik Krallık rekabet kurumları ciddi endişeler dile getirdi. Aralık 2023'te taraflar anlaşmadan vazgeçti ve Figma bağımsız bir şirket olarak devam ediyor.

Geliştirmeye para harcanmadan önce sitenizin kesin görünümünü onayladığınız anlamına gelir. Tasarımı değiştirmek, kodu değiştirmekten kat kat daha ucuz ve hızlıdır. SaytPro gibi stüdyoların her projeye Figma tasarımıyla başlamasının nedeni tam olarak budur; kodlamaya ancak müşteri onayından sonra geçilir.

Bu teknoloji genellikle bunlarla birlikte çalışır.

Özgün tasarımları hızlı ve tutarlı biçimde kurmayı sağlayan utility-first CSS framework'ü.

  • Framework

Meta'nın kullanıcı arayüzleri oluşturmak için geliştirdiği açık kaynaklı JavaScript kütüphanesi.

  • Framework

Web sitenizin içeriğini teknik bilgi gerektirmeden yönetmeniz için sıfırdan geliştirilen yönetim sistemi.

  • Yönetim paneli