Доклад с конференции DUMP-2016 Секция Web-дизайн

1. Как выжить в условиях сложного продукта:
что полюбить, с чем бороться, а на что забить?
Прокуда Дарья

2. Что такое дизайн сложного продукта
и чем он отличается от проекта

3. Сложности в дизайне продукта
начинаются ровно тогда,
когда заканчивается проект
Что такое дизайн сложного продукта
и чем он отличается от проекта

4. Проект
Результат селекции
Создается из идеи
Придерживается
концепции
Требует сохранения
единого видения

5. Продукт
Адаптируется
под изменения
Эволюционирует
из существующего
Генетическая мутация
Видение терпит изменения
с течением времени
Проект
Результат селекции
Создается из идеи
Придерживается
концепции
Требует сохранения
единого видения

6. Конструктивное противоречие
Дизайн не должен радикально меняться
(потому что надо сохранять консистентность)
Дизайн должен радикально меняться
(потому что меняется бизнес)

7. Когда нужно что-то менять
Накопление изменений — это проблема,
революция — это долго и дорого,
в процессе можно все потерять,
но
поэтому
…

8. Никаких революций, только эволюция

9. Как бороться с мхом

10. Дизайнер видит весь экран

11. Пользователь видит лишь часть
Дизайнер видит весь экран

12. Дизайнер видит весь экран
Пользователь видит лишь часть

13. Запускай эволюцию продукта
частями и не забывай про связи

17. Кажется, сейчас будет
про консистентность…

18. Консистентность – это
согласованность данных друг с другом,
целостность данных, а также внутренняя
непротиворечивость

20. Зачем она нужна?
Чтобы кровь не текла из глаз (дизайнера)
Чтобы продукт сохранял свое собственное лицо
Чтобы пользователь не учился интерфейсу заново
Чтобы продукт не терял конверсию

21. Инструменты сохранения
консистентности
Базовые соглашения лейаута

22. Инструменты сохранения консистентности
Базовые соглашения лейаута

23. Инструменты сохранения
консистентности
Базовые соглашения лейаута
Единая навигация

25. Инструменты сохранения
консистентности
Базовые соглашения лейаута
Единая навигация
Сетка

27. Инструменты сохранения
консистентности
Базовые соглашения лейаута
Единая навигация
Сетка
Паттерны переходов

29. Инструменты сохранения
консистентности
Базовые соглашения лейаута
Единая навигация
Сетка
Паттерны переходов
Палитра (стилей, цветов, элементов)

31. Используя эти приемы,
вы создаете и сохраняете
визуальный язык

32. Развитие созданного языка
Словарь Языковая
практика
Синтаксис
+ терпение

33. Развитие созданного языка
Словарь Языковая
практика
Синтаксис
Палитра
стилей, цветов,
элементов
Тестирование
на людях
и на себе
Построение
предложений
+ терпение

34. Развитие созданного языка
Словарь Языковая
практика
Синтаксис
Палитра
стилей, цветов,
элементов
Тестирование
на людях
и на себе
Построение
предложений
+ терпение
Дизайнер!
Пользуйся своим продуктом!

35. Исследование и выдвижение гипотез
Аналитика Метрики
Новые сегменты
пользователей
Дешевые тестовые страницы руками маркетологов
Все могут ошибаться

36. Исследование и выдвижение гипотез
Аналитика Метрики
Новые сегменты
пользователей
Дешевые тестовые страницы руками маркетологов
Все могут ошибаться
Вот это вы и так знаете:

37. Исследование и выдвижение гипотез
Аналитика Метрики
Новые сегменты
пользователей
Дешевые тестовые страницы руками маркетологов
Все могут ошибаться
Вот это вы и так знаете:
Самый дешевый станок для исследований:

38. Исследование и выдвижение гипотез
Дешевые тестовые страницы руками маркетологов
Все могут ошибаться
А вот главное, что нужно знать про эксперименты:
Аналитика Метрики
Новые сегменты
пользователей
Вот это вы и так знаете:
Самый дешевый станок для исследований:

40. Как навести порядок
Всегда есть приоритеты, и они обычно
направлены на внедрение новых фич
Всегда есть желание прибраться
в процессе

41. Как навести порядок
Всегда есть приоритеты, и они обычно
направлены на внедрение новых фич
Всегда есть желание прибраться
в процессе
Прибираемся по ходу
внедрения нового

45. Как навести порядок
Всегда есть приоритеты, и они обычно
направлены на внедрение новых фич
Всегда есть желание прибраться
в процессе
Прибираемся по ходу
внедрения нового
Влезаем без очереди

46. Дизайн на коленке
быстро / отлично / сразу в продакшн

47.
Дружи с верстальщиком, пусть он всегда
зовет тебя чинить костылями
Используй тулзы, например, Speck King
Объясняй голосом — работай в команде

49. Как понять, что нужна революция?
Если фундаментальные гипотезы
оказались ошибочными
Когда количество фич начинает зашкаливать
и мы теряем главную ценность

50. Как понять, что нужна революция?
Если фундаментальные гипотезы
оказались ошибочными
Когда количество фич начинает зашкаливать
и мы теряем главную ценность
Тут нужен pivot
А тут сконцентрироваться на самом
важном

51. А ещё надо много фигачить
Чем больше опыт, тем выше скорость
Делать полезно всё: от презентаций до видеорекламы.
Так лучше понимаешь продукт и контролируешь
его консистентность по всем фронтам
Не надо фрустрировать, если что-то не вошло в релиз

52. Немного психотерапии

53. Немного психотерапии
Люби
Терпи
UX важнее UI
Надо прощать несовершенство
Борись
Верь, что все в команде хотят одного и того же
UI все-таки влияет на UX
Стиль должен уметь жить дольше, чем набор фич

54. Когда же это закончится?
Время от времени меняй контекст,
переключайся на другие проекты
Но помни, что ты в вечном рабстве
меня заставили это написать

55. Спасибо за внимание
Прокуда Дарья Jetstyle / Ridero
prokudada@jetstyle.ru
ridero.ru