Има толкова много уроци и ръководства онлайн, които ви учат как да използвате ефективно уеб 2.0 дизайна. Докато повечето от тези уроци са полезни, в същото време те убиват оригиналността на уеб дизайна. Например, повечето „ръководства“ ви казват, че уеб 2.0 е свързан с наличието на лъскава значка, ивичен фон и удебелени шрифтове. Резултат? Има безброй стотици дизайни със значки, ивици и удебелени големи букви… и те не се различават един от друг. Няма значение дали създавате уеб 2.0, уеб 1.0 или уеб 75.0 дизайн, всичко се свежда до това да сте оригинални и запомнящи се.

Въпреки това, ако наистина не можете да намерите нещо особено оригинално, което да символизира вашия дизайн, е „по-безопасно“ да се придържате към текущите тенденции в уеб дизайна. Ето един много малък фрагмент от оформление на уеб дизайн и как да превърнете обикновеното оформление в оформление на уеб 2.0.

Това е, което имахме…

14.png

И това е, което ще направим…

13.png

Ще работим във Photoshop, като използваме само стилове на слоеве; фокусиране върху леки градиенти и сенки.

Започнете, като използвате правоъгълната форма със заоблени ъгли и нарисувате... правоъгълник.

1.jpg

знаме

Това, което трябва да направим първо, е да дадем на нашия правоъгълник малко дълбочина и живот. Следвайки принципите на уеб 2.0 дизайна, само сенки, очертания и светли градиенти ще ни дадат този ефект. Така че отидете на стилове на слоя и пуснете лека сянка. Използвахме #96aed6 за тази цел.

2.png

За да придадете на формата малко дълбочина (така че да не изглежда като плосък обект), добавете лека вътрешна сянка с по-тъмен тон (ние използвахме #304f82 )

3.png

И накрая, важно е да добавите малко очертания. Ще използваме бял цвят #FFFFFF, тъй като нашите сенки от двете страни са по-тъмни, искаме да имаме лека и полувидима линия, която ще контурира формата.

4.png