Фрагмент семинара «Интерактивные механики которые работают»Dmitry Karpov
Слайды дополняющие занятия с участниками семинаров по интерактивным коммуникациям, разбор популярных механик, активаций и процессов организации работ над интерактивным проектом. Серии практических заданий на творческое воображение и развитие интерактивных сценариев. Ментальные практики, анализ материалов и процесс R&D. Семинары проходили в Москве, Санкт-Петербурге, Киеве.
25 упражнений для тех кому больше всех надо. Dmitry Karpov
Обзор популярного формата семинаров и тренировок креативности. Дюжина из более чем 135ти упражнений по прикладным креативным задачам, навыкам. Отборные упражнения и задания для развития креативности, поддержания высокого умственного тонуса и яркого воображения. Автор Дмитрий Карпов делится набором из лучших упражнений для всех, креативщиков, дизайнеров, копирайтеров, предпринимателей. Компактный рассказ об особенностях методики последовательных и разнообразных упражнений на развитие изобретательности, воображения, логики, анализа и визуального мышления. Сессии прошли в десятке городов, успешно помогали различным командам и коллективам в развитии и командной работы и личной творческой эффективности. Приглашаю взять себе в арсенал еженедельной практики, тренировки креативной скорости и усиленного воображения. Ссылки на полезные книги, упражнения и несколько мыслей по организации и методике обучения. Пишите, приглашайте провести сессии в вашем городе, агентстве, студии. Но и сами выполняйте задания, развивайте опыт скоростной, интенсивной творческой работы — это всегда полезно.
Михаил Корепанов "Скорость рендеринга страниц: исследования, замеры, автомати...Yandex
28 мая 2011, Я.Субботник в Киеве
Михаил Корепанов "Скорость рендеринга страниц: исследования, замеры, автоматизация"
О докладе:
В докладе подробно разобрано, что влияет на скорость отрисовки страниц, как ее измерить и как оптимизировать, включая вопрос автоматизации процесса тестирования скорости отрисовки в разных браузерах.
Действительно ли нужно уделять время оптимизации скорости рендеринга страниц или достаточно оптимизировать только скорость загрузки? Что такое reflow и repaint и как это влияет на время отрисовки страниц? Что использовать для измерения времени reflow и repaint? Как автоматизировать процесс тестирования скорости рендеринга страниц в большом количестве браузеров?
Ошибки проектирования высоконагруженных проектов / Максим Ехлаков (OneTwoRent)Ontico
РИТ++ 2017, HighLoad Junior
Зал Сингапур, 5 июня, 15:00
Тезисы:
http://junior.highload.ru/2017/abstracts/2632.html
Наиболее типичные ошибки, которые совершаются при создании высоконагруженных продуктов: выбор используемых языков, фреймворков, СУБД и других инструментов. Каковы причины совершения этих ошибок, и как их избежать.
Во время проектирования и разработки высоконагруженных программных продуктов существует большой соблазн применить классические подходы. Однако не все они будут полезны, а какие-то даже вредны. При этом цена каждой такой ошибки всегда будет очень большой.
На примере нескольких реальных проектов мы поговорим об ошибках проектирования, разработки и управления, о том, почему они возникли, и о решениях, которые позволили (или не позволили) преодолеть их.
Фрагмент семинара «Интерактивные механики которые работают»Dmitry Karpov
Слайды дополняющие занятия с участниками семинаров по интерактивным коммуникациям, разбор популярных механик, активаций и процессов организации работ над интерактивным проектом. Серии практических заданий на творческое воображение и развитие интерактивных сценариев. Ментальные практики, анализ материалов и процесс R&D. Семинары проходили в Москве, Санкт-Петербурге, Киеве.
25 упражнений для тех кому больше всех надо. Dmitry Karpov
Обзор популярного формата семинаров и тренировок креативности. Дюжина из более чем 135ти упражнений по прикладным креативным задачам, навыкам. Отборные упражнения и задания для развития креативности, поддержания высокого умственного тонуса и яркого воображения. Автор Дмитрий Карпов делится набором из лучших упражнений для всех, креативщиков, дизайнеров, копирайтеров, предпринимателей. Компактный рассказ об особенностях методики последовательных и разнообразных упражнений на развитие изобретательности, воображения, логики, анализа и визуального мышления. Сессии прошли в десятке городов, успешно помогали различным командам и коллективам в развитии и командной работы и личной творческой эффективности. Приглашаю взять себе в арсенал еженедельной практики, тренировки креативной скорости и усиленного воображения. Ссылки на полезные книги, упражнения и несколько мыслей по организации и методике обучения. Пишите, приглашайте провести сессии в вашем городе, агентстве, студии. Но и сами выполняйте задания, развивайте опыт скоростной, интенсивной творческой работы — это всегда полезно.
Михаил Корепанов "Скорость рендеринга страниц: исследования, замеры, автомати...Yandex
28 мая 2011, Я.Субботник в Киеве
Михаил Корепанов "Скорость рендеринга страниц: исследования, замеры, автоматизация"
О докладе:
В докладе подробно разобрано, что влияет на скорость отрисовки страниц, как ее измерить и как оптимизировать, включая вопрос автоматизации процесса тестирования скорости отрисовки в разных браузерах.
Действительно ли нужно уделять время оптимизации скорости рендеринга страниц или достаточно оптимизировать только скорость загрузки? Что такое reflow и repaint и как это влияет на время отрисовки страниц? Что использовать для измерения времени reflow и repaint? Как автоматизировать процесс тестирования скорости рендеринга страниц в большом количестве браузеров?
Ошибки проектирования высоконагруженных проектов / Максим Ехлаков (OneTwoRent)Ontico
РИТ++ 2017, HighLoad Junior
Зал Сингапур, 5 июня, 15:00
Тезисы:
http://junior.highload.ru/2017/abstracts/2632.html
Наиболее типичные ошибки, которые совершаются при создании высоконагруженных продуктов: выбор используемых языков, фреймворков, СУБД и других инструментов. Каковы причины совершения этих ошибок, и как их избежать.
Во время проектирования и разработки высоконагруженных программных продуктов существует большой соблазн применить классические подходы. Однако не все они будут полезны, а какие-то даже вредны. При этом цена каждой такой ошибки всегда будет очень большой.
На примере нескольких реальных проектов мы поговорим об ошибках проектирования, разработки и управления, о том, почему они возникли, и о решениях, которые позволили (или не позволили) преодолеть их.
Обзор Starling Framework с точки зрения программиста. В докладе будут раскрыты слабые и сильные места данного фреймворка. Будут проведены: критика архитектуры Starling Framework, обзор узких моментов в коде. Будет описана история его развития в цифрах и тезисах. Будут показаны демонстрационные приложения на нескольких устройствах под Android и устройств от Apple.
Complex hardware solution consists of a glasses \ helmet, which combines technology distorted reality,
particularly technology "cinematic reality" CiNReal, as well QuadVR and QuadAR. Is an innovative
solution to integrate technologies distortion of reality
Обзор Starling Framework с точки зрения программиста. В докладе будут раскрыты слабые и сильные места данного фреймворка. Будут проведены: критика архитектуры Starling Framework, обзор узких моментов в коде. Будет описана история его развития в цифрах и тезисах. Будут показаны демонстрационные приложения на нескольких устройствах под Android и устройств от Apple.
Complex hardware solution consists of a glasses \ helmet, which combines technology distorted reality,
particularly technology "cinematic reality" CiNReal, as well QuadVR and QuadAR. Is an innovative
solution to integrate technologies distortion of reality
2. 15-16 сентября. Екатеринбург
тренировка креативности в веб-дизайне
и новых цифровых медиа, «курс-бестселлер» для
практикующих профессионалов, дизайнеров
и UX специалистов из комбинации
оригинальных методик и известных практик digital
дмитрий карпов 2012
3. Часть номер ноль: «Ты что с Урала?»
Часть первая: «Digital технология перемен»
Часть вторая: Workshop «Огонь и молоты»
Впервые в истории глобальные перемены могут происходить
с достаточной скоростью, чтобы такое понимание стало возможным
для всего общества в целом. Раньше провозвестниками такого рода
просветления были первым делом творцы, у которых была сила
— а также смелость — провидца, чтобы слышать истинный язык
внешнего мира и связывать его с миром внутренним.
Маршалл Маклюэн
дмитрий карпов 2012
8. Цифровая технология
перемен
Любой технологии присущ мидасов эффект:
как только в обществе возникает усиление какого-либо
явления, всё остальное мироустройство тут же начинает
меняться, чтобы встроить в себя эту новинку.
Как только в обществе появляется новая технология,
она тут же меняет всю структуру этого общества.
Следовательно, новая технология — революционный
по своей натуре ингредиент. Мы можем убедиться
в этом, наблюдая, как развиваются электрические медиа.
Маршалл Маклюэн
дмитрий карпов 2012
9. Часть номер один: «Как я это делал?»
Два часа на афишу...
дмитрий карпов 2012
10. Дизайн создает не продукт.
Ценность.
Ценность идеи, материала,
изменяемого мира вокруг.
дмитрий карпов 2012
11. В чем ценность дизайна?
Ценность.
Ценность удобства?
Ценность экономии?
Ценность качества жизни?
дмитрий карпов 2012
13. дизайнер в digital обязан знать
и понимать технологии,
изобретательно использовать
возможности цифровой среды
и постоянно самообучаться
14. прием: креативное тех-проектирование
API
видео-хостинг
место / карты /
координаты
API соц. сети
переводчик
динамический постинг
(Twitter)
изобретательность скорость стабильность
http://www.youtube.com/user/chromefastball
Атрибуты коммуникации бренда дмитрий карпов 2012
22. Вариант с использованием media
<link href="media-
queries. Для определенных разрешений queries.css" rel="stylesheet" type="text/
мы допускаем или запрещаем показ css">
изображений (img), через CSS (display:
Размер экрана меньше 980px
none;). Современные браузеры (адаптивный макет)
адаптированы так, что по умолчанию
Для размера экрана меньше 980px
не загружают изображения, которые применим следующие правила:
отключены для показа. pagewrap = ширина 95%;
content = ширина 60%;
sidebar = ширина 30%.
• Media Queries
• RGBa & HSLa
• Gradients Этот CSS будет применяться для размеря экрана меньше
480px, которая соответствует ширине iPhone в альбомной
ориентации.
• @font-face / Google fonts
html = отключаем регулировку размера шрифта. По
умолчанию iPhone увеличивает размер шрифта, для более
комфортного чтения. Вы можете это отключить добавив -
webkit-text-size-adjust: none;
• Rounded Corners main-nav = сбрасываем размер шрифта до 90%.
• Box Shadow
@media screen and (max-
width: 480px) {
html {
• Multiple Backgrounds -webkit-text-size-adjust: none;
}
• Visual Effects #main-nav a {
font-size: 90%;
padding: 10px 8px;
}
}
дмитрий карпов 2012
27. шрифты издания
NY Irvin
NY Vogue Goat
дмитрий карпов 2012
28. ~бренды участвуют в производстве фильма с новой интерактивной
концепцией —вовлечением пользователей социальной сети, сценарий
фильма подразумевает участие совершенно разнообразных
личностей, часть которых будет из записанных видео участниками
интерактивного проекта
дмитрий карпов 2012
29. API использования видеокамеры на компьютере пользователя
в большинстве случаев используют Adobe Flash
(но тенденция в замещении средствами JS и альтернативами)
http://www.xarg.org/project/jquery-webcam-plugin/
дмитрий карпов 2012
37. Что нужно для успешного проекта
в цифровой интерактивной среде,
именуемо простым уральским
словом DIGITAL?
Ценность.
Ценность идеи, материала,
изменяемого мира вокруг.
дмитрий карпов 2012
38. ideation
direction graphics art
interaction technology language
дмитрий карпов 2012
39. ideation
direction graphics art
interaction technology language
дмитрий карпов 2012
40. {Хорошая идея ничего не стоит
без точной реализации, идея
должна генерировать выгоду,
осознаваемую, измеряемую
выгоду для общества, личности,
автора и давать экономичную
возможность для воплощения}
дмитрий карпов 2012
41. ideation
direction graphics art
interaction technology language
experience intuitive interface artistic innovation
дмитрий карпов 2012
43. {Нет такой общности людей как
«целевая аудитория», есть люди одних
взглядов, общего опыта, языка,
близких целей и предсказуемых
возможностей. Давайте поговорим о
людях соседней улицы или района.
Давайте поговорим об «Уралмаше»}
дмитрий карпов 2012
46. cтереотипы композиции
позволяют создавать привычные, хорошо
знакомые информационные системы,
интерфейсы, поведенческие паттерны,
что помогает строить эффективное
интерактивное взаимодействие
дмитрий карпов / desmonych@gmail.com 2012г
47. основной принцип и критерий
классификации композиционных
принципов в особенностях
навигационного блока и решении
интерактивного пространства
дмитрий карпов / desmonych@gmail.com 2012г
48. Текстовый - формат
Первые сайты в сети. Дизайн
средствами HTML c минимумом
графики и браузерной интерпретацией
по умолчанию (серый фон, синие
ссылки) 1993-1996 распространенный
с выравниванием по центру элементов
или по левому краю экрана
дмитрий карпов / desmonych@gmail.com 2012г
49. Конус - формат
стандартные композиционные модели
формат 1993-1996 распространенный
с выравниванием по центру элементов
дмитрий карпов / desmonych@gmail.com 2012г
50. хорошо знакомый
LEFT - формат и простой
стандартные композиционные модели
формат 1996-1999 формат многих
информационных ресурсов
вертикальный блок навигации слева
дмитрий карпов / desmonych@gmail.com 2012г
51. LEFT - формат
стандартные композиционные модели
формат 1996-1999
дмитрий карпов / desmonych@gmail.com 2012г
52. LEFT - формат
стандартные композиционные модели
формат 1996-1999 традиции
вертикальной навигации с левой
стороны страницы заметно
используются сегодня в веб
дмитрий карпов / desmonych@gmail.com 2012г
58. самый
популярный
П- формат удобный, знакомый
стандартные композиционные модели три блока материалов по краям экрана
широко используется 1996-2005
дмитрий карпов / desmonych@gmail.com 2012г
60. Диск- формат
стандартная композиционная модель
для промо-сайтов, корпоративных
сайтов и мультимедиа дисковшироко
используется 1996-1999 старая школа
дмитрий карпов / desmonych@gmail.com 2012г
61. простой,
выразительный
легко создает иерархию
TOP - формат информации и делит
стандартные композиционные модели страницу на
эмоциональную и
рациональную зоны
легко масштабируется
дмитрий карпов / desmonych@gmail.com 2012г
62. TOP - формат
концентрация важнейшего
функционального материала и
имиджевого / образного в верхней
горизонтали страницы, активный header
использование доминирует1996-2002
cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
дмитрий карпов / desmonych@gmail.com 2012г
63. cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
TOP - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
64. TOP - формат
стандартные композиционные модели
cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
дмитрий карпов / desmonych@gmail.com 2012г
65. TOP LINE - формат
стандартные композиционные модели
http://www.diesel.com/
colorexposure/ дмитрий карпов / desmonych@gmail.com 2012г
66. TOP LINE - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
67. TOP LINE - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
68. TOP LINE - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
69. TOP LINE - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
70. Центральная
MID-LINE - формат
стандартные композиционные модели горизонталь
навигация
содержанием сайта
через центральный блок, который создает
композиционный баланс
дмитрий карпов / desmonych@gmail.com 2012г
71. Центральная
горизонталь
навигация
MID-LINE - формат содержанием сайта
стандартные композиционные модели
через центральный блок, который создает
композиционный баланс
дмитрий карпов / desmonych@gmail.com 2012г
77. cтереотипы
композиции
организация
TOP-SQUARE - формат интерактивного
стандартные композиционные модели пространства
практические приемы проектного
мышления в новых медиа
дмитрий карпов / desmonych@gmail.com 2012г
78. 4-COLUMN - формат
стандартные композиционные модели
http://www.legendary.com/
дмитрий карпов / desmonych@gmail.com 2012г
79. 4-COLUMN - формат
стандартные композиционные модели
http://www.legendary.com/
дмитрий карпов / desmonych@gmail.com 2012г
82. ступени - формат http://www.bureau-va.com
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
83. cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
ступени - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
85. угловой
наклон
композиции
один из самых
выразительных
приемов
angled - формат http://htcsense.dk/
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
87. DOUBLE SLIDER - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
88. DOWN SLIDER - формат
стандартные композиционные модели
http://graphicnovel-hybrid4.peugeot.com/start.html
дмитрий карпов / desmonych@gmail.com 2012г
89. DOWN SLIDER - формат
стандартные композиционные модели
дмитрий карпов / desmonych@gmail.com 2012г
90. вертикальное
падение
метафора композиции
в погружении зрителя
содержание скользит вниз и возникает плавно
с внешних краев браузера
DOWN SLIDER - формат
стандартные композиционные модели
http://www.newzealand.com/int/
http://www.smashingmagazine.com/2012/03/08/behind-scenes-tourism-new-zealand/
дмитрий карпов / desmonych@gmail.com 2012г
91. WATERFALL - формат
тенденция 2011-12
cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
http://pinterest.com
дмитрий карпов / desmonych@gmail.com 2012г
92. cтереотипы
композиции
организация
интерактивного
пространства
практические приемы проектного
мышления в новых медиа
MASH-UP - гибридный формат http://www.pinstagram.co/
тенденция 2011-12
дмитрий карпов / desmonych@gmail.com 2012г
93. MASH-UP - гибридный формат
тенденция 2011-12 особенность в структурной эклектичности,
комбинации совершенно разных, но хорошо знакомых
принципов и паттернов
дмитрий карпов / desmonych@gmail.com 2012г
94. MASH-UP - гибридный формат
тенденция 2011-12 особенность в структурной эклектичности, гибридный формат не значит
комбинации совершенно разных, но хорошо знакомых
принципов и паттернов хаотичный, в его геометрической
структуре всегда есть свой
модульный принцип
дмитрий карпов / desmonych@gmail.com 2012г
95. MASH-UP - гибридный формат
тенденция 2011-12 особенность в структурной эклектичности,
комбинации совершенно разных, но хорошо знакомых
принципов и паттернов
http://www.lust.nl/
дмитрий карпов / desmonych@gmail.com 2012г
98. BOTTOM LINE — формат навигации
в нижней горизонтали страницы
привычная модель композиции с управлением контентом из нижней части страницы,
фактически панель инструментов
(данная область привычно используется для технической информации и сигнала пользователю,
что страница загрузилась)
http://www.sound.philips.com/
дмитрий карпов / desmonych@gmail.com 2012г
101. FULL SCREEN MOTION — видео-сайт
видео композиционно построенное по приемам жанра, принципам съемки и динамике
монтажа с возможностью управления сценами, обычно полноэкранное изображение
http://evelyn-interactive.searchingforabby.com/
дмитрий карпов / desmonych@gmail.com 2012г
102. FULL SCREEN MOTION — видео-сайт
видео композиционно построенное по приемам жанра, принципам съемки и динамике
монтажа с возможностью управления сценами, обычно полноэкранное изображение
http://sagmeister.com/
дмитрий карпов / desmonych@gmail.com 2012г
103. VIMETUBE — видео-интерактив
интерактивные возможности средствами формата сервиса
http://www.youtube.com/profile?
annotation_id=annotation_820885&feature=iv&src_vid=4ba1BqJ4S2M&user=tippexperience
дмитрий карпов / desmonych@gmail.com 2012г
104. INTERACTIVE MOTION — гибридный формат
тенденция 2011-12 интерактивное 3D видео с условно свободной точкой фокуса, управление
выбором точки просмотра и влиянием на композиционное положение объектов
http://www.ro.me/
дмитрий карпов / desmonych@gmail.com 2012г
105. Ошибки арт-директора
давайте обсудим
отличные и заметные
проекты
дмитрий карпов 2012
106. Ошибки арт-директора
крутые иллюстрации, все жутко
тормозит, после просмотра
остается чувство визуального
восторга и полного отсутствия
впечатления от деятельности
компании, как и название
вымывается из восприятия
потоком классных рыб
арт-директор должен понимать,
что такие огромные PNG в
современных браузерах не всегда
плавно плывут, а клиенты плывут
за конкретными выгодами,
экспертизой и авторитетом
http://zestleadership.com/
дмитрий карпов 2012
107. Ошибки арт-директора
один из главных вопросов
остается без ответа, красиво, но
не убеждает рациональными
доводами, примерами,
клиентами... много воды и черным
по черному
http://zestleadership.com/
дмитрий карпов 2012
108. Ошибки арт-директора
текст графикой делать не круто, особенно в такой
композиции легко реализуемой средствами CSS
арт-директору надо следить как его макет
реализуется в деталях, сохраняя эстетику и не
теряя заложенной функциональности
дмитрий карпов 2012
109. Ошибки арт-директора
хорошая, простая идея, есть эмоциональный
контакт, функционально привлекает внимание
к нижнему блоку, но нет развития идеи в
возможные генерируемые веселые диалоги,
выглядит эскизом концепции
слишком много одинаковых визуальных акцентов,
цвета, размеры объектов, много скруглений, теней
под объектами и текстом
интерактивные элементы и цветовое кодирование
не дают очевидного сигнала к возможным
действиям, временная шкала напоминает слайдер,
который провоцирует потянуть, цветные
горизонтальные шкалы неочевидно используют
цвет, сайт старается информировать, но не
стимулировать посетителя играть, что возможно
было частью задачи, название кнопок основных
действий на английском не упрощает понимание
и достаточно выделить заголовок, а не весь блок
вопроса к существующим пользователям gosloto
дмитрий карпов 2012
110. самое скучное, это
проектирование форм
регистрации, покупки,
авторизации, прелодеров,
сообщений об ошибках и
страниц 404...
этим и займемся
дмитрий карпов 2012
118. метод разработки интерфейса
систему без ограничений, недостатки реальной системы теперь фантастический концепт поместите
как достоинства, непривычные приемы взаимодействия, в условия возможной реализации,
неожиданные реакции обратной связи экономики и технологий
дмитрий карпов 2012г. desmonych@gmail.com
119. метод разработки интерфейса
систему без ограничений, недостатки реальной системы теперь фантастический концепт поместите
как достоинства, непривычные приемы взаимодействия, в условия возможной реализации,
неожиданные реакции обратной связи экономики и технологий
например, какие возможности
могут появиться у интерактивных
очков Google, какова возможная
выгода от интеграции сервисов
и новых возможностей?
как возможно взаимодействовать
с очками, и по новому
использовать поисковые
http://youtu.be/JSnB06um5r4 возможности, карты, youtube,
социальные сети, переводчик,
хранение файлов?
дмитрий карпов 2012г. desmonych@gmail.com
131. метод разработки интерфейса
представим себе совершенно новых существ и их возможности, представим себе
интерфейс который управляется жестами или движением глаз, или мыслями
дмитрий карпов 2012г. desmonych@gmail.com
135. метод разработки интерфейса
фантастические интерфейсы помогают расширить представления
о функциональности и эстетических нормах, игнорируя
ограничения, изобретая новое
дмитрий карпов 2012г. desmonych@gmail.com
136. а может и не нужно смотреть
фантастику, а сесть и
внимательно анализировать
существующие приемы на
массовом рынке
дмитрий карпов 2012г. desmonych@gmail.com
142. задание: форма регистрации
на сайте, пять шагов, с каждым шагом
становится все веселее,
познавательней, проще...
отрываемся по полной
дмитрий карпов / desmonych@gmail.com 2012г
150. целенаправленность как метод
Specific / Специфичный Actionable / Осуществимый Relevant / Уместный
Measurable / Измеримый
Trackable / Отслеживаемый
http://uxdesign.smashingmagazine.com/2011/09/13/the-s-m-a-r-t-user-experience-strategy/
дмитрий карпов 2012
151. целенаправленность как метод
Specific / Специфичный Actionable / Осуществимый Relevant / Уместный
Measurable / Измеримый
Trackable / Отслеживаемый
стратегия
результат
продукта
KPI
http://uxdesign.smashingmagazine.com/2011/09/13/the-s-m-a-r-t-user-experience-strategy/
дмитрий карпов 2012
152. проектирование интерфейса
опыт коллег в разработке метода
проектирование интерактивной
платформы / usability and desirability
фактически проектирование Landing Pages
153. проектирование интерфейса
проектирование интерактивной
платформы / usability and desirability
фактически проектирование Landing Pages
A A A D
C ABCD
C
ABCD
C
B B B
ABCD
D D
ABCD
определение групп сценарий оптимизация
задач взаимодействия взаимодействия
построение иерархии важности и зависимости построение модели взаимодействия на основе по закону Фиттса скорость принятия решений и точность
ментальной модели и поведенческой действий зависит ои дистанции до объекта и его величины
А главные
B базовые A что увидит пользователь? правило первого экрана
C вспомогательные B что подумает? правило акцента
D дополнительные C что сделает? правило цветового кодирования / глубины информации
D что получит? какой опыт приобретет?
155. ПЕРСОНЫ
дмитрий карпов 2012г. desmonych@gmail.com
156. метод разработки интерфейса на основе анализа
пользователей /потребителей
работа с «персонами» или «архетипами»
детализированная виртуальная личность собирательный образ
используемая для моделирования опыта, коллективной личности для
мышления, интерактивного поведения моделирования опыта, основных
для создания сценариев и характеристик побудительных мотивов, целей
использования UI и интерактивного поведения для
создания универсальных,
обобщенных интерактивных
сценариев и характеристик UI
http://www.f-i.com/htc/global/
дмитрий карпов 2012г. desmonych@gmail.com
163. ПРОЕКТИРОВАНИЕ ЭТАПА РАЗРАБОТКИ
Важнейшее качество, умение на стадии
проектирования интерактивного и визуального
дизайна предусмотреть оптимальное
техническое решение, уменьшение числа общих
макетов, создание шаблонов, упрощение
деталей
Anton Repponen is Global Creative Director at Fi
дмитрий карпов 2012г. desmonych@gmail.com
164. ПРОЕКТИРОВАНИЕ ЭТАПА РАЗРАБОТКИ
Простая структура взаимодействия
проработанная на стадии дизайна wireframe
позволяет оптимально и экономично
разрабатывать техническое решение, учитывая
возможности устройства и технологий
Anton Repponen is Global Creative Director at Fi
дмитрий карпов 2012г. desmonych@gmail.com
166. метод разработки интерфейса
Reason
объективные
причины как
Research Empathy Acceptance Sophistication Opportunity Nature сумма влияний
на концепцию
интерфейса,
от логики функций
до эстетики
и кончных
впечатлений
Исследование Ментальное Принятие. Какие Разработка Интеграция новых Тестирование прототипа
тематических внедрение, стереотипы первичного возможностей в действии и наблюдение
материалов восприятие существуют, что знают прототипа в первичный за естественным поведением
пользователя через о продукте и функции учитывающего прототип, пользователя. Корректировка
глубокое пользователи, все привычные реализация «природы продукта»,
сопоставление себя принятые паттерны паттерны функциональных расширяемость, ограничения,
поведения и знакомые и сценарии и информационных сравнение с другими
метафоры пользователя приоритетов экосистемами
дмитрий карпов 2012г. desmonych@gmail.com
168. UX проектирование
брендинговые коммуникации / проектирование интерактивной
платформы / usability and desirability визуализируем желания
фактически проектирование Landing Pages
demo демонстрация продукта /сервиса, topline навигационный блок основных проектов
визуальные атрибуты демонстрирующие (смежные промо-сервисы) базовая навигация
обладание и функции, возможные
дополнительные опции и SKU
leadgenerator блок стимулирующий
RTB / рациональный блок, прагматичная вовлечение/действие пользователя, обещание
демонстрация выгод от использования и выгоды
преимуществ
эмоциональная зона / реализует впечатление
стиля, идентификаторов бренда, атмосферы и
social media / интеграция возможностей
элементов позиционирования
социальных медиа
footer / юридическая информация, контактная consumer corner / потребительский блок /
информация, форма регистрации / контактная информация,
форма поиска, вход для постоянных клиентов /
структурная система проектирования коммуникации корзина покупок
бренда в цифровых медия (сайт, аппс, экранные
презентации и инсталляции)
дмитрий карпов 2012
169. Процесс правки
корректировка
анализ техническое исправление
исследование
реализация
возможностей решения техническое исполнение
задачи
публикация
завершение проекта
брифинг
встреча с
клиентом
постановка задачи
определение цели проекта
креативный
процесс
генерация идей презентация
и творческих концепций подтверждение концепции
технологический тест разработка UX визуальный разработка
эксперимент с потенциально возможным интерфейс дизайн кодинг
использованием технологии стимулирующий
возможности креативного процесса
дмитрий карпов 2012
170. проактивное действие
личностное действие по завершению действия
в реальном мире, поход в магазин, выставку,
кино, сервис, оформление заказа, завершение
потребительского цикла
создание сюжета осознанного
активация / решение / шаринг
сопереживания эмоциональному
состоянию персонажа
подтверждение принятого личного
расширение интереса сценариями решение, (заполнение формы,
разной активности, игр, конкурсов, регистрация участника акции)
актуальный контент, скидки эмпатия стимуляция распространения
стимуляция личностного информации участником,
интереса, раскрытие ознакомление ближнего круга,
удовлетворения мотива вовлечение используем мотивы просоциальные
и самоутверждения
создание визуального импульса
инстинктивного, понятного в
секунду контакта, фиксирует стимул
внимание
использование мотива личности,
опредмечивание мотива в
импульс
вербальном и визуальном
пространстве
мотив
потребность
психологический паттерн функциональный обратная связь
действия дизайнера,
проектирование взаимодействия
Дмитрий Карпов 2012г
171. задача клиента репрезентация
задачи с позиции
пользователя
реальный срок психологическая визуальная интерпретация
механика
вербальная интерпретация
техническая модель
социальная интеграция
% реализуемость модели
набор
обязательных
творческая интерпретация образа
образов
реализации мотива (показать власть
над объектом, подчеркнуть престиж,
демонстрация личного достижения,
идентифицировать личность с
героем)
прогнозируемая реализация
реализуемость визуальной
мотивов психологической
коммуникации и технической
механики
интерактивной модели
дмитрий карпов 2012
173. маркетинговая воронка
принцип формирования отношения потребитель&продукт
Awareness — узнавание названия бренда и его
Awareness принадлежность к категории.
Acceptance Acceptance — принятие бренда. То есть, потребитель
не отрицает возможности приобретения.
Trial — пробная самостоятельная покупка. Trial
Retention / Preference — потребление товара или услуги
Retention / Preference по рациональным причинам (цена, акции, наличие в
Loyalty ближайшем магазине и пр.) на постоянной основе.
Loyalty — потребление по эмоциональным
причинам. Меньше зависит от цены,
дистрибуции и других объективны факторов. Advocacy Advocacy является следствием работы с лояльностью
и приводит к распространению положительных
Accumulation рекомендаций (word of mouth)
Accumulation — накопление знаний и опыта потребления
товаров бренда, что приводит к желанию пользоваться
любыми товарами, доверяя качеству (рационально) и
характеру бренда (эмоционально) является следсвием
работы коммуникаций не только ориентированных на
потребителя, независимые media материалы.
дмитрий карпов / desmonych@gmail.com 2012г
174. маркетинговая воронка
принцип формирования отношения потребитель&продукт
Awareness
Acceptance
Trial
Retention / Preference
Loyalty
Advocacy
Accumulation
дмитрий карпов / desmonych@gmail.com 2012г
175. маркетинговая воронка
принцип формирования отношения потребитель&продукт
Awareness
Acceptance
Trial
Retention / Preference
Loyalty
Advocacy
Accumulation
дмитрий карпов / desmonych@gmail.com 2012г
182. Awareness
Trial
Acceptance
дмитрий карпов / desmonych@gmail.com 2012г
183. Try to Buy
дополнительный фактор убеждения
минимальный риск
дополнительный фактор убеждения
качество / демонстрация
дмитрий карпов / desmonych@gmail.com 2012г
184. Awareness узнавание «...кстати, вот что посмотрю»
возможно «интересно... нравится»
Acceptance
вот бы мне такие «офигительно смотрится»
Trial
Acceptance
хочу «уверен, мне подхолит»
дмитрий карпов / desmonych@gmail.com 2012г
185. Тайна профессии: Не спрашивай у пользователя мнения,
дай ему готовый продукт
Тайна профессии: Читай в день по заметке о технологии
Тайна профессии: Меньше слушай советов, больше пробуй сам
Тайна профессии: Пять лет назад устройство типа IPad было фантастикой,
сегодня у многих, завтра у всех
Тайна профессии: Лучше спорить прототипами
дмитрий карпов / desmonych@gmail.com 2012г