![Page 1: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/1.jpg)
ВЕБ-ПРОЕКТИРОВАНИЕВ В Е Д Е Н И Е В Э ТА П П Р О Е К Т И Р О В А Н И Я С А Й ТА
Гильдия / 2015
![Page 2: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/2.jpg)
![Page 3: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/3.jpg)
САЙТЫ
ИКОНКИ
ИЛЛЮСТРАЦИИ
АЙДЕНТИКА
РАСКРУТКА ГРУПП ВКОНТАКТЕ
«ШАПКИ» ДЛЯ САЙТОВ
НАРИСОВАТЬ ВИЗИТКУ
РАСПЕЧАТАТЬ ФЛАЕР
ОБРАБОТАТЬ ФОТОГРАФИЮ
САЙТ-ВИЗИТКА ЗА ОДИН ДЕНЬ
ПОЧИНИТЬ КОМПЬЮТЕР
ПЕРЕУСТАНОВИТЬ СИСТЕМУ
ПЕРЕПРОШИТЬ ТЕЛЕФОН
![Page 4: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/4.jpg)
![Page 5: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/5.jpg)
МЕСЯЦ ГОДmin max
![Page 6: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/6.jpg)
ПР ОЦЕСС
![Page 7: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/7.jpg)
БРИФ/ОБСУЖДЕНИЕ
ДИЗАЙН
ПРОГРАММИРОВАНИЕ И CMS
ПРОЕКТИРОВАНИЕ
КОНТЕНТ
ВЁРСТКА
ПУБЛИКАЦИЯ
![Page 8: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/8.jpg)
КОНТЕНТ БРИФ/ОБСУЖДЕНИЕ
ДИЗАЙН
ПРОГРАММИРОВАНИЕ И CMS
ПРОЕКТИРОВАНИЕ
ВЁРСТКА
ПУБЛИКАЦИЯ
![Page 9: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/9.jpg)
![Page 10: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/10.jpg)
![Page 11: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/11.jpg)
У Ч АС ТНИК И
![Page 12: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/12.jpg)
— МЕНЕДЖЕР
— ПРОЕКТИРОВЩИК
— ДИЗАЙНЕР
— FRONTEND РАЗРАБОТЧИК
— ПРОГРАММИСТ
— КОНТЕНТ МЕНЕДЖЕР
— КЛИЕНТ
![Page 13: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/13.jpg)
ТЕ Х ЗА Д АНИЕ
ПРОЕК ТИРОВАНИЕ
V S
![Page 14: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/14.jpg)
ТЕХЗАДАНИЕПРОЕКТИРОВАНИЕпродумать описать
![Page 15: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/15.jpg)
К А Р ТА
![Page 16: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/16.jpg)
КАРТА САЙТА
![Page 17: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/17.jpg)
КАРТА САЙТА
![Page 18: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/18.jpg)
ПОНЯТИЯ
![Page 19: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/19.jpg)
ИДЕЯ ПРОДУКТ
![Page 20: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/20.jpg)
ОСМЫСЛЕНИЕ
![Page 21: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/21.jpg)
ОСМЫСЛЕНИЕ
![Page 22: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/22.jpg)
СКЕТЧ ЭСКИЗ
КАРКАС
МАКЕТ
ВАЙРФРЕЙМ
МОКАП
![Page 23: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/23.jpg)
«Добрый день, мы готовы презентовать
низкодетализированный статичный
прототип и высокодетализированный
интерактивный прототип, а ещё у нас есть
мокапы и карта взаимодействий юзера»
![Page 24: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/24.jpg)
«Добрый день, мы готовы презентовать
nizkodetalizirovannyj statichnyj prototip и
vysokodetalizirovannyj interaktivnyj pro-
totip, а ещё у нас есть mokapy и karta
vzaimodejstvij juzera»
![Page 25: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/25.jpg)
![Page 26: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/26.jpg)
Чтобы не стать заложником терминологии,
необходимо уточнять значения понятий
в зависимости от контекста
КЛИЕНТ КОМАНДАКОЛЛЕГИ
![Page 27: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/27.jpg)
СКЕТЧИНИЗКОДЕТАЛИЗИРОВАННЫЕ ПРОТОТИПЫ
![Page 28: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/28.jpg)
ВАЙРФРЕЙМЫВЫСОКОДЕТАЛИЗИРОВАННЫЕ ПРОТОТИПЫ СТРАНИЦ
![Page 29: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/29.jpg)
МОКАПЫМАКЕТЫ СТРАНИЦ
![Page 30: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/30.jpg)
КАРТА ВЗАИМОДЕЙСТВИЙ
![Page 31: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/31.jpg)
КАРТА ВЗАИМОДЕЙСТВИЙ
![Page 32: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/32.jpg)
![Page 33: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/33.jpg)
ИНТЕРА К ТИВ
![Page 34: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/34.jpg)
СТАТИЧНОСТЬ ИНТЕРАКТИВ
ДЕТАЛИЗАЦИЯ
АБСТРАКЦИЯ
![Page 35: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/35.jpg)
СТАТИЧНОСТЬ ИНТЕРАКТИВ
ДЕТАЛИЗАЦИЯ
АБСТРАКЦИЯ
долго, дорого,высокая точность
оптимально
почтибесполезно
быстро, дёшево,далеко от результата
![Page 36: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/36.jpg)
О СОБЕННО С ТИ
![Page 37: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/37.jpg)
ВИЗУАЛЬНАЯ КОНЦЕПЦИЯ, КАК ЧАСТЬ ПРОЕКТИРОВАНИЯ
![Page 38: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/38.jpg)
ПРЕЗЕНТАЦИЯ ДЛЯ КЛИЕНТА
— Показывать основное— Просмотр по диагонали— Утверждение без утверждения
![Page 39: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/39.jpg)
ПРЕЗЕНТАЦИЯ ДЛЯ КЛИЕНТА
— PDF— Интерактивный HTML— Flash— Видео— Плакат
![Page 40: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/40.jpg)
ЭТАП ПРОЕКТИРОВАНИЯ НУЖЕН
— Долгие проекты с итерациями или без чёткого видения клиента
— Интернет магазины— Лендинг— Личный кабинет— Система управления контентом
![Page 41: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/41.jpg)
ЭТАП ПРОЕКТИРОВАНИЯ НЕ ОБЯЗАТЕЛЕН
— Небольшой проект— Итерации большого проекта— Если проект разрабатывается на основе
готовой концепции— Максимальное доверие клиента
![Page 42: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/42.jpg)
![Page 43: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/43.jpg)
СРЕ ДС ТВА
![Page 44: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/44.jpg)
ПРОТОТИПЫ
— Illustrator— Axure— RealtimeBoard— Invision— InDesign
![Page 45: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/45.jpg)
КАРТЫ
— Illustrator— Xmind— Cmap— RealtimeBoard
![Page 46: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/46.jpg)
![Page 47: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/47.jpg)
![Page 48: Веб-проектирование. Введение в этап проектирования сайта](https://reader034.vdocuments.mx/reader034/viewer/2022042701/55c115b3bb61eb546b8b4661/html5/thumbnails/48.jpg)
FACEBOOK.COM/M18RU
VK.COM/KUCHINMD FB.COM/SHOOMOV
M18.RU
ДЕНИС ШУМОВМИХАИЛ КУЧИН