12 оттенков серого. Построение корпоративной системы...

12 ОТ ТЕНКОВ СЕР ОГОП О С Т Р О Е Н И Е К О Р П О РАТ И В Н О Й С И С Т Е М Ы Г РА Ф И Ч Е С К И Х ГА Й Д Л А Й Н О В

САЙТЫИКОНКИИЛЛЮСТРАЦИИАЙДЕНТИКА

РАСКРУТКА ГРУПП ВКОНТАКТЕ

«ШАПКИ» ДЛЯ САЙТОВ

НАРИСОВАТЬ ВИЗИТКУ

РАСПЕЧАТАТЬ ФЛАЕР

ОБРАБОТАТЬ ФОТОГРАФИЮ

САЙТВИЗИТКА ЗА ОДИН ДЕНЬ

ПОЧИНИТЬ КОМПЬЮТЕР

ПЕРЕУСТАНОВИТЬ СИСТЕМУ

ПЕРЕПРОШИТЬ ТЕЛЕФОН

БРИФ

ДИЗАЙН

ПРОГРАММИРОВАНИЕ И CMS

ПРОЕКТИРОВАНИЕ

ВЁРСТКА

ПУБЛИКАЦИЯ

БРИФ

ДИЗАЙН

ПРОГРАММИРОВАНИЕ И CMS

ПРОЕКТИРОВАНИЕ

ВЁРСТКА

ПУБЛИКАЦИЯ

МЕСЯЦ ГОДmin max

П Е Р Е Г Р У З К А

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

ИНФОРМАЦИОННОЕОБЩЕСТВО

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

ИНФОРМАЦИОННАЯПЕРЕГРУЗКА

1 8 +

1996

2000

2002

крутая 3D шапка

2004

2007

2011

2013

2014

1995

2014

В С Е С Л ОЖ Н О

БОЛЬШОЕ КОЛИЧЕСТВО КОНТЕНТА

НОВЫЕ ВИДЫ КОНТЕНТА

ВИДЖЕТЫ

НОВЫЕ ЭЛЕМЕНТЫ ИНТЕРФЕЙСА

АНИМАЦИИ

АДАПТАЦИИ

ОДНОСТРАНИЧНЫЕ ФОРМАТЫ

ВЕБШРИФТЫ

ВЕКТОРНЫЕ ИЗОБРАЖЕНИЯ

ПРОЧИЕ ЭФФЕКТЫ CSS3

П Р О Б Л Е М А

ОДНООБРАЗИЕ РАЗНООБРАЗИЕ

ОДНООБРАЗИЕ РАЗНООБРАЗИЕ

ШАБЛОН КОНТЕНТРАЗНООБРАЗИЕОДНООБРАЗИЕ

БЫСТРО МЕДЛЕННОКОНТЕНТ

РАЗНООБРАЗИЕШАБЛОН

ОДНООБРАЗИЕ

ДЁШЕВО ДОРОГОМЕДЛЕННО

КОНТЕНТРАЗНООБРАЗИЕ

БЫСТРОШАБЛОН

ОДНООБРАЗИЕ

СИСТЕМА ХАОСДОРОГО

МЕДЛЕННОКОНТЕНТ

РАЗНООБРАЗИЕ

ДЁШЕВОБЫСТРО

ШАБЛОНОДНООБРАЗИЕ

ГЛ О Б А Л Ь Н О

ДИСГАРМОНИЯ СИСТЕМЫ

СКЛЕРОЗ

РАСПЫЛЕНИЕ

ВИЗУАЛЬНЫЙ ПЕРЕДОЗ

ПЕРЕДАЧА В ВЁРСТКУ

СЛОЖНАЯ ВЁРСТКА

Л О К А Л Ь Н О

А А

Я К Н О П К А

S U P E R Х О В Е Р 3 D Х О В Е Р

G H O S T Х О В Е Р

Я С С Ы Л К А

ГД Е Р О Д И Т Е Л Ь С К И Й РА З Д Е Л ?

ГД Е ХО В Е Р ? ГД Е Т Е К У Щ И Й РА З Д Е Л ?

1

2

3

ПРИМЕР #1

ПРИМЕР #2

ПРИМЕР #2

ПРИМЕР #2

ПРИМЕР #2

ПРИМЕР #3

ПРИМЕР #3

С Л Е Д С Т В И Е

СРЫВ СРОКОВ РАЗРАБОТКИ

ТРЕШОВЫЙ САЙТ

СЛ ОЖ Н О В Н О С И Т Ь И З М Е Н Е Н И Я

П Р О Б Л Е М Ы В КО М А Н Д Е

Б Ы Л О

P S D

P S D P S D

P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

P S D P S D P S D P S D

ВРЕМЯ СОБИРАТЬ ПСД

Подход разработки дизайна интерфейса сайта основанный на большом количестве PSD файлов, передаваемых в вёрстку в качестве результата.

С ТА Л О

цветовая гамма, кнопки, блоки, типографика

ЭЛЕМЕНТ

ЭЛЕМЕНТЫ

КОНСТРУКЦИЯ

МАКЕТ

КАРКАСКОНСТРУКЦИЯ КОНСТРУКЦИЯ

?

ВЕБ ДИЗАЙНЕР = ?

ВЕБ ДИЗАЙНЕР = ХУДОЖНИК

ВЕБ ДИЗАЙНЕР = ВОИН

ВЕБ ДИЗАЙНЕР = ИНЖЕНЕР

ИНЖЕНЕР ПРАВИЛА

ИНЖЕНЕР СПЕЦИФИКАЦИИ

ИНЖЕНЕР КАРТЫ

КАРТА ИНЖЕНЕРНЫХ СЕТЕЙ

UI KIT, сочетания элементов, конструкций и их состояния

КАРТА КОНСТРУКЦИЙ

макеты страниц и их состояния

КАРТА МАКЕТОВ

версии экранов для адаптивного сайта на одном холсте, плюс брейкпоинты

КАРТА АДАПТАЦИЙ

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

КАРТА ВЗАИМОДЕЙСТВИЙ

когда UI KIT недостаточно

КАРТА ОТСТУПОВ

полезна для запущенных случаев и для арт-директора

КАРТА ПРАВОК

SHIFT+CTRL+EЧем меньше возможностей,тем больше внутренняя свобода

ADJUSTMENTLAYERS

COLORRANGE

П Р О Ц Е С С

Э Л Е М Е Н Т Ы

К О Н С Т Р У К Ц И И

К А Р К А С

К А Р ТА К О Н С Т Р У К Ц И Й

К Л Ю Ч Е В Ы Е М А К Е Т Ы

К А Р ТА М А К Е Т О В

К А Р ТА В З А И М О Д Е Й С Т В И Й

А Д А П ТА Ц И И

И Н С Т Р У К Ц И И

В Ё Р С Т К А

П Р О Е К Т И Р О В А Н И Е

Э Л Е М Е Н Т Ы

К О Н С Т Р У К Ц И И

К А Р К А С

К А Р ТА К О Н С Т Р У К Ц И Й

К Л Ю Ч Е В Ы Е М А К Е Т Ы

К А Р ТА М А К Е Т О В

К А Р ТА В З А И М О Д Е Й С Т В И Й

А Д А П ТА Ц И И

И Н С Т Р У К Ц И И

В Ё Р С Т К А

П Р О Е К Т И Р О В А Н И Е

М А С Ш ТА Б

Х РА Н Е Н И Е

ГОЛОВА АРТДИРЕКТОРА

СОСТАВИТЬ ОДИН РАЗ И ЗАБЫТЬ

Д И Н А М И Ч Е С К И Е ГА Й Д Л А Й Н Ы

ГОЛОВА АРТДИРЕКТОРА

СОСТАВИТЬ ОДИН РАЗ И ЗАБЫТЬ

Д И Н А М И Ч Е С К И Е ГА Й Д Л А Й Н Ы

ГОЛОВА АРТДИРЕКТОРА

СОСТАВИТЬ ОДИН РАЗ И ЗАБЫТЬ

Д И Н А М И Ч Е С К И Е ГА Й Д Л А Й Н Ы

наполняемкорпоративнуюбазу знаний

В Н Е Д Р Е Н И Е

ИТЕРАЦИОННЫЙ ПОДХОД

НАРОД ПРОТИВ

ДОЛГО И ОПАСНО

П Л Ю С Ы

УСКОРЕНИЕ ВЁРСТКИ

АККУРАТНЫЙ САЙТ

ПРОЩЕ ВНОСИТЬ ИЗМЕНЕНИЯ

РАБОТА В КОМАНДЕ

М И Н У С Ы

ТЯЖЁЛЫЕ ФАЙЛЫ

ВРЕМЯ НА ВНЕДРЕНИЕ

ЛОВУШКА КАЧЕСТВА

FACEBOOK.COM/M18RU

VK.COM/KUCHINMD FB.COM/SHOOMOV

M18.RU

ДЕНИС ШУМОВМИХАИЛ КУЧИН