SlideShare ist ein Scribd-Unternehmen logo
1 von 55
Downloaden Sie, um offline zu lesen
Эмоциональный
веб-дизайн,
история одного чуткого
лендинга
1. Эмоциональный дизайн. Что это такое?
2. Что делает дизайн эмоциональным?
3. Теория на практике
Эмоциональный
дизайн
Хеллоу, Маслоу
Хеллоу, Уолтер
Интерфейс должен быть функциональным
Интерфейс должен быть надежным
Интерфейс должен быть удобным
Удобный = съедобный
Эмоции и память
Эмоционально окрашенные события
гораздо дольше хранятся в памяти и
вспоминаются более детально, чем
нейтральные
Что делает дизайн эмоциональным?
Главная цель эмоционального дизайна –
упростить коммуникацию между людьми. Если
мы справляемся с этой задачей, компьютер
отходит на задний план, и мы оказываемся
лицом к лицу с личностью
Создавая дизайн, думайте о том, чтобы
пользователь воспринимал интерфейс так,
будто перед ним человек, а не компьютер.
 в 1989 году компанией Mazda Motors был выпущен автомобиль Mazda MX-5 Miata
Главная задача брендинга – создать
неповторимый образ, который не позволит
перепутать вас ни с кем из ваших конкурентов.
Если ваш бренд заметно отличается от других,
он непременно запомнится
Индивидуальность
1. Индивидуальность позволяет нам выразить весь спектр
человеческих эмоций.
2. Она та самая тайная сила, что влечет нас к одним людям
и отталкивает от других.
3. Индивидуальность в значительной степени влияет на
процесс принятия решений, и дизайн должен
апеллировать именно к ней.
Моделирование «персонажей»
«Персонажи» – своего рода
визуализированное досье на архетипичных
пользователей продукта, в котором
представлен набор их поведенческих
характеристик
Визуальная коммуникация:
Форма, Цвет, Расположение объектов, Контент
Сторителлинг
FROMIN
FROMIN
FROMIN
FROMIN
Ice Age Water
Удивление и радость
Дизайнеры используют это весьма
полезное свойство психики, чтобы
распределить внимание и сформировать
поведение пользователей
Эстетика
Привлекательные вещи заставляют людей
хорошо себя чувствовать, что, в свою
очередь, заставляет их мыслить творчески.
И людям становится легче решать
проблемы, с которыми они сталкиваются
Эстетика
1. Соотношение параметров и объектов
Ваш шедевр
готов!
Разнообразный и богатый опыт постоянный
количественный рост и сфера нашей активности
в значительной степени обуславливает
создание направлений прогрессивного
развития.
Разнообразный и богатый опыт
постоянный количественный
рост и сфера нашей
активности в значительной
степени обуславливает
создание направлений
прогрессивного развития.
Ваш шедевр готов!
Эстетика
2. Расположение объектов
Ученые Стэнфордского университета
провели опрос, который показал, что 46%
респондентов составляют мнение о сайте
на основании его внешнего вида и
интерфейса
Всем спасибо за внимание!

Weitere ähnliche Inhalte

Ähnlich wie «Эмоциональный веб-дизайн, история одного чуткого лендинга»

Таня Мисютина Лекция «Об интерфейсе»
Таня Мисютина Лекция «Об интерфейсе»Таня Мисютина Лекция «Об интерфейсе»
Таня Мисютина Лекция «Об интерфейсе»
e-Legion
 
Объединяющая сила UX
Объединяющая сила UXОбъединяющая сила UX
Объединяющая сила UX
Dmitry Satin
 
Тенденции мира UX: новые вызовы и возможности
Тенденции мира UX: новые вызовы и возможностиТенденции мира UX: новые вызовы и возможности
Тенденции мира UX: новые вызовы и возможности
UIDesign Group
 
креативные люди вы нужны
креативные люди   вы нужныкреативные люди   вы нужны
креативные люди вы нужны
Katya Labinskaya
 
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологияхCodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
CodeFest
 
Designlecture 091008072837-phpapp01
Designlecture 091008072837-phpapp01Designlecture 091008072837-phpapp01
Designlecture 091008072837-phpapp01
Nika Stuard
 
юзабилити
юзабилитиюзабилити
юзабилити
DPR
 

Ähnlich wie «Эмоциональный веб-дизайн, история одного чуткого лендинга» (20)

Многопользовательский компьютер
Многопользовательский компьютерМногопользовательский компьютер
Многопользовательский компьютер
 
Многопользовательский компьютер
Многопользовательский компьютерМногопользовательский компьютер
Многопользовательский компьютер
 
Таня Мисютина Лекция «Об интерфейсе»
Таня Мисютина Лекция «Об интерфейсе»Таня Мисютина Лекция «Об интерфейсе»
Таня Мисютина Лекция «Об интерфейсе»
 
5 трендов визуальной коммуникации в цифровую эпоху (DOOH)
5 трендов визуальной коммуникации в цифровую эпоху (DOOH)5 трендов визуальной коммуникации в цифровую эпоху (DOOH)
5 трендов визуальной коммуникации в цифровую эпоху (DOOH)
 
От слов к делу: как перейти от анализа к проектированию интерфейса
От слов к делу: как перейти от анализа к проектированию интерфейсаОт слов к делу: как перейти от анализа к проектированию интерфейса
От слов к делу: как перейти от анализа к проектированию интерфейса
 
Интерфейсы
ИнтерфейсыИнтерфейсы
Интерфейсы
 
Объединяющая сила UX
Объединяющая сила UXОбъединяющая сила UX
Объединяющая сила UX
 
Uix presentation
Uix presentationUix presentation
Uix presentation
 
Шрифт как неочевидное
Шрифт как неочевидноеШрифт как неочевидное
Шрифт как неочевидное
 
Встреча №5. Можно ли сделать дизайн без дизайнера? Александр Киров
Встреча №5. Можно ли сделать дизайн без дизайнера? Александр КировВстреча №5. Можно ли сделать дизайн без дизайнера? Александр Киров
Встреча №5. Можно ли сделать дизайн без дизайнера? Александр Киров
 
Константин Кичинский, Microsoft
Константин Кичинский, MicrosoftКонстантин Кичинский, Microsoft
Константин Кичинский, Microsoft
 
Тенденции мира UX: новые вызовы и возможности
Тенденции мира UX: новые вызовы и возможностиТенденции мира UX: новые вызовы и возможности
Тенденции мира UX: новые вызовы и возможности
 
Пакет услуг "Стратег с UX-экспертизой"
Пакет услуг "Стратег с UX-экспертизой"Пакет услуг "Стратег с UX-экспертизой"
Пакет услуг "Стратег с UX-экспертизой"
 
004 Лекция о дизайне
004 Лекция о дизайне004 Лекция о дизайне
004 Лекция о дизайне
 
креативные люди вы нужны
креативные люди   вы нужныкреативные люди   вы нужны
креативные люди вы нужны
 
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологияхCodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
CodeFest, июль 2012. Бугаев Л. — Запуск продукта в мобильных технологиях
 
Designlecture 091008072837-phpapp01
Designlecture 091008072837-phpapp01Designlecture 091008072837-phpapp01
Designlecture 091008072837-phpapp01
 
Дизайн решает!
Дизайн решает!Дизайн решает!
Дизайн решает!
 
юзабилити
юзабилитиюзабилити
юзабилити
 
Cенсорный дизайн
Cенсорный дизайнCенсорный дизайн
Cенсорный дизайн
 

Mehr von Artjoker

Mehr von Artjoker (20)

Is it time to write unit tests?
Is it time to write unit tests?Is it time to write unit tests?
Is it time to write unit tests?
 
Redux and React. Learning from giants.
Redux and React. Learning from giants.Redux and React. Learning from giants.
Redux and React. Learning from giants.
 
MVVM+Router or how to use all advantage from MVVM and VIPER
MVVM+Router or how to use all advantage from MVVM and VIPERMVVM+Router or how to use all advantage from MVVM and VIPER
MVVM+Router or how to use all advantage from MVVM and VIPER
 
"Опыт внедрения автоматизации на PHP проектах (Docker, Gitlab CI)"
"Опыт внедрения автоматизации на PHP проектах (Docker, Gitlab CI)""Опыт внедрения автоматизации на PHP проектах (Docker, Gitlab CI)"
"Опыт внедрения автоматизации на PHP проектах (Docker, Gitlab CI)"
 
«Let`s do it right»
«Let`s do it right»«Let`s do it right»
«Let`s do it right»
 
«Высоконагруженное тестирование РНР проектов»
«Высоконагруженное тестирование РНР проектов» «Высоконагруженное тестирование РНР проектов»
«Высоконагруженное тестирование РНР проектов»
 
3-е свидание с functional-js, что дальше
3-е свидание с functional-js, что дальше3-е свидание с functional-js, что дальше
3-е свидание с functional-js, что дальше
 
GraphQL для FrontEnd разработчика
GraphQL для FrontEnd разработчикаGraphQL для FrontEnd разработчика
GraphQL для FrontEnd разработчика
 
React 16: new features and beyond
React 16: new features and beyondReact 16: new features and beyond
React 16: new features and beyond
 
Первые шаги интернет-магазина одежды
Первые шаги интернет-магазина одеждыПервые шаги интернет-магазина одежды
Первые шаги интернет-магазина одежды
 
«Без каких микровзаимодействий нельзя делать WEB и mobile продукты в 2018-м»
«Без каких микровзаимодействий нельзя делать WEB и mobile продукты в 2018-м»«Без каких микровзаимодействий нельзя делать WEB и mobile продукты в 2018-м»
«Без каких микровзаимодействий нельзя делать WEB и mobile продукты в 2018-м»
 
«Дизайн система для мобильных и веб проектов»
«Дизайн система для мобильных и веб проектов»«Дизайн система для мобильных и веб проектов»
«Дизайн система для мобильных и веб проектов»
 
QA Evening Марк Курченко - Чек-лист против тест-кейса
QA Evening Марк Курченко - Чек-лист против тест-кейсаQA Evening Марк Курченко - Чек-лист против тест-кейса
QA Evening Марк Курченко - Чек-лист против тест-кейса
 
QA Evening Игорь Колосов - Performance Testing: Metrics & Measurements
QA Evening Игорь Колосов - Performance Testing: Metrics & MeasurementsQA Evening Игорь Колосов - Performance Testing: Metrics & Measurements
QA Evening Игорь Колосов - Performance Testing: Metrics & Measurements
 
QA Evening Максим Колотилкин - Test State Pattern
QA Evening Максим Колотилкин - Test State PatternQA Evening Максим Колотилкин - Test State Pattern
QA Evening Максим Колотилкин - Test State Pattern
 
Меликян Артём (Team Lead of SEO Classifieds, Netpeak) Продвижение крупных про...
Меликян Артём (Team Lead of SEO Classifieds, Netpeak) Продвижение крупных про...Меликян Артём (Team Lead of SEO Classifieds, Netpeak) Продвижение крупных про...
Меликян Артём (Team Lead of SEO Classifieds, Netpeak) Продвижение крупных про...
 
Клуб Большого мозга - DevOps Evening
Клуб Большого мозга - DevOps EveningКлуб Большого мозга - DevOps Evening
Клуб Большого мозга - DevOps Evening
 
Performance: How to build an app instead of slideshow
Performance: How to build an app instead of slideshowPerformance: How to build an app instead of slideshow
Performance: How to build an app instead of slideshow
 
Productivity Hero. Know Your Tools
Productivity Hero. Know Your ToolsProductivity Hero. Know Your Tools
Productivity Hero. Know Your Tools
 
Мобильная разработка. Между Сциллой и Харибдой. Native, hybrid or cross platf...
Мобильная разработка. Между Сциллой и Харибдой. Native, hybrid or cross platf...Мобильная разработка. Между Сциллой и Харибдой. Native, hybrid or cross platf...
Мобильная разработка. Между Сциллой и Харибдой. Native, hybrid or cross platf...
 

«Эмоциональный веб-дизайн, история одного чуткого лендинга»