iPhone İçin Chat Uygulaması UI Tasarımı

Adım adım Photoshop ve Illustrator'de Mobil UI Tasarımı
Rating: 4.4 out of 5 (145 ratings)
8,241 students
iPhone İçin Chat Uygulaması UI Tasarımı
Rating: 4.4 out of 5 (145 ratings)
8,241 students
Login ekranı wireframe’ni hazırlamak
Menu ekranı wireframe’ni hazırlamak
Chat List ekranı wireframe’ni hazırlamak
Chat ekranı wireframe’ni hazırlamak
Iconlar için dosya oluşturmak ve Grid ayarlarını düzenlemek
Icon Guideline oluşturmak ve Layer penceresini organize etmek
Chat icon’u çizmek
Favorite List icon’u çizmek
Recents icon’u çizmek
Contact List icon’u çizmek
Settings iconu çizmek
Share icon’u çizme
Blur background hazırlamak
Login ekranı Dropdown menu ve Text input elemanlarını tasarlamak
Send butonu hazırlamak
Kullanıcı profil imajı alanı ve status bilgileri bölümünü hazırlamak
Menu icon’larını Illustrator’den import etmek
Smart Obje nedir?
Chat List Header tasarımı
Kullanıcı avatar ve status durumunu yerleştirmek
Mesaj durumlarını belirlemek
Diğer olası durumları belirlemek
Chat ekranı Header tasarımı
Tek satır text mesaj alanı tasarlamak
Çoklu satır text alanı tasarlamak
Mesaj ve fotoğraf önizleme alanı tasarlamak
Sesli mesaj alanı için görsel tasarım
Mesaj gönderim alanını tasarlamak
Tüm ekranların layer’larını türlerine göre gruplamak
Sayfaları PNG export etmek
Online Mockup aracı ile sayfa geçişlerini online test etmek

Requirements

  • Temel Photoshop ve Illustrator bilgisi
  • UI konusunda başlangıç seviyesinde olanlar
Description

Adım adım mobil ortamı için bir uygulamanın UI Tasarımı nasıl yapılır ve UI tasarımı yaparken dikkat etmeniz gereken genel bilgileri bulabilceksiniz. Ayrıca UI elemanları dizayn ederken, hizalamadan planlamaya kadar bir çok süreci görebileceksiniz.

  • Wireframe'ler hazırlamak
  • Görseller oluşturmak
  • Icon'lar çizmek
  • UI elemanları yerleşimde neler dikkate alınır
  • Efektler
  • İnteraktif durumları tasarlamak
  • Hizalamalar ve text size'larını belirmek
  • Planlamalar yapmak
  • Programlar arasında ortak geçişler
  • Butonlar tasarlamak
  • Alternatifler üretmek
  • Artboard'lar ile çalışmak
  • Mockup denemeleri
Who this course is for:
  • Photoshop'da UI tasarımı ile ilgilenenler
  • Illustrator çizim elemanları hakkında bilgi almak isteyenler
  • UI tasarımı konusunda uzmanlaşmak isteyenler
  • Mobil UI tasarımı ilgi alanları olanlar
Course content
8 sections • 46 lectures • 5h 36m total length
  • Kurs Programı
    04:42
  • Adobe Photoshop Artboard yapısına genel bir bakış
    05:48
  • Adobe Photoshop program arayüz ayarları
    06:32
  • Adobe Illustrator Artboard yapısına genel bir bakış
    04:19
  • Adobe Illustrator arayüz ayarları
    02:50
  • Login ekranı wireframe’ni hazırlamak
    05:44
  • Menu ekranı wireframe’ni hazırlamak
    05:48
  • Chat List ekranı wireframe’ni hazırlamak
    09:21
  • Chat ekranı wireframe’ni hazırlamak
    05:50
  • Iconlar için dosya oluşturmak ve Grid ayarlarını düzenlemek
    06:31
  • Icon Guideline oluşturmak ve Layer penceresini organize etmek
    08:21
  • Chat icon’u çizmek
    12:19
  • Favorite List icon’u çizmek
    02:36
  • Recents icon’u çizmek
    03:35
  • Contact List icon’u çizmek
    13:19
  • Settings iconu çizmek
    08:05
  • Share icon’u çizmek
    06:36
  • Take Photo icon’u çizmek
    05:36
  • Voice Recod icon’u çizmek
    03:27
  • Call icon’u çizmek
    07:30
  • Blur background hazırlamak
    05:10
  • Uygulamanın logosunu tasarlamak
    12:34
  • Login ekranı Dropdown menu ve Text input elemanlarını tasarlamak
    07:15
  • Info text alanını eklemek ve info icon’u çizmek
    09:45
  • Send butonu hazırlamak
    06:02
  • Kullanıcı profil imajı alanı ve status bilgileri bölümünü hazırlamak
    10:09
  • Menu icon’larını Illustrator’den import etmek
    03:09
  • Menu text ve icon yerleşimlerini hazırlamak
    06:52
  • Smart Obje nedir?
    04:56
  • Chat List Header tasarımı
    09:05
  • Listenin ilk satırını tasarlamak
    12:58
  • Kullanıcı avatar ve status durumunu yerleştirmek
    09:11
  • Mesaj durumlarını belirlemek
    04:44
  • Diğer olası durumları belirlemek
    02:18
  • Menünün hangi fonksiyonu taşıyacağını tasarlamak
    04:30
  • New Chat icon’u çizmek
    09:43
  • New Group icon’u çizmek
    10:29
  • Buton durumlarını tasarlamak
    12:44
  • Chat ekranı Header tasarımı
    09:10
  • Tek satır text mesaj alanı tasarlamak
    09:24
  • Çoklu satır text alanı tasarlamak
    05:58
  • Mesaj ve fotoğraf önizleme alanı tasarlamak
    03:38
  • Sesli mesaj alanı için görsel tasarım
    12:02
  • Mesaj gönderim alanını tasarlamak
    11:13
  • Sayfaları PNG export etmek
    07:20
  • Online Mockup aracı ile sayfa geçişlerini online test etmek
    07:24

Instructor
UI / UX Designer
Ramazan Yildiz
  • 4.4 Instructor Rating
  • 589 Reviews
  • 15,982 Students
  • 3 Courses

2003'den bu yana konvansiyonel ve dijital bir çok reklam ajansında grafiker ve UI tasarım uzmanı olarak çalıştım. Son 5 yıl ise oyun sektöründe UI Direktör olarak görevler aldım. UI ve UX alanında bir çok freelance ve tam zamanlı projelerde yer aldım. Şu an yurtdışında online bankacılık alanında bir firmaya UX danışmanlığı yapmaktayım.