Crop option available through toolbar button, double-click, or image properties panel. Hold Option/Alt to crop opposite sides, Command/Control to maintain aspect ratio. Cropped areas remain hidden, allowing easy adjustments
Bu video, bir eğitmen tarafından sunulan Bravo Studio uygulamasının Figma ile nasıl kullanılacağını anlatan kapsamlı bir eğitim içeriğidir.. Eğitim, Bravo Studio'nun Figma için iOS ve Android platformlarında native app çıkarma özelliğini adım adım göstermektedir. İlk bölümde Bravo Studio'nun web sitesi ve temel özellikleri tanıtılmakta, Figma'da bir tasarım oluşturma süreci anlatılmaktadır. İkinci bölümde ise Figma'da yeni bir collection oluşturma, REST API kullanarak dinamik veri çekme ve bu verileri uygulamada kullanma adımları gösterilmektedir.. Eğitim içeriğinde sabit bir video alanı ve dinamik olarak gelen kullanıcı listesi içeren bir uygulama prototipinin oluşturulması, Bravo Text kodlarının kullanımı, Jason Place Holder Type Code platformundan kullanıcı verilerinin çekilmesi ve Android için APK dosyasının oluşturulması gibi konular detaylı olarak ele alınmaktadır.
Bu video, Figma'da organik ve etkileşimli bir açılan menü oluşturmayı adım adım gösteren bir eğitim içeriğidir.. Video, açılan menü bileşeninin oluşturulması, durumların (state) tanımlanması ve etkileşimlerin yapılandırılması aşamalarını kapsamaktadır. Öncelikle bir bileşen oluşturulur, ardından "gizli" ve "görünür" durumları tanımlanır. Daha sonra seçenekler (option 1, 2, 3, 4, 5) eklenir ve her bir seçenek için etkileşim kurulur. Sonuç olarak, menü açılıp kapanabilen ve seçenekler arasında geçiş yapılabilen bir etkileşimli prototip oluşturulur.
Bu video, Ender adlı bir eğitmen tarafından sunulan Figma programında landing page tasarımı eğitim içeriğidir. Eğitmen, izleyicilere adım adım web sayfası tasarımı yapma sürecini göstermektedir.. Video, wiframe tasarımının tasarıma dönüştürülmesi sürecini kapsamlı şekilde ele almaktadır. İçerikte header oluşturma, logo yerleştirme, menü ekleme, buton tasarımı, konteyner alanları, responsive tasarım, görsel mockup yapma, komponent oluşturma ve varyasyonları gibi konular adım adım anlatılmaktadır.. Eğitimde ayrıca Freepik platformundan vektör görseller indirme, Figma'nın varyant özelliğini kullanma, gölge ve blur efektleri uygulama, kılavuz çizgilerini kullanarak öğeleri sabitleme ve komponent oluşturma sırasında dikkat edilmesi gereken hatalar gibi pratik bilgiler de paylaşılmaktadır.
Hold Command/Ctrl while clicking and dragging image edges. Eight blue handles appear around image for cropping. Original image remains intact after cropping
Undo feature allows designers to reverse changes made to their designs. Undo is crucial for saving time and preventing irreversible mistakes
Select images by clicking or Shift+clicking. Choose format (PNG, JPG, SVG, PDF) and size. Export as ZIP file containing selected elements
Bu video, bir eğitim içeriği olup, izleyicilere Figma uygulamasında dosyaları bilgisayara nasıl kaydedebileceklerini göstermektedir.. Video, Figma'nın varsayılan olarak bulutta dosyaları tuttuğunu ancak bazı durumlarda bilgisayara kaydetme ihtiyacı olabileceğini açıklıyor. İki farklı yöntem sunuluyor: File menüsünden "Save to Local" seçeneğini kullanma veya Ctrl+P tuşlarına basarak hızlı menüyü açıp "Save to Local Copy" yazarak dosyayı kaydetme. Ayrıca, kaydedilen dosyanın mail atılabileceği veya USB aracılığıyla paylaşılabileceği belirtiliyor.
Figma is a cloud-based design and prototyping tool for UI/UX design. Enables real-time collaboration across multiple users. Provides vector editing tools and cloud-based storage
Bu video, Figma uygulamasında constraints özelliğinin nasıl kullanılacağını gösteren bir eğitim içeriğidir. Eğitmen, Figma'da responsive design yaparken constraints'in önemini vurgulamaktadır.. Video, constraints'in menülerde, footerlarda ve content box'larda nasıl kullanılacağını adım adım göstermektedir. Eğitmen önce basit bir menü örneği üzerinden constraints'in temel kullanımını anlatıp, ardından daha karmaşık bir tasarım üzerinde master components üzerinden constraints ayarlarını göstermektedir. Ayrıca, yazıların alt satıra atılmaması gerektiği gibi önemli püf noktalarını da paylaşmaktadır. Video, constraints'in responsive design için çok önemli bir araç olduğunu vurgulayarak sonlanmaktadır.
Bu video, bir eğitim içeriği olup, konuşmacı Figma Mirror uygulamasının nasıl kullanılacağını göstermektedir.. Video, Figma Mirror uygulamasının telefonuna yüklendikten sonra nasıl kullanılacağını adım adım anlatmaktadır. Önce uygulamanın açılış ekranı ve frame/komponent seçimi gösterilmekte, ardından aynı WiFi ağına bağlanarak uygulamanın nasıl kullanılacağı açıklanmaktadır. Son olarak, prototip geliştirme örneği üzerinden bir frame'e özellik ekleme ve tıklama ile otomatik yönlendirme işlemi gösterilmektedir.
UI is a specialized subset of UX focusing on product interface design. Effective UI design builds emotional connection between users and products
Bu video, The Codefather tarafından sunulan "Yap-İşlet-Devret" web tasarım serisinin bir bölümüdür. Eğitmen, daha önce Figma kullanarak tasarladığı hayali bir kayak merkezi sitesinin front-end kodlarını yazmaya başlıyor.. Video, web sitesinin ana iskeletinin belirlenmesiyle başlıyor ve Visual Code kullanarak klasör mimarisi oluşturma sürecini gösteriyor. Eğitmen, dinamik ve statik içerik dosyalarını ayırmak için "assets" klasörü oluşturuyor, Google Fonts'tan fontları ve Fon Tasm'dan ikonları ekliyor. Video, bir sonraki bölümde içerik kodlamaya başlanacağını belirterek sona eriyor.
Bu video, Fikret Re-Design tarafından sunulan kapsamlı bir Figma eğitim dersidir. Fikret, Re-Design kanalının sahibi olarak Figma programının temel özelliklerini adım adım anlatmaktadır.. Video, Figma'nın ne olduğu, hesap oluşturma ve giriş yapma adımlarıyla başlayıp, programın arayüzü, araç paneli ve temel araçları (Move, Scale, Frame, Shape araçları) detaylı şekilde göstermektedir. Ardından hizalama özellikleri, element özellikleri, layer ayarları ve renk paleti oluşturma gibi temel konular ele alınmaktadır. Son bölümde ise prototip oluşturma, sayfa geçişleri, animasyonlar ve kısıtlamalar (constraints) özellikleri bir e-ticaret teması örneği üzerinden pratik uygulamalarla anlatılmaktadır.. Video, Figma Desktop uygulamasının nasıl indirileceği, farklı tarayıcılardan tasarımın nasıl paylaşılacağı, komponent kavramının önemi ve responsive tasarım için kısıtlamaların nasıl kullanılacağı gibi pratik bilgiler de içermektedir. Bu eğitim, Figma kullanarak tasarım yapmak isteyenler için temel bir rehber niteliğindedir.
Bu video, bir eğitim içeriği olup, konuşmacı Figma'daki yeni interaktif komponent özelliğini anlatmaktadır.. Video, Figma'daki interaktif komponent özelliğinin ne olduğunu ve nasıl kullanılacağını adım adım göstermektedir. Konuşmacı önce prototip özelliğinin sınırlamalarını anlatarak başlıyor, ardından interaktif komponent özelliğinin sunduğu avantajları açıklıyor. Buton örnekleri üzerinden hover efekti, click efekti ve toggle gibi interaktif özelliklerin nasıl oluşturulacağını gösteriyor. Bu özellik sayesinde Figma'da sayfa içindeki küçük animasyonlar ve interaktif elemanlar oluşturulabiliyor, böylece prototipler daha gerçekçi hale geliyor.
Bu video, bir eğitim içeriği olup, konuşmacı Figma tasarım aracını tanıtmaktadır. Konuşmacı kendi tasarımlarını geliştirmek için Figma ve Adobe XD uygulamalarını kullanmaktadır.. Video, Figma'nın neden tercih edilmesi gerektiği sorusunu ele alarak başlıyor ve uygulamanın kullanım kolaylığı, cloud çalışma ortamı, prototype özelliği ve ücretsiz içerikler gibi avantajlarını anlatıyor. Ardından Figma'nın nasıl indirileceği gösteriliyor ve uygulamanın arayüzü, font seçimi, tasarım yapma ve export etme süreçleri adım adım açıklanıyor. Ayrıca Figma'nın mobil uygulama, sosyal medya ve Apple Watch gibi farklı platformlar için tasarım yapma imkanları da gösteriliyor.
Bu eğitim videosunda Ender, tasarım portfolyosu hazırlama ve platformlara yükleme konusunda bilgiler paylaşıyor.. Video, tasarım portfolyosunun doğru yapısını adım adım gösteriyor. İlk bölümde Behance platformu üzerinden portfolyo paylaşımının mantığı anlatılırken, ikinci bölümde portfolyoların tasarımcıların CV'si olarak nitelendirilmesi ve Behance, Dribbble gibi platformlara yükleme süreci detaylandırılıyor.. Videoda portfolyonun doğru yapılandırılması için proje hakkında genel bilgi, wiframe, design system, komponentler ve tasarım görselleri gibi bölümlerin nasıl hazırlanması gerektiği açıklanıyor. Ayrıca Figma'dan export etme, dosya boyutlarını ayarlama, etiketleme ve projeyi parçalara ayırma gibi teknik detaylar da paylaşılıyor.