Поддержите наши работы: Ситиметрия, Сайт студии, Итеранет, Объект, Гладтек, Путинка, Мегаполис чай, Браер.

-Строительство, архитектура, недвижимость/ 1-ое место в Чемпионате
«Браер»

-Благотворительные проекты/ 1-ое место в Чемпионате
«Благотворительный Фонд Система»

- Оригинальный сайт, лучшее использование фотографий/ 2-ое место в Чемпионате
«Гладтек»

Всем СПАСИБО за поддержку и голоса! Мы это очень ценим!

Гладтек в номинации «Оригинальный сайт»

Хондроксид в номинации «Торговая марка российской компании»

Мир шапок в номинации «Дизайн бизнес-сайта»

Гудер, Браер, Итеранет в различных номинациях «Бизнес-сайтов»

Благотворительный фонд «Система» в номинации «Сайт благотворительной организации»

Мы сделали сайт сети магазинов по продаже экономичной обуви. Коллекции, магазины, вакансии… куча макетов и бесконечная борьба с предоставлением информации для наполнения сайта.

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

Посмотреть рабочие материалы и другие картинки можно в нашем ревижне.

Звезды сошлись, и сейчас, пока сайт еще не опубликован, вы можете посмотреть результаты работы здесь, на нашем Ревижне (не забудьте полистать закладки слева от основного поста)

P.S. в это дерево мы влюблены отдельно)

Cегодня, я расскажу вам сказочку о том, как в марте—апреле 2010 года мы закончили работу над дизайном макетов «Баумагазина» (интернет-магазин по продажи плитки).

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

В этом проекте и дизайнером, и руководителем проекта здесь был один человек –  я (он же – Евгений Муравьев), поэтому этот этап был выполнен несколько поверхностно (что не повлияло на работу в целом, но лучше так не поступать. Я сделал плохо).

О том, что все на самом деле было хорошо, можно прочитать подробно под катом.

Начинается все с того, что мы получаем от клиента предполагаемую структуру сайта:

Увидев это, мы пытаемся разделить меню на горизонтальное и вертикальное. Названия пунктов меняем на более понятные и говорящие (это должен делать либо редактор в студии, либо сам дизайнер, лучше дизайнер, конечно). Клиент соглашается на изменения.

В процессе работы над маазином появлялись и дорабатывались некоторые решения: например, хотелось сделать, чтобы по умолчанию в корзине уже что-то лежало (так ведь проще начинать продажи), но клиент в эту идею не поверил.

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

Работа над шапкой и меню шла достаточно кропотливо, а мы все-таки пытались сделать так, чтобы «корзина» чуть-чуть намекала нам: «Вы пока ничего не заказали».

Утвердив такую идею, мы определяемся с выводом пустой и заполненной корзины.

Самые внимательные заметят, что у нас дорогой поменялся логотип. Клиент попросил нас, на основе имеющегося знака, придумать знак и для магазина. Наш дизайнер Сергей Калюжный взялся работать с логотипом и вот такая вот эволюция получилась у него в итоге:

Следующая задача состояла в создании промо-блока на странице. Придумываем принцип промо-блока, расположенного непосредственно под шапкой –  экспериментируем.

Вариант первый.

Первое решение показалось нам слишком простым и не интересным, поэтому решили сделать что-то более привлекательное.

Вариант второй

Вот так уже лучше. Отправляем технологу на изучение cover flow (чтобы время не терять), а сами продолжаем рисовать макет дальше. Стоит понимать, что каждое изменение в макете согласовывается с клиентом, если перед этим он утвердил на этом месте что-то другое. Задача дизайнера –  убедить клиента, приводя разумные аргументы в пользу своего решения, а задача руководителя проекта –  помочь ему в этом (в данном случае я помогал сам себе, что в принципе проще, но всегда лучше, когда на встрече вас двое).

На самом деле были еще какие-то промежуточные решения для меню, новостей, мини-галереи и промо-блока. Однако, трешевые просто не сохраняются, а некоторые уже не найти в огромном архиве. Я никогда не останавливаюсь на первой идее, т.к. она на 90% слабее, чем те, которые еще можно придумать, и вообще – самая очевидная (а нам такие не нужны).

После 7—8 макетов главной, получаем финальный вариант.

Графические элементы я рисую очень плохо, поэтому попросил Андрея Щепкина нарисовать нормальный билборд внизу страницы. После этого мы рассказываем технологу о том, какую анимацию мы хотим видеть в ротации графики в билборде и выбираем подходящий вариант.

В это время Андрей присылает картинку:

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

Кто-то из студии подсказал попробовать создать паттерн из плиток и использовать его частично на фоне сайта. Паттерн нарисовали, но продолжения он не получил.

Контактная информация стала самой изменяемой страницей, как показывает практика, этот проект не первый и не последний в котором страница контактов много и часто меняется.

Договорившись обо всем и вся, наконец прорисовываем все страницы, диалоговые окна, процесс оформления заказа.

Страницу 404 делаем черной. Просто черная страница. Почему бы и нет!

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

Спрогнозировать результат работы нельзя, он появляется только после запуска проекта. Но, как минимум, здравая логика и простота решений всегда должны побеждать дизайн ради дизайна.

Руководитель проекта и дизайнер Евгений Муравьёв, технический дизайнер Андрей Щепкин, технический директор Денис Денисов, технолог Анна Селезнева

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

Простота победила и мы нарисовали волну, которая снизу плавно поднимается наверх.

Вышло очень просто, добавляем объем и кладем на поверхность.

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

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

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

Над идеей и реализацией усердно работали Евгений Муравьёв, Владимир Родионов, Анна Селезнева, Денис Денисов.

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

Отдельно привет Анне, и нашему дизайнеру Илье Вадимовичу, работавшему над этим проектом.

В CreativePeople создали сайт для компании, которая занимается консалтингом в области продажи стратегических вооружений.

Надо понимать, что заказчик иностранец и задача была сделать так, чтобы было четкое видение что ТАКОЕ может себе позволить ТОЛЬКО очень крутые или сумашедшие.

А сумашедших в этом бизнесе мало.

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

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

Самые сочные роботы, отображаются только на 2560, так что только для избранных ( или можно потягать окно, если с макоси смотреть).

www.gladtec.net
Креативный директор — Александр Ковальский
Дизайнер — Владимир Родионов