E-commerce web 2.0 для Полякова Елена проектировщик интерфейсов HumanoIT Group. - презентация

Web 2.0 в контексте интернет- магазинов

Weи 2.0 - технология второго поколения

3/55

Web 2.0 в контексте интернет магазинов

4) Теги: метки, которые присваиваются объекту,

4/55

RIA интерфейсы (Rich Internet Applications Interface)

Тонкий Client

HTML
DHTML

RIA клиент

Ajax
Flash

Rich User Experience
Приложение

5/55

Виджеты (Widgets):

1. Выпадающий список (combo box)

Компоненты RIA:

6/55

2. Аккордеон (Accordion)

3. Календарь (Datepicker)

Компоненты RIA:

7/55

4. Диалог (Dialog)

Компоненты RIA:

8/55

5. Индикатор (Progressbar)

6. Слайдер (Slider)

Компоненты RIA:

9/55

5. Слайдер (Slider)

Компоненты RIA:

10/55

5. Вкладки (Tabs)

Компоненты RIA:

11/55

Перетаскивание (Drag and drop)

Растягивание (Resizable)

Интерактивность RIA:

Выделение (Selectable )

12/59

Эффекты:
подсвечивание,
пульсирование,
увеличение в размерах,
встряска (shake),
мерцание,
появление и

Как улучшить структуру каталога

Профиль товара

1) Описание

2) Фото

3) Цена

4) Заказ товара (добавление

Профиль товара

http://www.onlineshoes.com/

14/59

Профиль товара

http://www.onlineshoes.com/

15/59

Как улучшить структуру каталога

Каталог с использованием RIA контролов

1) Фильтры - слайдеры

2)

17/55

18/55

Как улучшить структуру каталога

Логическое мышление

«Процесс мышления и коммерческого выбора более сложный

Как улучшить структуру каталога

Мнемотехнические принципы запоминания образов:

1) Синестезия – комбинирование всех

Как улучшить структуру каталога

Распознавание образов:

«А у вас есть такой же, но

Как улучшить структуру каталога

3) Фрагментированный поиск

4) Загрузку собственного контента и поиска

Как улучшить структуру каталога

23/55

Browsegoods (http://browsegoods.com/)

Интернет –площадка, специализирующаяся на продажах обуви.

Что использует:

1) Визуальный поиск, зуммирование

2)

Browsegoods (http://browsegoods.com/)

Как улучшить структуру каталога

25/55

Modista (http://www.modista.com/)

Интернет –площадка, специализирующаяся на продажах обуви, товаров для детей, сумок

3) Добавление в выбранные товары, разослать друзьям, добавить в блог

4) Фильтры

Modista (http://www.modista.com/)

Как улучшить структуру каталога

28/55

Как улучшить структуру каталога

Каталог с использованием Flex

Volkswagen (http://www.volkswagen.co.uk/used)

Преимущества:

1) Интерактивность

2) Визуализализация фильтра,

Как улучшить структуру каталога

30/55

Оптимизация процесса выбора, заказа и покупки товара

Корзина товаров, характеристики:

1) Визуально

Оптимизация процесса выбора, заказа и покупки товара

6) Хранит историю покупок

7) Добавление

Корзина товаров

33/55

http://www.diapers.com/

Оптимизация процесса выбора, заказа и покупки товара

Помощники по выбору товара:

1) Гуру

2)

Оптимизация процесса выбора, заказа и покупки товара

Гуру по выбору товаров:

http://market.yandex.ru/

35/55

Обзор RIA приложений для интернет - магазинов

Что это такое?

Калькуляторы, журналы расходов,

Обзор RIA приложений для интернет - магазинов

Заказ тест драйва online

https://www.volkswagen.co.uk

37/55

Обзор RIA приложений для интернет - магазинов

Журнал расходов

http://avtomarket.ru/

38/55

Обзор RIA приложений для интернет - магазинов

Задачи которые решает

1) Самопрезентация авто

Обзор RIA приложений для интернет - магазинов

Составляющие успешного интернет магазина:

1) Структурность,

PET дизайн (Persuasion, Emotion, and Trust )

Убеждающий, эмоциональный и вызывающий доверие

PET дизайн (Persuasion, Emotion, and Trust )

Дизайн должен не только простым

PET дизайн (Persuasion, Emotion, and Trust )

Пример убеждающего спецпредложения с onliner.by

Исходный

PET - инструменты

Оптимальный уровень диссонанса
(Optimal Level of Dissonance)

Указание причины для

PET - инструменты

Социальные доказательства
(Social Proof)

Социальное доверие
(Social Learning)

45/55

PET - инструменты

Нехватка
(Scarcity)

Внешнее вознаграждение
(Extrinsic Reward)
и ограничение во времени

46/55

PET - инструменты

Ассоциации
(Association)

Возможность персонального выбора
(Public Statement, Choice)

47/55

PET - инструменты

48/55

PET - инструменты

Скидки
(Discounts)

Дорогой, значит хороший
(High price equals good )

Власть людей, которые

PET - инструменты

Импульс ДА
(Momentum of "Yes")

Превышение ожидания
(Overestimation of big unlikely events)

Распределения

PET дизайн (Persuasion, Emotion, and Trust )

51/55

PET дизайн (Persuasion, Emotion, and Trust )

PET дизайн для onliner.by

52/55

Подведение итогов

RIA технология
Технология настоящего будущего

Победит сильнейший
Специализированные магазины, супермаркеты

Один в поле не

Подведение итогов: роль и возможности технологий WEB

Будьте на волне новых технологий