UI / UX Tasarımcısı
DİJİTAL TASARIMGörsel arayüz tasarımı ve kullanıcı deneyimi stratejileri. Figma uzmanlığından kullanıcı araştırmalarına kapsamlı rehber.
Aşama 1: UI Tasarım Temelleri ve Kurallar
Hizalama, Hiyerarşi ve Görsel DengeGörsel Hiyerarşi (Visual Hierarchy)
Kullanıcının gözünü yönlendirme sanatı.
Hizalama (Alignment) ve Grid Sistemleri
Düzenli ve profesyonel arayüzler.
Beyaz Boşluk (White Space) Kullanımı
Tasarımın nefes almasını sağlama.
Denge (Balance): Simetrik ve Asimetrik
Arayüzün ağırlık merkezini kurma.
Kontrast ve Erişilebilirlik (Accessibility)
Herkes için okunabilir tasarımlar.
Tekrarlama ve Tutarlılık (Consistency)
Kullanıcıyı yormayan akışlar.
Vurgu (Emphasis) ve Odak Noktaları
CTA (Call to Action) tasarımı.
Yakınlık (Proximity) İlkesi
Bilgi mimarisini görselleştirme.
Ölçekleme (Scaling) ve Orantı
Öğeler arasındaki büyüklük ilişkisi.
UI Analizi: İyi ve Kötü Örnekler
Piyasayı okuma yetisi kazanma.
Aşama 2: Renk Teorisi ve Tipografi
Okunabilirlik ve Duygusal TasarımRenk Psikolojisi ve Marka Kimliği
Renklerin kullanıcıdaki duygusal karşılığı.
UI vs UX: Temel Farklar
Arayüz ve Deneyim ayrımı.
Renk Harmonileri: Complementary, Analogous
Göz yormayan uyumlu renk seçimleri.
Tasarım Odaklı Düşünme (Design Thinking)
İnsan merkezli çözüm.
Monokromatik ve Nötr Renk Tasarımı
Sade ve lüks tasarımların sırrı.
Tipografi Temelleri: Serif vs Sans Serif
Font ailelerini tanıma.
Font Eşleştirme (Font Pairing) Sanatı
Başlık ve metin fontu uyumu.
Okunabilirlik: Line Height ve Kerning
Harf ve satır arası boşluklar.
Tipografik Hiyerarşi (H1, H2, Body)
Metinlerin önem sırası.
Renk Erişilebilirliği (Color Contrast Test)
Görmeyi kolaylaştırma.
Dijitalde Renk Uzayları: RGB vs HEX
Ekran renk kodları.
Variable Fonts (Değişken Fontlar)
Tek dosya ile sonsuz font ağırlığı.
Custom Font Yükleme ve Kullanımı
Figma'da yerel fontların yönetimi.
Aşama 3: Figma Mastery - Temeller
Frame, Auto Layout ve Temel AraçlarFigma Arayüzü ve Frame Mantığı
Artboard'dan Frame dünyasına geçiş.
Görsel Hiyerarşi Kuralları
Elemanların öncelik sırası.
Auto Layout - Temeller
Kendi kendine boyutlanan tasarımlar.
Görsel Denge ve Simetri
Ağırlık merkezi yönetimi.
Constraints ve Resizing
Farklı ekran boyutlarına uyum.
Katman (Layer) Yönetimi ve Adlandırma
Tertemiz bir tasarım dosyası.
Pen Tool ve Vektör Networkleri
İkon ve özel şekiller çizme.
Masking ve Boolean Operations
Karmaşık şekiller oluşturma.
Efektler: Drop Shadow ve Blur
Derinlik ve cam (glassmorphism) etkisi.
Görüntü (Image) ve Video Yerleştirme
Fill modları ve düzenleme.
Figma Community ve Pluginler
Hızlanmak için topluluk gücü.
Klavye Kısayolları (Key Shortcuts)
Işık hızında tasarım.
Grup Çalışması ve Versiyon Geçmişi
Aynı dosyada multi-player çalışma.
Aşama 4: İleri Figma - Components & Variants
Yeniden Kullanılabilir Yapılar ve KütüphanelerMaster Component Mantığı
Tasarımın DNA'sı.
Varyantlar (Variants) ile Buton Setleri
Durum yönetimi.
Component Properties (Boolean, Text)
Akıllı bileşenler.
Aşama 5: Tasarım Sistemleri (Design Systems)
Atomik Tasarım ve Stil RehberleriRenk Teorisi ve Psikolojisi
Renklerin duygusal etkisi.
Atomik Tasarım (Atomic Design) Metodolojisi
Kimyasal tasarım.
Modern Tipografi Seçimi
Okunabilirlik ve Karakter.
Tasarım Jetonları (Design Tokens) Nedir?
Yazılımla köprü.
Aşama 6: Responsive ve Adaptive Design
Mobil, Web ve Tablet UyumluluğuFigma Arayüzüne Hakimiyet
Editörün temelleri.
Figma Auto Layout Uzmanlığı
Dinamik arayüzler.
Auto Layout Mucizesi
Dinamik tasarımlar yapma.
Components ve Tasarım Kitaplığı
Yeniden kullanılabilirlik.
Components ve Variants
Yeniden kullanılabilirlik.
Styles (Renk ve Metin)
Global kütüphaneler.
Figma Community ve Pluginler
Hızlandırıcı araçlar.
Collaborative Design (Ortak Çalışma)
Ekip içi paylaşım.
Constraints: Ekran Uyumluluğu
Responsive mantığı.
İmporting and Exporting
Dosya alışverişi.
Version History: Geri Dönüş
Hatalardan kurtulma.
Figma FigJam: Beyin Fırtınası
Whiteboard kullanımı.
Mobile Prototyping App
Cihazda test etme.
Bilgi Sorumluluktur
buyoldan.com tarafından sunulan bu yol haritaları, yalnızca öğrenme sürecini kolaylaştırmak amacıyla hazırlanan birer rehber ve tavsiye niteliğindedir. Konular zamanla güncellenebilir, değişebilir veya sınav sistemlerine göre farklılık gösterebilir. Hedefine ulaşırken yalnızca buradaki içeriklerle yetinmemeni, resmi kaynakları ve güncel müfredatları da düzenli olarak araştırmanı şiddetle öneririz. Kendi yolunu çizmek senin elinde!
Buna Da Göz At
Blender ile 3D Modelleme ve Animasyon
Blender arayüzünü tanımaktan başlayıp poligon modellemeden sculpting'e, materyal ve aydınlatmadan render'a, rigging ve karakter animasyonundan simülasyon ve kompozisyona kadar sıfırdan profesyonel düzeye uzanan eksiksiz Blender rehberi.
Adobe Photoshop: Görsel Düzenleme ve Raster Tasarım
Arayüzü tanımaktan katman ustalığına, rötuştan renk teorisine, kompozisyondan baskı ve web ihracatına kadar Photoshop'u sıfırdan gerçek projelere taşıyan akıcı ve pratik yol haritası.
Adobe Illustrator: Vektör Tasarım
Kalem aracından logo tasarımına, tipografiden ikonografiye, renk teorisinden baskı ve dijital ihracata kadar Illustrator'u profesyonel düzeyde kullanmak için adım adım vektör tasarım rehberi.