Rengeteg oktatóanyag és útmutató található az interneten, amelyek megtanítják Önnek a web 2.0 tervezésének hatékony kihasználását. Bár a legtöbb ilyen oktatóanyag hasznos, ugyanakkor megöli a webdesign eredetiségét. Például a legtöbb „útmutató” azt mondja, hogy a web 2.0 a fényes jelvényről, a csíkos háttérről és a félkövér betűtípusokról szól. Eredmény? Számtalan több száz minta létezik kitűzőkkel, csíkokkal és vastag, nagy betűkkel… és ezek semmiben sem különböznek egymástól. Nem számít, hogy web 2.0-s, web 1.0-s vagy web 75.0-s dizájnt készítesz, mindennek az eredeti és emlékezetesnek kell lennie.

Ha azonban nem igazán találsz semmi különösebben eredetit, ami a designod szimbolizálná, akkor „biztonságosabb” a webdizájn jelenlegi trendjeihez menni. Tehát itt van egy nagyon kis töredéke a webdesign elrendezésnek, és hogyan lehet a szokásos elrendezést web 2.0-s elrendezéssé alakítani.

Ez volt nálunk…

14.png

És ezt fogjuk tenni…

13.png

Photoshopban fogunk dolgozni, csak rétegstílusokat használunk; enyhe színátmenetekre és árnyékokra összpontosítva.

Kezdje a lekerekített sarkú téglalap alakzat használatával, és rajzoljon egy… téglalapot.

1.jpg

Transzparens

Először azt kell tennünk, hogy a téglalapunknak némi mélységet és életet kell adnunk. A web 2.0 tervezési elveit követve csak az árnyékok, a körvonalak és a világos színátmenetek biztosítják ezt a hatást. Tehát lépjen a rétegstílusokhoz, és vessen egy kis enyhe árnyékot. Használtuk #96aed6 erre a célra.

2.png

Hogy egy kis mélységet adjon az alaknak (hogy ne tűnjön lapos tárgynak), adjon hozzá enyhe belső árnyékot, sötétebb tónussal (mi használtuk #304f82 )

3.png

Végül fontos hozzá egy kis vázlat. Az #FFFFFF fehér színt fogjuk használni, mivel mindkét oldalról sötétebbek az árnyékaink, ezért szeretnénk egy világos és félig látható vonalat, ami kontúrozza a formát.

4.png