0:00
Herkese merhaba. İnternetin bir zamanlar
0:02
sadece bilgi okuduğumuz dev bir
0:04
kütüphane olduğunu ama şimdi hepimizin
0:06
içerik ürettiği, paylaştığı interaktif
0:09
bir platforma dönüştüğünü fark ettiniz
0:10
mi? İşte bugün bu müthiş dönüşümün
0:12
ardındaki dinamikleri yani modern web'i
0:15
birlikte anlayacağız. Tamamdır. O zaman
0:17
hazırsak bugünkü yol haritamıza bir göz
0:20
atalım. Önce web'in geçirdiği o büyük
0:22
değişimle başlayacağız. Sonrasında
0:24
insanı merkeze alan tasarım felsefesine,
0:27
ardından bu tasarımları hayata geçiren
0:29
modern araçlara ve en sonunda da tüm bu
0:31
sistemlerin birbirine nasıl bağlandığına
0:33
bakacağız. Haydi başlayalım. Her şeyin
0:36
temelindeki o büyük değişim neydi? Önce
0:39
onu bir anlayalım. Peki bu ne demek tam
0:42
olarak? Şöyle bir düşünelim. İnternetin
0:44
ilk zamanları yani web1.0 adeta tek
0:47
yönlü bir cadde gibiydi. Önünüze konan
0:50
bilgiyi sadece okuyabiliyordunuz. O
0:52
kadar. Ama web 2.0 ile birlikte işler
0:55
tamamen değişti. O tek yönlü cadde artık
0:58
karşılıklı bir diyaloğa, çift yönlü bir
1:00
otobana dönüştü. Artık hepimizin elinde
1:02
birer kalem var ve o devasa beyaz
1:04
tahtaya hepimiz bir şeyler
1:06
çizebiliyoruz. Yani artık sadece birer
1:08
okur değil, aynı zamanda yazarız,
1:10
yaratıcıyız. İyi de kodlama bilmeyen
1:13
milyonlarca insan bir anda nasıl içerik
1:16
üreticisi olabildi? İşte bu sorunun
1:18
cevabı içerik yönetim sistemlerinde yani
1:21
kısaca CMS'lerde saklı. Bu sistemler
1:24
adeta birer sihirli değnek gibi teknik
1:27
bilgisi olmayan insanlara bile kendi web
1:29
sitelerini kurma, yönetme ve dünnyaile
1:31
bir şeyler paylaşma gücü verdi. Bu
1:33
alanın en popüler ve en bilinen örneği
1:36
de şüphesiz WordPress. Peki WordPress'in
1:39
sırrı ne? Sadece kullanım kolaylığı
1:41
değil, aynı zamanda açık kaynak
1:43
felsefesi. GPI denilen bir lisans
1:46
sayesinde herkes WordPress'i ücretsiz
1:49
kullanabiliyor, üzerinde değişiklik
1:51
yapabiliyor hatta başkalarıyla
1:53
paylaşabiliyor. İşte bu özgürlük
1:55
etrafında devasa bir geliştirici ve
1:57
tasarımcı topluluğu yarattı. Unutmamamız
2:00
gereken en önemli nokta da şu: Hangi
2:02
harika aracı kullanırsanız kullanın her
2:05
şeyden önce strateji gelir. Kendinize şu
2:07
soruları sormalısınız. Ben bu siteyle
2:09
neyi başarmak istiyorum ve kime
2:13
Stratejimiz hazırsa şimdi işin biraz
2:16
daha sanat ve bilimle iç içe geçtiği bir
2:18
alana dalalım. Kullanıcı deneyimi yani
2:21
bir web sitesini sadece işlevsel değil
2:24
aynı zamanda keyifli kılan o insan
2:26
odaklı felsefeye. Başarılı bir web
2:29
sitesi yaratmanın aslında çok net bir
2:31
yolu var. Her şey neden sorusuyla
2:34
başlar. Sonra sitenin yapısı yani
2:36
iskeleti gelir. Görsel tasarım yani o
2:39
güzel renkler ve butonlar ancak bu
2:42
sağlam temel atıldıktan sonra devreye
2:44
girer. Ters çerçeve dediğimiz şeyi bir
2:47
mimarın çizdiği kat planı gibi
2:49
düşünebilirsiniz. O planda duvarların
2:51
boya rengi yoktur değil mi? Sadece
2:53
odaların, kapıların, pencerelerin nerede
2:55
olacağı bellidir. İşte tel çerçevede tam
2:58
olarak bunu yapar. bir sayfanın temel
3:00
yapısını ve düzenini gösterir. İşte
3:03
sihrin başladığı yer tam da burası. Bir
3:05
beğen butonuna tıkladığınızda çıkan o
3:08
minicik animasyon ya da bir formu
3:10
doldurduğunuzda beliren o yeşil tik
3:12
işareti. Bunlar basit görünebilir ama
3:15
aslında kullanıcı deneyiminin ruhunu
3:17
oluşturur. Bu mikro etkileşimler
3:19
sayesinde web sitesi sizinle konuşur,
3:22
size tepti verir ve bütün deneyimi çok
3:25
daha insani kılar. Tabii ki
3:27
tasarımcıların elindeki tek numara
3:29
bunlar değil. Mesela sayfayı aşağı
3:31
kaydırırken içeriklerin hoş
3:33
animasyonlarla belirmesi yani reveal
3:36
efektleri merak uyandırır veya sesli
3:39
komutlarla siteyi kullanabilmek hem hızı
3:41
arttırır hem de herkes için
3:43
erişilebilirliği sağlar. Ve tabii ki iyi
3:46
çalışan bir arama kutusu büyük siteler
3:48
için olmazsa olmazdır. Peki tüm bu
3:52
tasarım ilkelerini anladık. Şimdi sıra
3:55
geldi bu fikirleri hayata geçirmemizi
3:57
sağlayan o güçlü ve modern araçlara bir
4:00
göz atmaya. Figma bu alanda adeta bir
4:03
devrim yarattı. Neden mi? Çünkü
4:05
tasarımcılar, yazılımcılar, proje
4:08
yöneticileri herkes aynı dosya üzerinde
4:11
aynı anda gerçek zamanlı olarak
4:13
çalışabiliyor. Bu aradaki bütün o
4:15
iletişim kopukluklarını ortadan
4:17
kaldırıyor. Şimdi Figman'ın asıl sihrine
4:20
gelelim. Ana bileşen diye bir özelliği
4:23
var. Düşünün bir düğmenin tasarımını
4:25
yaptınız ve 100 farklı yerde
4:27
kullandınız. Sonra rengini değiştirmek
4:29
istediniz. Tek tek 100 düğmeyi mi
4:32
değiştireceksiniz? Hayır. Ana bileşeni
4:34
değiştiriyorsunuz. Hepsi anında
4:36
güncelleniyor. Muazzam. Geliştirici
4:39
moduysa tasarımcının çizdiği şeyi direkt
4:41
koda çeviriyor. Yazılımcının işini
4:43
inanılmaz kolaylaştırıyor. Dilim aracı
4:46
da cabası. Bütün sayfayı değil de sadece
4:48
o küçük logoyu mu almak istediniz? tık
4:50
alıyorsunuz. Kısacası bu özellikler
4:53
sayesinde fikirle onu hayata geçirmek
4:55
arasındaki o uzun yol kısalıyor. Sırada
4:58
kanva var. Kanva yapay zekanın gücünü
5:01
hepimizin kullanımına sunuyor. Sihirli
5:03
düzenleme özelliğiyle bir fotoğrafa
5:06
sadece bu elbiseyi kırmızı yap gibi bir
5:08
komut yazarak inanılmaz değişiklikler
5:13
Eğer elinizde karmaşık veriler, tablolar
5:16
varsa infogram sizin için biçilmiş
5:18
gaftan. Sıkıcı rakamları herkesin bir
5:21
bakışta anlayabileceği ilgi çekici ve
5:24
profesyonel grafiklere dönüştürmenizi
5:26
sağlıyor. Hem de tek bir satır kod
5:28
yazmadan. Ve işte size altın değerinde
5:31
bir ipucu. Görsellerinizi optimize edin.
5:34
Büyük bir resim dosyası sitenizi
5:36
yavaşlatır ve ziyaretçileri kaçırır. Ama
5:38
doğru sıkıştırılmış hafif bir dosya
5:41
sitenizin hızla açılmasını sağlar. Bu
5:43
küçük detay ziyaretçilerinizin sitenizde
5:46
kalıp kalmayacağını belirleyebilir.
5:48
Tamam. Harika web sitelerimiz ve
5:49
uygulamalarımız var. Peki bu farklı
5:51
parçalar bir araya gelip nasıl daha
5:53
büyük ve daha güçlü bir ekosistem
5:55
oluşturuyor? İşte şimdi son bölümümüzde
5:57
web'in bu bağlantı noktalarını
5:59
keşfedeceğiz. Modern interneti bir arada
6:02
tutan sihirli bir yapıştırıcı var. Adı
6:05
API. API'ları farklı diller konuşan
6:08
programların birbiriyle anlaşmasını
6:10
sağlayan birer evrensel çevirmen gibi
6:12
düşünebilirsiniz. Onlar web'in görünmez
6:15
teknik köprüleridir. Aslında APİ'ların
6:18
gücünü her gün deneyimliyoruz. Mesela
6:20
telefonunuzdan bir araç çağırdığınızda o
6:22
uygulama harita için Google Maps'in
6:24
apisine, ödeme yapmak için bankanızın
6:26
apisini kullanır. Farklı servisleri bir
6:28
araya getirerek size sorunsuz bir
6:30
deneyim sunan bu görünmez bağlantılar
6:32
işte tam olarak API'lerin eseridir. İşte
6:35
uygulamaların bu şekilde birbirine
6:37
bağlanabilme yeteneği yepyeni bir
6:39
ekonomik model yarattı. Paylaşım
6:41
ekonomisi. İnsanların arabalarını,
6:44
evlerini yani kendi kaynaklarını
6:46
başkalarıyla paylaşarak gelir elde
6:48
etmesini sağlayan bu model tamamen Web
6:50
2.0'ın o katılımcı ruhu üzerine kurulu.
6:53
Bu bağlantı ve entegrasyonu sadece küçük
6:56
uygulamalar arasında değil, dev
6:58
şirketler düzeyinde de görüyoruz. Mesela
7:01
bir zamanların bağımsız web sitesi kurma
7:03
aracı Wibly ödeme devi Square tarafından
7:06
satın alındı. Artık VIB'de bir e-ticaret
7:09
sitesi kurduğunuzda aslında Square'in
7:11
güçlü altyapısını kullanmış oluyorsunuz.
7:13
Sonuç olarak şunu net bir şekilde
7:15
görebiliyoruz. Web artık sadece bilgi
7:18
tükettiğimiz tek yönlü bir yayın
7:20
olmaktan çıktı. Hepimizin bir şeyler
7:22
üretebildiği devasa işbirlikçi bir
7:24
tuvalete dönüştü. Araçlar hiç olmadığı
7:27
kadar güçlü ve erişilebilir. Peki bu
7:30
tuvalet siz ne çizeceksiniz? Hangi
7:32
hikayeyi anlatacaksınız?