# 004 - Photoshopi lõuend - CSS-trikid

Anonim

Viimasest videost teame, et selle saidi kujundamisel tuleb arvestada viie suurema punktiga. Hoiame neid edasi liikudes oma mõtte tipus.

Loomulikult alustame kõigepealt mobiiliga ja hakkame kujundust välja selgitama Photoshopis. Me ei viitsi seal, kuid Photoshopi loomingulised tööriistad sobivad suurepäraselt loominguliseks mõtlemiseks juba disainiprojekti alguses.

Avame iOS-i simulaatori, mis on XCode'iga tasuta saadaval Macis. See on mõeldud veebi ja kohalike rakenduste testimiseks laua- / sülearvutis. Soovime seda lihtsalt kiiresti, et saaksime sellest ekraanipildi teha, et anda meile Photoshopis kontekstipõhine lõuend.

Kokkuvõtteks võib öelda, et me ei käivita kõigepealt iPhone'i, vaid see on vaid väike ekraan, mida on mugav meile kujundada. Me ei kujunda midagi, mis oleks liiga spetsiifiline iPhone'i suurusele või võimalustele.

Selleks, et anda endale tööle kõrgem lõuend (pole vaja piirduda saidi „voltimise” kohal), lõikasime telefoni põhja ja lohistasime selle alla. Seejärel võtame õhukese viilu iPhone'i servadest ja lohistame need alla, nii et sisuliselt on meil see ülipikk (kuid täielik) iPhone.

Jätame juhendi kohale, kus algne ekraan lõppes, et tuletada meelde, kui suur see oli. Jah, kõik kerivad. Eriti mobiilis. Kuid ikkagi on tore teada, kuidas see esimene ekraan välja näeb.

Toimikud

  • # 004 - telefoni lõuend.psd.zip
  • # 004 - Toored fotod. Zip