Проектирование взаимодействия в вебдизайне
TRANSCRIPT
![Page 1: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/1.jpg)
ПРОЕКТИРОВАНИЕ ВЗАИМОДЕЙСТВИЯ
![Page 2: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/2.jpg)
ПРАВИЛЬНЫЙ ДИЗАЙН — ЭТО ПРАВИЛЬНЫЙ МАРКЕТИНГ
Дизайн — это инструмент продажи товаров и услуг. Для лучшей продажи товара необходимо, чтобы он выглядел привлекательнее по отношению к аналогичным товарам.
![Page 3: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/3.jpg)
2001 ГОД
САЙТ ВИЗИТКА
![Page 4: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/4.jpg)
2003 ГОД
FLASH ТЕХНОЛОГИИ
![Page 5: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/5.jpg)
2005 ГОД
АКЦИИ И СПЕЦПРЕДЛОЖЕНИЯ
![Page 6: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/6.jpg)
2008 ГОД — ИНТЕРНЕТ-МАГАЗИН
![Page 7: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/7.jpg)
2012 ГОД — УДОБНЫЙ ИНТЕРНЕТ-МАГАЗИН
![Page 8: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/8.jpg)
2012 ГОД — ПРОСТОЙ ИНТЕРНЕТ-МАГАЗИН
![Page 9: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/9.jpg)
ВЕБ-САЙТ — ЭТО ЧАСТЬ БРЕНДИНГОВОЙ ПЛАТФОРМЫ.
ПРОДАЖА — ЛИШЬ ОДНА ИЗ ЦЕЛЕЙ.
![Page 10: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/10.jpg)
АКТУАЛЬНЫЕ НОВИНКИ СЕЗОНА
![Page 11: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/11.jpg)
10 998 ТОВАРОВ — ЭТО МНОГО!
![Page 12: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/12.jpg)
СИСТЕМА УПРАВЛЕНИЯ САЙТАМИ ЛЮБОЙ СЛОЖНОСТИ: ЛОНГПЕЙДЖ, ШОРТПЕЙДЖ
![Page 13: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/13.jpg)
ОБРАЗ
![Page 14: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/14.jpg)
ГОЛОСУЕМ ЗА БУДУЩЕЕ РОССИИВЛАСТЬ БУДЕТ РАБОТАТЬ НА БЛАГО НАРОДА
![Page 15: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/15.jpg)
РАЗДЕЛИТЕ ПРОЕКТИРОВАНИЕ ВАШЕГО САЙТА НА ТРИ БОЛЬШИХ ЧАСТИ
![Page 16: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/16.jpg)
РАЗДЕЛИТЕ ПРОЕКТИРОВАНИЕ ВАШЕГО САЙТА НА ТРИ БОЛЬШИХ ЧАСТИ
ZMOT
![Page 17: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/17.jpg)
РАЗДЕЛИТЕ ПРОЕКТИРОВАНИЕ ВАШЕГО САЙТА НА ТРИ БОЛЬШИХ ЧАСТИ
ZMOT FMOT
![Page 18: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/18.jpg)
РАЗДЕЛИТЕ ПРОЕКТИРОВАНИЕ ВАШЕГО САЙТА НА ТРИ БОЛЬШИХ ЧАСТИ
ZMOT FMOT SMOT
![Page 19: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/19.jpg)
ПРАВИЛЬНЫЙ ДИЗАЙН:
![Page 20: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/20.jpg)
ПРАВИЛЬНЫЙ ДИЗАЙН:
Создает правильное ощущение — единый, цельный образ компании через правильный маркетинг.
![Page 21: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/21.jpg)
ПРАВИЛЬНЫЙ ДИЗАЙН:
Создает правильное ощущение — единый, цельный образ компании через правильный маркетинг.
Оптимизирует бизнес процессы и снижает затраты — полезность действия определяется его практической пользой.
![Page 22: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/22.jpg)
ПРАВИЛЬНЫЙ ДИЗАЙН:
Создает правильное ощущение — единый, цельный образ компании через правильный маркетинг.
Оптимизирует бизнес процессы и снижает затраты — полезность действия определяется его практической пользой.
Заботится о потребителе, экономит самое ценное, что у него есть — его время, — через правильно организованный опыт взаимодействия.
![Page 23: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/23.jpg)
С ЧЕГО НАЧАТЬ ПРОЕКТИРОВАТЬ?
![Page 24: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/24.jpg)
С ЧЕГО НАЧАТЬ ПРОЕКТИРОВАТЬ?
Четко определить, кто ваша целевая аудитория.
![Page 25: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/25.jpg)
С ЧЕГО НАЧАТЬ ПРОЕКТИРОВАТЬ?
Четко определить, кто ваша целевая аудитория.
Верно написать копирайт.
![Page 26: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/26.jpg)
С ЧЕГО НАЧАТЬ ПРОЕКТИРОВАТЬ?
Четко определить, кто ваша целевая аудитория.
Верно написать копирайт.
Тщательно подобрать визуальный ряд.
![Page 27: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/27.jpg)
ЦЕЛЕВАЯ АУДИТОРИЯ
![Page 28: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/28.jpg)
НАША ЦЕЛЕВАЯ АУДИТОРИЯ . . .
. . . — ВСЕ
![Page 29: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/29.jpg)
![Page 30: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/30.jpg)
![Page 31: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/31.jpg)
![Page 32: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/32.jpg)
ИДЕЯ
САЙТ НАМ ДОЛЖЕН О ЧЕМ-ТО СООБЩАТЬ
![Page 33: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/33.jpg)
![Page 34: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/34.jpg)
![Page 35: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/35.jpg)
СООБЩЕНИЙ ИНОГДА БЫВАЕТ О-О-ОЧЕНЬ МНОГО
![Page 36: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/36.jpg)
ДВА СПОСОБА КОНКУРЕНЦИИ:
![Page 37: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/37.jpg)
ДВА СПОСОБА КОНКУРЕНЦИИ:
конкуренция посредством качества продукта
![Page 38: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/38.jpg)
ДВА СПОСОБА КОНКУРЕНЦИИ:
конкуренция посредством качества продукта
конкуренция посредством качества сервиса
![Page 39: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/39.jpg)
![Page 40: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/40.jpg)
ИНОГДА НАРАЩИВАНИЕ ФУНКЦИОНАЛА СПОСОБНО СЫГРАТЬ ЗЛУЮ ШУТКУ
![Page 41: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/41.jpg)
ПРОЕКТИРОВАНИЕ ОПЫТА ВЗАИМОДЕЙСТВИЯ
![Page 42: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/42.jpg)
ПРОЕКТИРОВАНИЕ ОПЫТА ВЗАИМОДЕЙСТВИЯ
ЗДЕСЬ ВАЖНО ВСЕ:
![Page 43: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/43.jpg)
ПРОЕКТИРОВАНИЕ ОПЫТА ВЗАИМОДЕЙСТВИЯ
ЗДЕСЬ ВАЖНО ВСЕ:
возраст
доход
потребности
пол
![Page 44: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/44.jpg)
MotorRadHof — осуществляет продажу, обслуживание и доставку мотоциклов.
![Page 45: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/45.jpg)
ЦА: мужчины 18-35 лет, любят быструю езду, часто в состоянии эмоционального возбуждения, сконцентрированы.
![Page 46: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/46.jpg)
Решение:
минимум полей для
оформления заказа
отсутствие дополнительных
подтверждений
вся информация сразу
на одной странице
![Page 47: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/47.jpg)
Arte-Creo — осуществляет продажу одежды для танцев.
![Page 48: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/48.jpg)
ЦА: женщины 18-30 лет, любят выбирать и сравнивать, часто передумывают.
![Page 49: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/49.jpg)
Можно передумать, переложить и вернуть обратно, не отвлекаясь на дальнейшие шаги.
![Page 50: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/50.jpg)
Только оформление заказа, обратной дороги нет.Есть дефолтный выбор.
![Page 51: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/51.jpg)
ДИЗАЙН — ЭТО УВАЖЕНИЕ К ПОЛЬЗОВАТЕЛЮ И К ЕГО САМОМУ ЦЕННОМУ РЕСУРСУ — ВРЕМЕНИ.
![Page 52: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/52.jpg)
![Page 53: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/53.jpg)
ОНИ ВАМ ТОЧНО ПЕРЕЗВОНЯТ!
![Page 54: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/54.jpg)
АДАПТИВНЫЙ ДИЗАЙН — ЭТО ЦЕЛЕСООБРАЗНЫЙ МЕЙНСТРИМ
![Page 55: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/55.jpg)
![Page 56: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/56.jpg)
Нельзя ограничивать доступ к информации для определенных видов устройств, но эту информацию необходимо адаптировать под них — принцип отказоустойчивости.
![Page 57: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/57.jpg)
![Page 58: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/58.jpg)
ЗАКЛЮЧЕНИЕ
![Page 59: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/59.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщения
![Page 60: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/60.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦА
![Page 61: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/61.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контента
![Page 62: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/62.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контентаZMOT / FMOT / SMOT
![Page 63: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/63.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контентаZMOT / FMOT / SMOTДелать только то, что важно
![Page 64: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/64.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контентаZMOT / FMOT / SMOTДелать только то, что важноКачественная графика и осмысленный контент
![Page 65: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/65.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контентаZMOT / FMOT / SMOTДелать только то, что важноКачественная графика и осмысленный контентПостоянное тестирование
![Page 66: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/66.jpg)
ЗАКЛЮЧЕНИЕ
Формирование УТП / ниши / сообщенияОриентация на точную ЦАОпределение важности контентаZMOT / FMOT / SMOTДелать только то, что важноКачественная графика и осмысленный контентПостоянное тестированиеОбращаться к профессионалам
![Page 67: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/67.jpg)
fb.com/ikradigitalikradigital.ru
СПАСИБО!
![Page 68: Проектирование взаимодействия в вебдизайне](https://reader034.vdocuments.site/reader034/viewer/2022051515/557dc516d8b42a8f188b53f7/html5/thumbnails/68.jpg)
fb.com/ikradigitalikradigital.ru
ВАШИ ВОПРОСЫ