Доклад рассчитан на проектировщиков, аналитиков, ux, дизайнеров, менеджеров продуктов. Хочу рассказать про кейс проектирования алгоритма выстраивания одежды, подобранной стилистами, в образ (look). Рассказ про анализ правил формирования образа и выявления потребностей пользователей в отношении подбора одежды для детей. Плюс доработка алгоритма определения цвета вещей и сочетание вещей по цвету. Расскажу, как выявили проблему, как ее решали, к чему пришли. Небольшой кейс, так как цель его была стандартизировать вид образов и увеличить его привлекательность в глазах покупателя. Условия были по категориям и количеству товаров. Впоследствии этот инструмент перешел в руки покупателей и добавилось условие «цвет». Проект, для которого разрабатывался этот алгоритм, на данный момент закрыт или находится в замороженном состояние (бизнес-модель не подтвердилась), так что это не реклама 

1. Дизайн алгоритма,
который помогает подбирать одежду
Сергей Кривой
UX Architect в компании CSI

2. Вдохновители этой презентации
Юрий Ветров «Алгоритмический дизайн» Кирилл Улитин «Алгоритмы в дизайне »
https://www.slideshare.net/jvetrau/ss-69585735
https://www.slideshare.net/KirillUlitin/design-
algorithms-itgm9

3. «Набор инструкций, описывающих порядок действий исполнителя для достижения
некоторого результата»
© Wikipedia
Алгоритмы

4. Как продавать одежду
по-новому?

5. Родитель
— Молодая стильная мама
— Ребенок от 3-х до 16 лет
— Хочет стильно одевать ребенка
— Любит брендовую одежду
— Социально-активная

6. Упростить подбор
одежды для ребенка
Цель проекта

7. Сервис онлайн-
стилистов
Гипотеза №1

8. Что такое lookобраз?

9. Look (образ) — комплект одежды
Верх Низ Обувь

10. Look — комплект одежды + аксессуар
Верх Низ Обувь Аксессуар

11. Инструмент для стилистов

12. Родитель
Процесс подбора
— Ищет вещи в образ
— Составляет образ как хочет
— Следит за соответствие плану
— Расставляет вещи в образе
— Смотрит образы
— Покупает вещи из образа
Стилист

13. Проблемы
х Работают 5 стилистов
х Не укладываются в план
х Образы быстро устаревают
х Образы выглядят как попало
х Образы не привлекают
х Очень маленький выбор
х Вещи не покупают
РодительСтилист

14. Сервис адекватных
онлайн-стилистов
Гипотеза №1.2

15. Как создают образы стилисты

16. Новый разнообразный грид
Алгоритм определяет какой грид выбрать в зависимости от количества одежды в образе

17. 1 3 5 4
Вручную выставляется приоритет для категорий товаров. Алгоритм определяет в какую
ячейку грида какую вещь ставить согласно приоритету.
2
Расстановка вещей в грид

18. Работа алгоритма: выбор грида

19. Работа алгоритма: расстановка вещей

20. Инструмент стилиста

21. Приоритет: верх + кофта

22. Изменен приоритет: верх + низ

23. Процесс подбора
Стилист
— Ищет вещи в образ
— Следит за
соответствие плану
Родитель
— Смотрит образы
— Покупает вещи
из образа
— Выбирает
необходимую сетку
— Расставляет вещи
в сетку
Алгоритм

24. Плюсы
+ Укладывается
в план
+ Довольны своей
работой
+ Улучшилась
привлекательность
образов
+ Стало больше
выбора
+ Увеличил скорость
работы стилиста в 2-3 раза
Стилист РодительАлгоритм

25. Алгоритм
Проблемы
х Образы быстро
устаревают
х Работают 5
стилистов
х Цикл обновление
образов на ребенка
очень большой
х Нет мотивации
вернуться
х С первого раза редко
находят то, что хотят
х Сетки с большим
количеством одежды
х Сетки с маленьким
количеством одежды
Стилист Родитель

26. Сократили количество вещей в образах
7 вещей 6 вещей 5 вещей
+ Увеличили производительность стилистов
+ Улучшили привлекательность образов для покупателей
Магическое правило 7±2 от ученого-психолога Джорджа Миллера
http://tilda.education/courses/web-design/psychophysiology/

27. Научить родителей
быть стилистами
Гипотеза №2

28. АлгоритмРодитель-стилист
Процесс подбора
— Ищет вещи в образ
— Составляет образ
— Покупает вещи из образа
— Выбирает необходимую сетку
— Расставляет вещи в сетку

29. Подбор по цвету
Обрезаем лишнее

30. Подбор по цвету
С помощью Color Thief определяем цвет
http://lokeshdhakar.com/projects/color-thief/

31. Подбор по цвету
Подбираем триаду

32. Подбор по цвету
Определяем оттенки HSL:
Hue — оттенок
saturation — насыщенность
lightness — яркость

33. Процесс подбора
— Ищет вещи в образ
— Составляет образ
— Покупает вещи из образа
— Выбирает необходимую сетку
— Расставляет вещи в сетку
— Определяет цвет вещи
— Определяет цветовые сочетания
— Определяет оттенки
— Фильтрует товары по цвету
АлгоритмРодитель-стилист

34. Каталог с вещами

35. Готовый образ

36. Готовый образ

37. Готовый образ

38. Рекомендую
— Строить CJM, UFM, BPMN для
поиска алгоритмов
— Улучшать алгоритмы
— С. Дасгупта «Алгоритмы»
— Бесплатный курс на Stepik.org
«Алгоритмы: теория и практика.
Методы»

39. Спасибо за внимание!
Сергей Кривой
UX Architect в компании CSI