Позднее Ctrl + ↑

Посетил второй по счёту митап по CJM от Мегафона

Вчера посетил CJM Meetup 2. Митап проходил в офисе Мегафона по адресу Оружейный переулок 41. По прибытию на место немного замешкался с выбором входа. Я не был на предыдущем ивенте и не сразу определил нужный вход. Впопыхах сначала забежал в Сбербанк. Тут можно было бы составить небольшую CJM о том как я искал нужное место :)

На ресепшене выдали браслет и до конференц-зала на 4 этаже я добрался на лифте. Меня встретил уютный зелёно-фиолетовый айтишный офис, а у кофе-поинта я пересёкся с коллегами из Райффайзенбанка. Приятная своей неожиданностью встреча. Специально не сговаривались.

Велась видеотрансляция, но не всё попало в итоговую запись. Я присутствовал на трёх первых докладах. Остальное досмотрел на ютубе:

Кто выступал (презентации по ссылкам):

  1. Андрей Золотов «Какими метриками обогатить CJM, чтобы она выявила проблемы в исследуемом процессе».
  2. Сергей Комарденков «Один CJM — одна история. Или откуда у CJM ноги растут».
  3. Алексей Копылов «Инструменты для CJM. Сравниваем инструменты для создания и сопровождения CJM».
  4. Юрий Веденин «Как использовать Customer Journey Map для onboarding».
  5. Владимир Мельников «Customer Journey, Hype Cycle и эффект Даннинга-Крюгера при внедрении CJM»..
  6. Владимир Зимин «CJM и суровая реальность»
  7. Магомед Яндиев «Проходите раздевайтесь, или что customer journey map может сказать о вашей компании».
  8. Наталия Спрогис «Фабрика по производству CJM, или сложности внедрения в крупной компании».

Запомнились здоровская организация, интересные спикеры и тёплая профессиональная атмосфера. Обязательно пойду на следующий митап.

Документальный фильм «Техническая эстетика»

Посмотрел вчера замечательный фильм об уникальном явлении в СССР — Технической эстетике. ТЭ это альтернатива западному — Дизайн, но в условиях плановой экономики. Взгрустнул о судьбе ВНИИТЭ. Впервые эти аббревиатуры я услышал студентом из уст преподавателей в Институте дизайна. Я учился в филиале Уральской Государственной Архитектурно-Художественной Академии в городе Тюмень. Поэтому я тоже пропитан частичкой ТЭ:)

В декабре 2017 г. была премьера в Москве. Я не смог посмотреть вживую, но занёс в планы посмотреть позже. Этот день настал. Фильм появился в открытом доступе. Design Prosmotr прислали ссылку на VK и YouTube. В одном из интервьюируемых экспертов узнал своего преподавателя и создателя Тюменской школы дизайна — Вершинина Г. В. Приятно, что имел честь учиться у таких мэтров.

Советую к просмотру всем дизайнерам независимо от специализации.

2018   смотрю

Как решать UX-задачи? от Собаки Павлова

Хочу порекомендовать очередное мобильное чтиво — книгу Ольги Павловой «Как решать UX-задачи в ситуации незнания и самообмана». Автор делится опытом проектирования интерфейсов, накопленный командой питерской студии — «Собака Павлова».

Книга написана в хулиганской манере в намеренно разговорном стиле, чтобы аудитория легче впитывала мудрёные ux-практики. Данная книга — хороший повод познакомься с реальной стороной проектирования, очищенной и идеализаций и мифов, которые гуляют по интернету. Для себя я обнаружил целый список практик, с которыми я мало знаком или незнаком вовсе. Список зафиксировал, буду повышать эрудицию. Немного сумбурно, но познавательно. Ключевые поисковые фразы заданы. Копайте дальше сами.

«Наукоёмкие методы»

  1. Количественный анализ пользователей
  2. Этнографические методы
  3. Качественный анализ пользователей (интервью)
  4. Полевое наблюдение
  5. Usability-тестирование
  6. Фокус-группа
  7. Eye tracking

«Простой анализ»

  1. Опрос через сеть
  2. SWOT-анализ
  3. Тайный покупатель
  4. Lean Canvas
  5. Business Canvas
  6. Эвристический анализ интерфейса
  7. Сравнительное usability-исследование
  8. A/B-тестирование
  9. Приемочное пользовательское тестирование
  10. Consumer Trend Canvas
  11. Экспертная оценка интерфейса
  12. Анализ статистики использования
  13. Анализ поисковой статистики
  14. Тестирование на соответствие постановке
  15. Анализ выполнения сценариев»

«Управление требованиями»

  1. Профили пользователей
  2. Жизненные ситуации
  3. Сценарии использования
  4. Информационные ожидания
  5. Описание порога вхождения
  6. Карточная сортировка
  7. Концепция продукта
  8. Семантический дифференциал
  9. Описание ожиданий пользователей
  10. Карта прорыва

«Погружение»

  1. Анализ конкурентов
  2. Анализ обратной связи от пользователей
  3. Сбор технологических ограничений
  4. Анализ существующего IT-решения
  5. Анализ существующего IT-производства

«Работа с текстом»

  1. Информационный текст
  2. Интерфейсный текст
  3. Структура контента
  4. Информационная модель

«Работа в команде»

  1. Консультация
  2. Метод 6 шляп
  3. Брейншторминг по методу Диснея
  4. Линейное совещание
  5. Мозговой штурм
  6. Обсуждение при помощи стикеров
  7. Фасилитация

«Визуализация»

  1. Концепт-прототип интерфейса
  2. Модель Кано
  3. Визуализация идей
  4. Moodboard
  5. Визуальный прототип интерфейса
  6. Карта эмпатии
  7. Эстетическое решение интерфейса
  8. Интерактивный прототип
  9. Цветовое кодирование
  10. Бумажное прототипирование
  11. Customer Journey Map
  12. Рисование эскизов
  13. Быстрое прототипирование
  14. Детализация прототипа (работа с микровзаимодействиями)
  15. Рассказывание историй интерфейсами

Эта книга и ещё две доступны по ссылке. Пользуйтесь.

2018   читаю

Что почитать? Выпуск 1

Чтиво к выходным.

Собака Павлова переделывает электронную очередь.

#ВсёПеределать: электронная очередь в Сбербанке

Ветров про Paradigm.

Юрий Ветров: аутсорс и развитие дизайн-системы

Дизайн это не математика. Компенсируйте!

Оптическая компенсация

Чёрные ux-паттерны примеры из жизни.

Всплывающий чат

Протри кейсы на  Behance.

Когда твой Биханс покрылся пылью

Бюро «Щука» рассказывает про свои убытки.

Кейс бюро «Щука»: как оценить работу дизайнера во времени и выйти из убытков

Как развивалась UX-методология от Дональда Нормана до настоящего времени.

Эволюция методологии UX процесса

2018   читаю

Что почитать? Выпуск 0

Решил попробовать новый формат заметок с минимальным описанием, в которых я делюсь полезными ссылками на статьи, которые успеваю читать в течении недели. Я подписан на различные группы, рассылки и ежедневно получаю множество уведомлений о интересных статьях, которые не успеваю читать сразу. Обычно я заношу такие статьи в «список для чтения» и возвращаюсь к ним, когда у меня появляется свободное время. Я столкнулся с проблемой, что забываю разбирать эти архивы ссылок и они просто превращаются в бесполезный инфо-мусор. Занялся генеральной уборкой. То, что прочитал буду безжалостно удалять из списка для чтения. Ссылки на прочитанные статьи теперь будут жить в заметках.

Redmadrobot делится внутренней кухней управления.

Делегирование: личный опыт

Хитрые figma-компоненты.

Component architecture in Figma

Про трение в пользовательском взаимодействии.

Искусственное усложнение интерфейса с заботой о пользователе

Первый шрифт, который позволяет печатать строковые графики.

The world’s first code-free sparkline typeface

Развернутый совет о том, как следует нанимать дизайнера.

Рекрутерам от Дизайнера

2018   читаю

Material Design UI Kit для Figma

Недавно меня озадачили проектированием интерфейса приложения (web/mobile). Главным условием являлось использование дизайн системы Google Material Designe. Я решил в целях оптимизации затрат на ui поискать готовые решения. Как основной рабочий инструмент проектирования я использую Figma (хотя владею и Sketch). Учитывая то обстоятельство, что дизайн-система от Google ладно спроектирована хорошо распиарена, то я нашёл то, что искал.

Колдовство с поисковой строкой дало следующий результат:

  1. https://gumroad.com/l/FigUIKitFree
  2. https://materialdesignkit.com/android-gui
  3. http://demos.creative-tim.com/material-kit-figma/presentation.html
  4. http://setproduct.com/material/components
2018   делаю

Прочитал «Додо-книгу»

По рекомендации Антона Жиянова («Интерфейсы без шелухи») прочитал занимательную бизнес-книжицу — «Додо-книга».

Автор «Додо-книги» — предприниматель Фёдор Овчинников. Фёдор создал за короткий срок прибыльную международную сеть пиццерий под названием «Додо-пицца». Как неудивительно, но штаб-квартира «Додо-пицца» находится не в Москве, а в Сыктывкаре. С первого дня работы команда «Додо-пиццы» поставили себе амбициозную цель — делать лучшую пиццу. К этой цели Фёдор Овчинников стал идти, внедряя различные ноу-хао. Например, заказывая пиццу, покупатель может следить за её приготовлением через, установленные на кухне, веб-камеры. Для «Додо-пиццы» характерна открытость. На любом сайте пиццерии, входящей в додо-франшизу, можно ознакомиться с финансовыми отчётами. Корпоративную додо-культуру отличает сплочённость колектива и отсутствие разделения работы на престижную и непрестижную. «Даже директор может полы помыть или встать за кассу.» В «Додо» гуманное отношение к сотрудникам, никого не наказывают и не штрафуют, а обучают. При таком подходе сотрудники сами стремятся не допускать ошибок и другим не дают их совершать. Додо-правила предписывают фанатично соблюдать чистоту, как в клиентских помещениях, так и на кухне. Додо-программисты создали и развивают информационную систему, которая автоматизирует обработку заказов и хранит данные в облаке. В «Додо» можно инвестировать и получать регулярный пассивный доход.

Книга очень интересная и изобилует примерами из реальной практики. Читается на одном дыхании, распространяется в удобном электронном формате. Я читал в метро, во время утренних и вечерних поездок, в течении недели. Советую такой формат если времени на чтение не хватает.

По ходу чтения конспектировал полезные советы. Старался выбирать универсальные решения, которые можно применить не только к пиццерии, но и к любому делу.

Цитаты из книги:

«… толь­ко пол­ное погру­же­ние в биз­нес при­но­сит реаль­ный резуль­тат. Чтобы не ото­рвать­ся от реаль­но­сти и не при­ни­мать дурац­ких реше­ний, мене­дже­рам нуж­но посто­ян­но нахо­дить­ся там, где людям при­хо­дит­ся эти реше­ния исполнять.»

«Это место, где испол­ня­ют­ся реше­ния и созда­ет­ся истин­ная цен­ность биз­не­са, по-япон­ски назы­ва­ет­ся гем­ба. Руково­ди­те­лям авто­мо­биль­ных заво­дов Toyota, напри­мер, пола­га­лось посто­ян­но ходить в гем­бу, то есть на про­из­водствен­ную линию.»

«Такая прак­ти­ка была неотъ­ем­ле­мой частью леген­дар­ной систе­мы управ­ле­ния заво­да­ми Toyota. С ее помо­щью ком­па­ния пре­вра­ти­лась из про­из­во­ди­те­ля деше­вых и весь­ма посред­ствен­ных машин в одно­го из лиде­ров миро­во­го авто­рын­ка, извест­но­го преж­де все­го сво­им качеством.»

«Работа руководителя плечом к плечу с командой поднимает ее боевой дух»

«Чтобы чем-то управ­лять, нуж­но это изме­рить», — гово­рил Федор. Чтобы улуч­шать каче­ство про­дук­та и сер­ви­са, нуж­но было начать его изме­рять. А как ина­че ты узна­ешь, справ­ля­ешь­ся ли с постав­лен­ной зада­чей или нет?»

«Важно никогда не успокаиваться …»

«Чем бы ни зани­ма­лись в ком­па­нии — раз­ра­бот­кой сай­та, созда­ни­ем систе­мы поста­вок или дизай­ном пиц­це­рий — все­гда стре­ми­лись к тому, чтобы не варить­ся в сво­ем соку, а как мож­но быст­рее тести­ро­вать идеи на деле. В дру­гих ком­па­ни­ях над запус­ком про­ек­тов порой рабо­та­ли меся­ца­ми, если не года­ми — толь­ко для того, чтобы в кон­це кон­цов узнать, что полу­чив­ший­ся про­дукт нико­му уже не нужен. Приступая к «Додо ИС», он учел этот опыт — и поэто­му раз­бил про­цесс на неболь­шие бло­ки, кото­рые мож­но было быстро внед­рить в реаль­ной пиц­це­рии, чтобы систе­ма сра­зу нача­ла при­но­сить пользу.»

«Каждый блок коман­да ста­ра­лась делать мак­си­маль­но хоро­шо, но при этом не поз­во­ляя себе оттягивать запуск под пред­ло­гом того, что систе­ма недо­ста­точ­но совер­шен­на. «Done is better than perfect», — любил повторять Федор. По-рус­ски это зву­ча­ло бы навер­ное так: луч­ше сде­лать, чем мечтать.»

«Самые успеш­ные миро­вые ком­па­нии посту­па­ли так же — они ста­ра­лись выпу­стить на рынок мини­маль­но жиз­не­спо­соб­ный про­дукт (по-англий­ски это назы­ва­ет­ся MVP — minimal viable product), а потом дове­сти его до иде­а­ла мето­дом посто­ян­ных совер­шен­ство­ва­ний (по-япон­ски это назы­ва­ет­ся кайдзен). Такой под­ход при­но­сил луч­шие резуль­та­ты, чем стрем­ле­ние сра­зу все сде­лать без малей­ше­го изъ­я­на. Ведь толь­ко ввя­зав­шись в бой, мож­но понять, каким дол­жен быть иде­аль­ный продукт.»

«Жалоба — это пода­рок», — про­воз­гла­шал извест­ный биз­нес-прин­цип. Ведь жало­ба — это пода­рен­ная тебе воз­мож­ность стать луч­ше. Крити­ка ранит. Но имен­но она поз­во­ля­ет людям и ком­па­ни­ям рас­ти над собой. Бизнес не может без при­бы­ли. «Отсут­ствие при­бы­ли — пре­ступ­ле­ние перед обще­ством», — гово­рил созда­тель брен­да «Панасо­ник» Коно-сукэ Мацуси­та, Израильский бизнес-консультант Элияху Голдрат про­сла­вил­ся на весь мир тем, что сфор­му­ли­ро­вал «тео­рию огра­ни­че­ний», кото­рая помо­га­ет ком­па­ни­ям все­го мира доби­вать­ся луч­ших результатов.»

«В ее осно­ве лежит про­стая идея: про­из­во­ди­тель­ность любо­го пред­при­я­тия все­гда рав­на про­из­во­ди­тель­но­сти ее «узко­го гор­лыш­ка» — наи­ме­нее про­из­во­ди­тель­но­го узла.»

«Ресурсное мышление». Как толь­ко что-то идет не так, мене­дже­ры сра­зу же оправ­ды­ва­ют­ся тем, что у них мало рабо­чих рук. И чтобы все шло так, надо их про­сто добавить.»

«Посто­ян­но избе­гая встре­чи с силь­ным сопер­ни­ком, чем­пи­о­ном не станешь.»

«От перестановки мест слагаемых сумма может сильно измениться»

«Если нара­щи­вать про­да­жи, не собрав коман­ду и не обес­пе­чив пре­вос­ход­ное каче­ство, мож­но толь­ко рас­пу­гать кли­ен­тов. Если, наобо­рот, начать эко­но­мить и ста­рать­ся выжать при­быль, не нарас­тив про­даж, мож­но так нико­гда и не уви­деть этой самой прибыли. Всему свое вре­мя. Снача­ла нуж­но вкла­ды­вать­ся в рост — а толь­ко потом искать, на чем экономить.»

«Ведь откры­тость ком­па­нии — финан­со­вая про­зрач­ность, при­зна­ние оши­бок, сво­бод­ное рас­про­стра­не­ние идей — созда­ва­ла дове­рие. А дове­рие в совре­мен­ном мире — самый цен­ный капи­тал. Если тебе дове­ря­ют люди, для тебя нет ниче­го невозможного.»

«Откры­тость застав­ля­ет систе­му посто­ян­но само­со­вер­шен­ствовать­ся. И в дол­го­сроч­ной пер­спек­ти­ве все оце­нят резуль­та­ты. Для акци­о­не­ров это гаран­тия чест­но­сти, для поку­па­те­лей это гаран­тия каче­ствен­ных про­дук­тов и вымытых рук.»

«Большие цели привлекают людей, которым интересно открывать новые миры.»

P.S.: На ютубе есть канал, посвящённый додо-экспедициям:

в Нью_Йорк

в Китай

2018   читаю

Сдал 5-ую тему курса «UX Design»

Прохожу удалённое обучение на курсе «UX Design» от Skilbox/AIC. Хочу поделиться своим небольшим достижением — я успешно сдал домашнее задание по 5-той теме — «UX-проектирование. Исследование интерфейсов». Данная тема входит в блок, состоящий из двух тем. На очереди 6-ая тема — Data driven design.

В домашнем задании требовалось создать прототип заявки на кредит наличными. Для этого следовало провести аудит сайтов нескольких банков и предоставить свой вариант с улучшениями, которые сопроводить обоснованием. На сайтах банков требовалось анализировать только раздел кредита наличными. Объём работ включал: главную страницу, сегментацию по кредитам, кредитный калькулятор и оформление заявки.

В процессе выполнения задания, я изучил кредитные калькуляторы у трёх банков: Сбербанк, ВТБ и Тинькофф Банк. Прошёл по всем этапам оформления заявки на кредит для каждого банка. Наиболее понятным интерфейсом, как кредитного калькулятора, так и заявки на кредит обладает ВТБ. Я взял за основу его визуальный стиль и структуру и доработал. Макет дополнил комментариями по ключевым вопросам

Полноформатные изображения из слайдера ниже: 01, 02, 03.

Благодаря существованию такого замечательного инструмента как Figma, я могу поделиться ссылкой на макет и экспресс-прототип с резкими переходами. Sketch такого к сожалению не позволяет.

P.S.: Пока писал этот пост, наткнулся на отзыв дизайнера об обучении в Skilbox на курсе «UX Design». Думаю стоит потрудиться. Деньги отобьются :)

2018   учусь

Опыт по разворачиванию «Эгея» на боевом хостинге

Завёл собственный домен на Timeweb и решил по такому случаю испытать блоговый движок «Эгея». Знакомство с данным творением произошло случайно, когда искал способ настройки на виндовой машине типографской раскладки как на маке или линуксе. Поиски привели на сайт с типографской раскладкой Ильи Бирмана. Там была ссылка на «Эгея». Почитал, вдохновился. Подкупил минимализм и интелектуальный подход к форматированию. Только представьте, знаки дюйма и дефис в режиме редактирования автоматически превращаются в кавычки-ёлочки и длинное тире при публикации. Шикарно. Далее я расскажу пошагово как запускал Эгею.

Выбор хостинга

Первое, что меня интересовало — рейтинги популярных хостинг-площадок. Как я и ожидал результаты сравнения от разных исследователей/агенств сильно отличались. Нужно было отфильтровать. Сравнил 10 первых рейтингов из поисковой выдачи и попытался установить, какие название чаще всего повторяются на топовых позициях с 1-ого по 5-е место. Чаще всего мелькали названия: Timeweb, Sprinthost, Beget, Jino и Макхост. Раньше я пользовался Majordomo, от которого недавно получил приглашение вернуться. Majordomo заманивал подарком в 200 бонусных рублей. Majordomo стал дополнительным кандидатом. Итак, я получил выборку из 6 хостинг-провайдеров. Кому отдать предпочтение? Я сформировал критерии, по которым буду осуществлять дальнейший отбор.

критерии отбора:

  1. гармоничный визуальный облик сайта;
  2. информативность раздела, описывающего тарифы;
  3. удобство интерфейса панели администрирования / личного кабинета;
  4. ценовая политика;
  5. технические возможности: объём места на SSD разделе, FTP/SSH доступ, SSL-сертификат;
  6. бесплатная регистрация домена;
  7. наличие тестового периода;
  8. возможность быстро и без проблем залить сайт на хостинг.

отбор по критериям

По первым двум позициям в списке Bedget и Макхост сразу отвалились. Jino отпал на 3-ем пункте. Sprinthost и Majordomо не прошли тест, описанный в последнем пункте. Timeweb остался победителем. Кроме того мне его советовала супруга. Когда-то она хостила свой сайт именно там. Timeweb оказался золотой серединой между функциональностью, ценой и дружественностью к пользователю.

выводы

Услуга хостинга на год обошлась мне в 1188 руб. Это — 99 руб. в месяц. Тариф — «Year+». Потом я добавил дополнительно услугу — ещё один сайт (+50 руб./мес.), так как тарифом был предусмотрен только один. Зачем мне второй сайт? Дело в том, что изначально мне нужен был хостинг под собственный сайт-портфолио, а блог возник как расширение первоначальной задумки. Тем не менее под блог нужна была отдельная директория и поддомен, так как сайт-портфолио и блог будут технологически разделены. Блог будет работать на блоговом движке, а портфолио я буду собирать в адобовском редакторе сайтов Muse.

Установка Эгеи

Эгеевский промо-сайт хвастается минутной установкой. Действительно установка занимает считанные секунды если знать, что делать. Я разобрался, но столкнулся с трудностями.

трудности вызвало следующее:

  1. Заливка содержимого архива с блоговым движком в раздел (public-html) на хостинге оказалась не совсем тривиальной операцией. Timeweb предоставляет для этого вполне удобный интерфейс. А именно, из панели администрирования доступна веб-версия файлового менеджера, отображающего содержимое директорий на сервере. Методом Drag and Drop можно перетащить нужные файлы и они окажутся на сервере. Но если таким способом залить директорию, содержащую поддиректории, то алгоритм убьёт структуру каталогов и разместит все файлы в одном месте. Со второй попытки до меня дошло, что заливать нужно архив, а алгоритм сам все разархивирует, сохранив структуру каталогов.
  2. Ок. Залил движок. Перехожу по адресу, с которым связана директория и попадаю в панель установки «Эгея». Первое поле «Сервер» заполнено — localhost. Это то же самое, что и — 127.0.0.1 . Данное поле трогать не нужно. В справке Timeweb написано почему.
  3. Далее три поля «Имя пользователя и пароль» и «Название базы» долго морочили мне голову. С полем «Название базы» всё понятно. Вбиваем туда название созданной базы данных и всё. Ах да, нужно предварительно в панели администрирования хостинга создать пустую базу. Для Timeweb это выглядит так. Значение поля «Имя пользователя» должно совпадать с названием базы данных. Ну, вообще не очевидно! С полем «Пароль» тоже всё ясно, вводим туда пароль, сгенерированный при создании базы данных. Кстати два поля объединены одним названием — «Имя пользователя и пароль». Странное решение.

выводы

Я бы посоветовал Илье Бирману обратить внимание на вышеописанные недочёты. Их можно исправить через подсказки в интерфейсе. Если оценивать общее впечатление от продукта, то я доволен его возможностями, хотя форматирование конечно хардкорное. Буду дальше пользоваться.

2018   делаю