Фитискин Александр

Как создавался Консультант

Все началось с идеи...

«Бумажная работа», а точнее работа с бумагами — это основное направление деятельности компании «Консультант». Мы не стали далеко отходить от бумажной темы, но решили обыграть ее как-нибудь оригинально. У нас родилась идея сделать «бумажный сайт», и мы решили ее попробовать.

Идеи и реализация:

Антон Быстрюков
Михаил Востриков
Максим Садчиков

Руководитель проекта:

Галина Хворостенко

Вначале мы сделали черновой набросок острова:

А затем склеили этот остров из бумаги:

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

 

Мы сделали несколько фотографий макета, добавили цветокоррекции и недостающих элементов:

 

Максим придумал как оформить контент страницы: он разделил остров на 5 локаций, а услуги компании на 5 групп. Подготовленная илюстрация отлично вписалась в задуманную сетку сайта. Так у нас появился первый эскиз, который Галя, менеджер и координатор проекта, продемонстрировала заказчику:

Первый эскиз попадает в точку! Идея принята!

 

Делаем макет острова

Заказчик принял идею, значит вектор движения определен. Начинается самое интересное — мы делаем финальный вариант макета острова «Бюрократии», так мы его назвали. Делать макет мы начинаем с чистого листа. Антон вооружается необходимыми подручными средствами и полностью погружается в работу.

 

Готовый макет отправляется на растерзание фотографам, которые подбирают правильный ракурс и освещение:

Лучшим вариантом выбран вот этот:

 

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

 

 

 

Приключения по острову

На острове бюрократии располагается 5 локаций, каждая из которых представляет одно из направлений работы компании «Консультант»:

  • Бухгалтерские услуги
  • Аудит
  • Кадровый учет
  • Регистрация
  • Прочие услуги

Вот как эти локации создавались:

 

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

Макс и Антон делают первые наброски, которые могут отобразить выбранную метафору:

 

Макет непроходимых джунглей по наброскам, так же как и все остальные макеты, был сделан с помощью цветной бумаги ножниц и клея. Антону постоянно не хватало горячих клавиш ctrl+c и ctrl+v, ведь каждую новую пальму нужно было вырезать заново...

 

Миша, наш флеш-аниматор, заранее продумал анимацию данной локации и предложил разделить макет на две части, что и было сделано:

 

Очередная фотосессия и магия фотошопа превратили труды Антона в отличную иллюстрацию:

 

 

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

Для веселой идеи с пленником, которого туземцы хотят приготовить на ужин, родился вот такой эскиз, который и стал основным для данной локации:

 

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

 

А насколько реалистично у него получился трон! Мы думаем, что каждый на минутку представил, каково это — сидя на этом троне повеливать людьми :)

 

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

 

 

Метафору для раздела «Прочие услуги» придумать оказалось не так просто. Что за «прочие услуги», сколько их, какие они? Рассуждения на эту тему привели нас к тому, что «прочих услуг» у «Консультанта» много, это натолкнуло на идею моря, а точнее не моря, а залива — «Залива услуг»

Преодолеть залив, кишащий голодными акулами — отличное испытание для нашего героя, которого всегда и везде сопровождает «Консультант»:

 

Одинокая пальма на берегу, редкие кусты и камни — подходящий передний план для третьей локации:

 

Макет заднего плана — любымый макет Антона, здесь он наконец то смог вырезать целый лес одним движением ножниц:

 

Макс добавил к макетам палящее солнце, которого для большей реалистичности не хватало на фотографиях:

 

 

Покорение аудита похоже на покорение горы — в одиночку это довольно сложное испытание. Горы на нашем острове еще не встречались, поэтому мы решили поэкспериментировать с этой метафорой:

 

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

 

Морозную свежесть в иллюстрацию внес Антон, добавив недостающих деталей:

 

 

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

Примерно так, без эскизов, у нас появилась пятая локация на острове, которую позже назвали «Пустыней Бухучета»

 

 

 

 

 

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

Теперь вы сами можете прогуляться по нашему острову Бюрократии.

 

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

Devilty
30 июня
Это просто изумительно!
Браво!!!
Nataly Bry
30 июня
Молодцы, очень понравилось! А сам сайт ещё не готов? Хочется посмотреть, как будет выглядеть проект целиком.
komp
30 июня
почему нет кнопки возврата к виду на остров?
Денис
30 июня
Мы тоже делаем сайты, но чтобы так?! Вы ребята просто молодцы. (разослал ссылку всем друзьям, так что ждите хабраэффект)
просто обалденно!
Валерия
30 июня
Нет слов! Красавцы!
Аля
30 июня
вау! классно! молодцы!
я бы так не мучалась.. так что вам за терпение респект :)
Фитискин Александр
30 июня
Nataly, сайт будет на домене , сейчас он еще не готов
Дядька Ветер
30 июня
не совсем понравился шрифт на табличках (сам-то он хороший, но в данном случае не играет в полную силу), а вообще работа колоссальная ) браво
Дядька Ветер
30 июня
сейчас поглядел с анимацией — круть
Ильяс
30 июня
Респект и уважуха! :)
Кеша
30 июня
Круть!!
Alexey
30 июня
Обалдеть!!! Восхищен креативностью и слаженностью группы.
Андрей
30 июня
Отличная работа, интересно было посмотреть на процесс работы, да и результат очень порадовал. Молодцы!
Фитискин Александр
30 июня
Дядька Ветер, вы имеете ввиду шрифт на табличках-указателях? По вашему он не играет в полную силу в плане реалистичности или вы имеете ввиду что-то другое?
DrNemo
30 июня
Молодцы!
П.С.: тока пропишите белый фон в стилях
Maria
30 июня
крутачииии)
Макс Голиков
30 июня
Темно, очень клево. Была как-то идея по типу этого, но так и осталась идеей...Молодцы ребята! Работайте в том же духе!
Фитискин Александр
30 июня
DrNemo, прописать белый фон в стилях чего?
Владимир
30 июня
Очень хороший рекламный ход. Интересна цена этой работы? И где найти клиентов "Консультантов", которые готовы платить такую цену. В общем иначе как рекламный ход, я эту работу не расцениваю.
Денис
30 июня
Народ! Вы круть! Супер подход! Забожили!
Никита Козин
30 июня
Классно!
Только зачем вся навигация-то на флеше? Можно ж было скрестить JS и флеш.
Александра
30 июня
Здорово, здорово!!!!! Горжусь вами!!!)))
Антон Быстрюков
30 июня
Спасибо
Фитискин Александр
30 июня
Никита Козин, вы имеете ввиду навигацию на сайте? Если да, то это сделано для облечения интеграции. Я бы с удовольствием поэкспериментировал с обработкой событий mouseOver и mouseOut на пунктах меню и передачей их во флеш (для выделения локации), но к сожалению до меня эта работа не дошла :(
DrNemo
30 июня
В стилях сайта, если рабочая область по умолчанию не белая, то не гуд
Фитискин Александр
30 июня
DrNemo, cпасибо за подсказку, мы свяжемся с Консультантом, и устраним эту проблему
Никита Козин
30 июня
Ясно. Но в принципе это довольно просто делается и навигация на сайте будет доступна независимо от наличия/загрузки флеша.

А сам рабочий процесс — ах! Вы круты :-)
sawarogu
30 июня
Штука хорошая получилась только вот вопрос.... во флешке перейти с одной локации на другую не получается пока за помощью не обратишься... так задумано или это баг? неудобно как-то, если я не туда попал....
Фитискин Александр
30 июня
Никита Козин, версия без флеша так же предусмотрена, с упрощенным фукнционалом (меню + неактивная иллюстрация) :)
Владимир
30 июня
Вах! Идея и исполнение - зачёт +стотыщпядсод!
Михаил Востриков
1 июля
Sawarogu, действительно без помощи Консультанта во флешке нельзя перейти в новую локацию, так задумано. Но вся навигация продублирована на сайте справа, так что проблем с перемещением по страницам сайта не будет.
Димониус
1 июля
Вы забыли поставить у body белый фон - если в браузере по умолчанию стоит другой фон (у меня в Опере стоит серый) смотрится неряшливо.
Фитискин Александр
1 июля
Димониус, спасибо за замечание, о нем нам уже сообщил DrNemo. В ближайшее время мы это исправим.
volos_86
1 июля
фантастика обьем работы впечетляет
Владимир
5 июля
Обладенно! Впечатляет! А в какие сроки все это придумывалось и делалось?
Сокол
7 июля
ВЫ МЕГА-МОНСТРЫ!!!!
Супер!!!
Дмитрий
7 июля
Браво!
Симдянова Татьяна
8 июля
Сегодня еще раз просматривала www.nalogi2000.ru и поймала себя на мысли: "А Славе, наверное, понравилось бы".
Отец Афонасий
8 июля
Скажите, а от чего бы не Смоделлить все в 3ds Max И отрендерить какимн-нибудь V-Ray?
Mariik
13 июля
Отличная работа. Но - после обработки в шопе уже непонятно что это бумажная аппликация.
Стало похоже на обычную иллюстрацию.
Крис
13 июля
какой 3D max..о чем вы..это просто восхитительно, ни что так не поощеряется, то что сделано руками! очень креативно, я такого еще нигде не встречала, ребята вы крутые, а все что скажут не так, это придирки, !
Лис
28 июля
ОТЛИЧНО!
Сергей Болисов
5 августа
Просто изумительно, я буду молиться на вас! :)
Максим Волков
18 августа
Отличная командная работа, ничего не скажешь.
Побольше вам таких результатов! Респект от коллег!
Teo Kosmo
15 сентября
Круто очень достойная работа
посмотрел тестовую версию сайта
а вы всегда в иконках калькулятор используете один и тот же?
ето фирменная фишка?