— Основные понятия и этапы проектирования. — Место проектирования в процессах разработки сайта. — Техническое задание VS проектирование. — Использование карты сайта на начальном этапе. — Обзор программных средств для создания прототипов. — Презентация результатов этапа клиенту. Видео https://youtu.be/dju8JHKvaLg Студия M18 http://m18.ru/

1. ВЕБ-ПРОЕКТИРОВАНИЕ
ВВЕДЕНИЕ В ЭТАП ПРОЕКТИРОВАНИЯ САЙТА
Гильдия / 2015

3. САЙТЫ
ИКОНКИ
ИЛЛЮСТРАЦИИ
АЙДЕНТИКА
РАСКРУТКА ГРУПП ВКОНТАКТЕ
«ШАПКИ» ДЛЯ САЙТОВ
НАРИСОВАТЬ ВИЗИТКУ
РАСПЕЧАТАТЬ ФЛАЕР
ОБРАБОТАТЬ ФОТОГРАФИЮ
САЙТ-ВИЗИТКА ЗА ОДИН ДЕНЬ
ПОЧИНИТЬ КОМПЬЮТЕР
ПЕРЕУСТАНОВИТЬ СИСТЕМУ
ПЕРЕПРОШИТЬ ТЕЛЕФОН

5. МЕСЯЦ ГОД
min max

6. ПРОЦЕСС

7. БРИФ/ОБСУЖДЕНИЕ
ДИЗАЙН
ПРОГРАММИРОВАНИЕ И CMS
ПРОЕКТИРОВАНИЕ
КОНТЕНТ
ВЁРСТКА
ПУБЛИКАЦИЯ

8. КОНТЕНТ БРИФ/ОБСУЖДЕНИЕ
ДИЗАЙН
ПРОГРАММИРОВАНИЕ И CMS
ПРОЕКТИРОВАНИЕ
ВЁРСТКА
ПУБЛИКАЦИЯ

11. У ЧАСТНИКИ

12. — МЕНЕДЖЕР
— ПРОЕКТИРОВЩИК
— ДИЗАЙНЕР
— FRONTEND РАЗРАБОТЧИК
— ПРОГРАММИСТ
— КОНТЕНТ МЕНЕДЖЕР
— КЛИЕНТ

13. ТЕХЗА ДАНИЕ
ПРОЕКТИРОВАНИЕ
VS

14. ТЕХЗАДАНИЕПРОЕКТИРОВАНИЕ
продумать описать

15. К АРТА

16. КАРТА САЙТА

17. КАРТА САЙТА

18. ПОНЯТИЯ

19. ИДЕЯ ПРОДУКТ

20. ОСМЫСЛЕНИЕ

21. ОСМЫСЛЕНИЕ

22. СКЕТЧ ЭСКИЗ
КАРКАС
МАКЕТ
ВАЙРФРЕЙМ
МОКАП

23. «Добрый день, мы готовы презентовать
низкодетализированный статичный
прототип и высокодетализированный
интерактивный прототип, а ещё у нас есть
мокапы и карта взаимодействий юзера»

24. «Добрый день, мы готовы презентовать
nizkodetalizirovannyj statichnyj prototip и
vysokodetalizirovannyj interaktivnyj pro-
totip, а ещё у нас есть mokapy и karta
vzaimodejstvij juzera»

26. Чтобы не стать заложником терминологии,
необходимо уточнять значения понятий
в зависимости от контекста
КЛИЕНТ КОМАНДАКОЛЛЕГИ

27. СКЕТЧИ
НИЗКОДЕТАЛИЗИРОВАННЫЕ ПРОТОТИПЫ

28. ВАЙРФРЕЙМЫ
ВЫСОКОДЕТАЛИЗИРОВАННЫЕ ПРОТОТИПЫ СТРАНИЦ

29. МОКАПЫ
МАКЕТЫ СТРАНИЦ

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

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

33. ИНТЕРАК ТИВ

34. СТАТИЧНОСТЬ ИНТЕРАКТИВ
ДЕТАЛИЗАЦИЯ
АБСТРАКЦИЯ

35. СТАТИЧНОСТЬ ИНТЕРАКТИВ
ДЕТАЛИЗАЦИЯ
АБСТРАКЦИЯ
долго, дорого,
высокая точность
оптимально
почти
бесполезно
быстро, дёшево,
далеко от результата

36. ОСОБЕННОСТИ

37. ВИЗУАЛЬНАЯ КОНЦЕПЦИЯ,
КАК ЧАСТЬ ПРОЕКТИРОВАНИЯ

38. ПРЕЗЕНТАЦИЯ ДЛЯ КЛИЕНТА
— Показывать основное
— Просмотр по диагонали
— Утверждение без утверждения

39. ПРЕЗЕНТАЦИЯ ДЛЯ КЛИЕНТА
— PDF
— Интерактивный HTML
— Flash
— Видео
— Плакат

40. ЭТАП ПРОЕКТИРОВАНИЯ НУЖЕН
— Долгие проекты с итерациями или без
чёткого видения клиента
— Интернет магазины
— Лендинг
— Личный кабинет
— Система управления контентом

41. ЭТАП ПРОЕКТИРОВАНИЯ НЕ ОБЯЗАТЕЛЕН
— Небольшой проект
— Итерации большого проекта
— Если проект разрабатывается на основе
готовой концепции
— Максимальное доверие клиента

43. СРЕДСТВА

44. ПРОТОТИПЫ
— Illustrator
— Axure
— RealtimeBoard
— Invision
— InDesign

45. КАРТЫ
— Illustrator
— Xmind
— Cmap
— RealtimeBoard

48. FACEBOOK.COM/M18RU
VK.COM/KUCHINMD FB.COM/SHOOMOV
M18.RU
ДЕНИС ШУМОВМИХАИЛ КУЧИН