Son videodan, bu sitenin tasarımına başlarken dikkate almamız gereken beş ana noktamız olduğunu biliyoruz. İlerlerken bunları aklımızda tutacağız.
Elbette "önce mobil" e başlıyoruz ve tasarımı Photoshop'ta bulmaya başlayacağız. Burada kalmayacağız, ancak Photoshop'taki yaratıcı araçlar, bir tasarım projesinin başlangıcında yaratıcı düşünme için mükemmeldir.
Mac'te XCode ile ücretsiz olarak gelen iOS simülatörünü açıyoruz. Bir masaüstü / dizüstü bilgisayarda web ve yerel uygulamaları test etmek içindir. Photoshop'ta bize bağlamsal bir tuval vermek için ekran görüntüsünü alabilmemiz için hızlı olmasını istiyoruz.
Kayıt için, önce “iPhone” u başlatmıyoruz, sadece etrafta tasarlamamız için uygun olan küçük bir ekran. İPhone'un boyutuna veya yeteneklerine fazlasıyla özgü hiçbir şey tasarlamayacağız.
Kendimize çalışabileceğimiz daha uzun bir tuval vermek için (siteyi "katın" yukarısında tutmaya gerek yok), telefonun altını kesip aşağı doğru sürükledik. Ardından, iPhone'un kenarlarından ince bir dilim alıp aşağı doğru sürükledik, yani esasen bu süper uzun (ancak eksiksiz) iPhone'umuz var.
Orijinal ekranın bittiği yerde bize ne kadar büyük olduğunu hatırlatmak için bir rehber bırakıyoruz. Evet, herkes kaydırır. Özellikle mobil cihazlarda. Ama yine de ilk ekranın neye benzediğini bilmek güzel.
Dosyalar
- # 004 - Phone Canvas.psd.zip
- # 004 - Ham Fotoğraflar.zip