Ja tämän saimme…

5.png

Tämä ei kuitenkaan anna meille tarpeeksi syvyyttä. Haluamme tehdä tästä suorakaiteesta entistä näkyvämmin kaarevan, koska se ei kosketa pintaa tasaisesti, vaan lisäämällä varjoa tasotyylien avulla tai varjon vahvistaminen ei anna meille toivottua vaikutusta. Käytä tätä vaakasuora jakaja tarjoaa dezinpolio.com ja lisää se muotosi keskikohtiin, jotta se "haalistuu" kulmia kohti, kuten alla on esitetty:

6.png

Muistatko, että mainitsimme lihavoidut kirjaimet? Web 2.0 käyttää hyvin fontteja, mieluiten erittäin helppolukuisia, hieman sarjakuvamaisia ​​ja rohkeita. Meillä oli vaikeuksia valita sopivaa fonttia ja päätimme valita "Cooper Std".

7.png

Teemme lisäämässä erittäin mietoa varjoa (#5674a7) ja vaalea gradientti valkoisesta yläreunassa (#FFFFFF) vaaleansiniseksi (#cdd9de)…

8.png

9.png

lippu

Tämä antaa meille erittäin söpön vauvamallin.

10.png

Web 2.0:ssa on myös hyvä osuus, ja vaikka mallit ovat erityisen epäsymmetrisiä, toiset ovat niin sanotusti pakkomielteisen symmetrisiä. Pidän enemmän toisesta tyypistä, koska sen luomiseen tarvitaan vähemmän omaperäisyyttä ja makua, tarvitset vain suhteellisuudentajua. Oletetaan, että lisäämme muutaman painikkeen suunnittelumme ala- ja sivukulmaan…

11.png

Näyttääkö tämä hyvältä?

12.png

Ei, koska välilehdet näyttävät liian kaoottisilta, joten varmistamme, että vasemman puolen välilehden rivi ”vastaa” alemman välilehden linjan, näin…

131.png

Nyt se näyttää suhteelliselta.

crystal_clear_app_ark2.png

lippu

Jos ihmettelet, miksi jätimme väliin, välilehtien tasotyylit ovat lähes identtisiä pääsuorakulmion tasotyylien kanssa, ja sama pätee "välilehtien" fontti- ja tasotyyliin. Oppimistarkoituksiin voit ladata PSD-tiedoston ja analysoida prosessia. Muista, että kaikki nämä puolinäkyvät gradientit ja 1px ääriviivat ovat usein se, mikä tekee eron loistavan web-suunnittelun ja kypsän suunnitteluyrityksen välillä. Onnea!

lataa psd-tiedosto