Ёсць так шмат падручнікаў і кіраўніцтваў у Інтэрнэце, якія навучаць вас, як эфектыўна выкарыстоўваць дызайн Web 2.0. Хаця большасць гэтых падручнікаў карысныя, у той жа час яны забіваюць арыгінальнасць вэб-дызайну. Напрыклад, большасць «гідаў» кажуць вам, што Web 2.0 - гэта глянцавы значок, паласаты фон і паўтлустыя шрыфты. Вынік? Ёсць незлічоныя сотні дызайнаў са значкамі, палосамі і вялікімі тлустымі літарамі... і яны нічым не адрозніваюцца адзін ад аднаго. Не мае значэння, які вы ствараеце дызайн Web 2.0, Web 1.0 або Web 75.0, усё зводзіцца да таго, каб быць арыгінальным і запамінальным.

Аднак, калі вы сапраўды не можаце знайсці нічога асабліва арыгінальнага, што сімвалізавала б ваш дызайн, «бяспечней» прытрымлівацца сучасных тэндэнцый вэб-дызайну. Такім чынам, вось вельмі невялікі фрагмент макета вэб-дызайну і тое, як ператварыць звычайны макет у макет Web 2.0.

Вось што было ў нас…

14.png

І вось што мы збіраемся рабіць…

13.png

Мы будзем працаваць у Photoshop, выкарыстоўваючы толькі стылі слаёў; засяродзіўшыся на мяккіх градыентах і ценях.

Пачніце з прамавугольнай формы з закругленымі кутамі і намалюйце… прамавугольнік.

1.jpg

Банэр

Першае, што нам трэба зрабіць, гэта надаць нашаму прамавугольніку трохі глыбіні і жыцця. Згодна з прынцыпамі дызайну Web 2.0, толькі цені, контуры і светлавыя градыенты дадуць нам гэты эфект. Такім чынам, перайдзіце да стыляў пласта і нанясіце невялікі цень. Мы выкарыстоўвалі #96aed6 для гэтай мэты.

2.png

Каб надаць форме невялікую глыбіню (каб яна не выглядала як плоскі прадмет), дадайце мяккі ўнутраны цень з больш цёмным тонам (мы выкарыстоўвалі #304f82 )

3.png

Нарэшце, важна дадаць невялікі контур. Мы будзем выкарыстоўваць белы колер #FFFFFF, паколькі нашы цені з абодвух бакоў больш цёмныя, мы хочам мець светлую і напаўбачную лінію, якая будзе контураваць форму.

4.png