Dersin Ayrıntıları
YarıyılKoduAdıT+U+LKrediAKTSSon Güncelleme Tarihi
3VTK 205Web Grafik Tasarımı1+2+02312.10.2026
Dersin Detayları
Dersin Dili Türkçe
Dersin Düzeyi Ön Lisans
Bölümü / Programı Web Tasarımı ve Kodlama
Öğrenim Türü Örgün Öğretim
Dersin Türü Zorunlu
Dersin Öğretim Şekli Yüz Yüze
Dersin Amacı Web Grafik Tasarımı dersi, web projeleri için estetik, işlevsel ve kullanıcı odaklı grafik tasarımları oluşturmayı öğretir. Bu ders, renk teorisi, tipografi, görsel hiyerarşi ve kullanıcı deneyimi (UX) odaklı tasarım ilkelerine odaklanır. Öğrenciler, Adobe Photoshop, Illustrator ve Figma gibi popüler tasarım araçlarını kullanarak web projelerine uygun grafikler, ikonlar, arayüz bileşenleri ve mockup ` lar oluşturmayı öğrenirler.
Dersin İçeriği Öğrencilerin görsel tasarım ilkelerini anlayarak, web tasarımı için profesyonel düzeyde grafik içerikler oluşturma becerilerini geliştirmektir.
Dersin Yöntem ve Teknikleri Anlatım
Soru-Cevap
Tartışma
Gösterip Yaptırma
Uygulamalı Laboratuvar Çalışmaları
Bireysel Uygulamalar
Proje Tabanlı Öğrenme
Problem Çözme
Örnek Olay (Vaka) İncelemesi
Bilgisayar Destekli Öğretim
Ön Koşulları Yok
Dersin Koordinatörü Öğr.Gör. Havva Sarı havva.sari@ankarabilim.edu.tr
Dersi Verenler Öğr.Gör. HAVVA SARI
Dersin Yardımcıları Yok
Dersin Staj Durumu Yok

Ders Kaynakları
Kaynaklar https://www.figma.com/
Ders Notları Öğretim elemanı tarafından hazırlanan ders sunumları, uygulama notları, örnek kodlar ve ek kaynaklardan yararlanılacaktır.

Ders Yapısı
Mühendislik Bilimleri %25
Mühendislik Tasarımı %75

Planlanan Öğrenme Aktiviteleri ve Metodları
Etkinlikler ayrıntılı olarak "Değerlendirme" ve "İş Yükü Hesaplaması" bölümlerinde verilmiştir.

Değerlendirme Ölçütleri
Yarıyıl Çalışmaları Sayısı Katkı
Ara Sınav 1 % 30
Uygulama 5 % 30
Proje 1 % 10
Yarıyıl Sonu Sınavı 1 % 30
Toplam :
8
% 100

 
AKTS Hesaplama İçeriği
İş Yükü Sayısı Süre Toplam İş Yükü (Saat)
Ders Süresi 15 3 45
Sınıf Dışı Ç. Süresi 15 1 15
Ödevler 2 3 6
Ara Sınavlar 1 5 5
Uygulama 5 1 5
Laboratuvar 5 1 5
Proje 1 4 4
Yarıyıl Sonu Sınavı 1 5 5
Toplam İş Yükü   AKTS Kredisi : 3 90

 
Dersin Öğrenme Çıktıları: Bu dersin başarılı bir şekilde tamamlanmasıyla öğrenciler şunları yapabileceklerdir:
Sıra NoAçıklama
1 1. Görsel tasarım ilkelerini (renk, tipografi, kompozisyon, hiyerarşi) açıklar ve uygular.
2 2. Photoshop, Illustrator ve Figma kullanarak web projelerine uygun grafik bileşenler tasarlar.
3 3. UI ve UX prensiplerine uygun arayüz tasarımları geliştirir.
4 4. Responsive tasarım prensiplerine uygun grafik içerikler üretir ve optimize eder.
5 5. Web projeleri için uygun dosya formatlarını seçer ve performans odaklı görsel optimizasyon uygular.

 
Ders Konuları
HaftaKonuÖn HazırlıkDökümanlar
1 Web Grafik Tasarımına Giriş • Grafik tasarım ve web tasarımı arasındaki farklar. • Web grafik tasarımında kullanılan temel araçlar ve yazılımlar.
2 Renk Teorisi ve Web Tasarımı • Renklerin psikolojik etkileri ve anlamları. • Web projelerinde renk paletleri oluşturma ve renk uyumu sağlama.
3 Tipografi ve Yazı Tipleri • Web tipografisi ilkeleri. • Yazı tiplerinin seçimi, okunabilirlik ve erişilebilirlik.
4 Görsel Hiyerarşi ve Düzenleme Teknikleri • Görsel hiyerarşi nedir? • Düzenleme ve grid sistemleriyle tasarımda denge oluşturma.
5 Adobe Photoshop ile Web Tasarımı • Photoshop’ta temel araçlar ve teknikler. • Web projeleri için görseller ve banner tasarımı.
6 Adobe Illustrator ile Vektör Grafikler • Vektör grafiklerin avantajları ve kullanımı. • Web ikonları ve logoların tasarımı.
7 Figma ile Arayüz Tasarımı • Figma’ya giriş ve temel özellikler. • Prototip oluşturma ve arayüz tasarımı.
8 Vize
9 :Web için Görsel Optimizasyonu • Görsel dosya formatları (JPEG, PNG, SVG, WEBP). • Performans artırımı için görsel optimizasyon teknikleri.
10 UI (Kullanıcı Arayüzü) ve UX (Kullanıcı Deneyimi) Tasarımı • UI ve UX arasındaki farklar. • Kullanıcı dostu grafik tasarımlar oluşturma.
11 İkon Tasarımı ve Kullanımı • Minimalist ve etkili ikon tasarım ilkeleri. • İkon setlerinin web projelerinde kullanımı.
12 Responsive Grafik Tasarımı • Duyarlı (responsive) tasarım için grafik oluşturma. • Farklı cihazlar için görsellerin uyarlanması.
13 Animasyon ve Mikro Etkileşimler • CSS ve JavaScript ile animasyonların tasarıma entegrasyonu. • Animasyonların kullanıcı deneyimine katkısı.
14 Proje Geliştirme • Bir web grafik tasarımı projesi geliştirme. • Tasarım bileşenlerinin tamamlanması ve değerlendirilmesi.
15 Final Sınavı

 
Sürdürülebilir Kalkınma Amaçları
Dersin Program Çıktılarına Katkısı
P1 P2 P3 P4 P5 P6 P7 P8 P9 P10 P11 P12 P13 P14 P15 P16
Tüm 5 2 5 4 4 5 4 4 3 3 4 5 5 5 5 5
Ö1
Ö2
Ö3
Ö4
Ö5

  Katkı Düzeyi: 1: Çok Düşük 2: Düşük 3: Orta 4: Yüksek 5: Çok Yüksek