От автора: мобильный веб сайт обвиняется не заслуженно. Большей частью он находится в тени десктопов, либо играет роль старомодного приятеля «родных» приложений. К счастью, у нас есть инструменты, в силах которых все изменить. Прогрессивное улучшение, принцип mobile-first и чутко реагирующий дизайн ведут нас к более унифицированному, устремленному в будущее вебу. Это хорошая новость. Плохая новость? Эти инструменты бесполезны, если у вас нет лицензии на их использование.

Во многих случаях нас сдерживают клиенты и те концептуальные модели, которых они придерживаются. Чтобы клиенты усвоили потенциал мобильных веб сайтов, нужно заставить их думать дальше настольных компьютеров и приложений.

Читать далее →

От автора: в данном уроке мы создадим с нуля макет сайта, выполненный в тенденциях западного дизайна. Чтобы идеально выровнять элементы относительно друг друга, нам предстоит проделать довольно много работы с направляющими.

Читать далее →

От автора: сегодня существуют тысячи способов проектирования и создания кнопок для сайта, и вам нужно потратить совсем немного времени на просмотр работ на dribbble, чтобы получить о них представление. По большей части они абсолютно одинаковы, но случайно встречаются отдельные примеры, в создание которых, это чувствуется, вложено немного больше заботы и внимания.

Пользуясь преимуществами чудесных свойств нового CSS3, можно создавать удивительно элегантные и стильные кнопки без единого признака изображений и получать идеально соответствующие стили для старых браузеров. Вам, может быть, нравится создавать кнопки для сайта, прямиком в CSS или вы стремитесь к своему предпочитаемому разметочному инструменту, но важно тщательно обдумывать соответствие дизайна своих кнопок и контекста.

Читать далее →

От автора: помните халявный Fashion Store? Сегодня я покажу вам, как создать дизайн, этого интернет магазина в Adobe Photoshop. Этот учебник битком набит не только методами Photoshop’а, но и дизайнерскими концепциями, уходящими далеко за пределы практической области, чего, я уверен, вы не захотите пропустить. Итак, давайте начнём создавать дизайн нашего интернет магазина!

Читать далее →

От автора: представьте себе, что руководитель крупной компании входит в ваш офис и падает на колени с предложением создать ему красивый дизайн интернет магазина. Вы читаете огромный документ, потом спрашиваете: -«Какой вы предлагаете бюджет для этого проекта?». Он дает вам ответ и… ВАУ!!!

Того, что вы прочли выше, никогда не происходит в реальной жизни. Такой контракт никогда не отдадут одному дизайнеру, потому что над крупным проектом трудится целая веб-студия. Проекты такого масштаба требуют целой команды дизайнеров, разработчиков, профессионалов в юзабилити и специалистов по маркетингу. Большинство веб-студий не могут справиться с проектами такого масштаба.

Читать далее →

От автора: любой веб-дизайнер, как на собственном сайте, так и на сайте клиента, всегда борется с беспорядком. Дизайн вебсайта должен подчеркивать цель сайта, фокусируя внимание на содержимом и делая сайт удобным для использования. Эффективный и привлекательный вебсайт получается, когда лишнее время потрачено на то, чтобы ни одна его деталь не осталась без внимания. Получается намного лучший дизайн сайта.

Читать далее →

От автора: в данном уроке мы создадим с нуля макет фото-портфолио. Макет не будет отличаться пестростью красок и колоссальным наличием графики. Главное здесь – лаконичность, нужно правильно подать то, ради чего сайт и создаётся: демонстрацию портфолио.

В ходе урока мы научимся разбивать наш макет направлящими, работать с различным градиентом, применять эффекты свечения, работать с текстом и полезным инструментарием Adobe Photoshop.

Если Вы готовы, то приступим!

Читать далее →

Использование изображений в веб-дизайне, дает возможность дизайнеру передать свой личный и неповторимый стиль, дает возможность сказать «это мой сайт, посмотрите, что я могу делать». Очень не многие дизайны дают такую возможность.

В примерах ниже баланс между красивыми изображениями и тщательно продуманным дизайном выделяет эти сайты из всех остальных. Все они уникальны сами по себе, выдвигают на первый план иллюстрации, с удобно расположенным контентом. И, когда все это успешно достигнуто, эффект получается удивительный и незабываемый.

Читать далее →

Создание своего личного портфолио сайта, возможно, одно из самых сложных заданий, которое вам придется делать. Вы сами себя критикуете и, что бы ни было сделано, вы всегда хотите это изменить и сделать еще лучше.

Для вдохновения взгляните на эти портфолио — креативные сайты. Они различные для разработчиков (для них, как правило, дизайны очень точные), для дизайнеров (красочные и яркие) и фотографов.

Читать далее →

В веб-дизайне очень важно, чтобы пользователь не чувствовал себя не комфортно — это как смотреть на раковину, полную грязной посуды. Если ваш дизайн визуально неуравновешен, то сайт будет выглядеть неорганизованным, а это может заставить пользователей чувствовать себя неудобно. Напротив, ваш дизайн должен быть привлекательным и позволять посетителям расслабиться, оглядеться вокруг, и самый лучший способ достичь такого эффекта – визуальный баланс. Визуальный баланс – это, в основном, баланс элементов дизайна, их расположение — словно жонглирование элементами вашего дизайна.

Когда мы представляем себе баланс, то проще всего его сравнить с понятием веса. Физический вес и вес элементов дизайна на самом деле очень похожи — физический объект может быть маленьким, но очень тяжелым, независимо от массы, так же, как визуальный элемент дизайна может быть очень небольшим, но очень привлекающим внимание. Тяжесть физического объекта можно сравнить с визуальной яркостью элементов дизайна, и каждый элемент взаимодействует с другими элементами дизайна так же, как и физические объекты.

Читать далее →