Недожали

Сегодня речь пойдет о таинственной формулировке «недожали» или особенности преподавания UI.

Как вы помните, UI не самая моя сильная черта (https://t.me/bukhtiyar/161), поэтому я поделюсь взглядом человека, которому нужен был спасательный круг в этой новой сфере. И судя по отзывам, многие, из пришедших в британку, также ждали прокачки своих скиллов в визуале. Но были ребята и с богатым опытом в полиграфии и иллюстрации — им, безусловно, было легче. Но ни я, ни многие другие не получили должного внимания со стороны преподавателей. Давайте попробуем разобраться почему.

Что вообще нужно для того, чтобы научиться делать красивый UI (ну, кроме таланта, конечно)? Необходимо пройти через большое количество проб и ошибок, т.е. чем больше повторений сделано — тем более качественный результат.

На практике получалась следующая история — количество преподавателей ограничено, количество присылаемых макетов огромно, в итоге объем обратной связи минимален.
В такой ситуации больше комментариев получал тот, кто присылал макеты первым и регулярно, то есть наиболее опытные и прокаченные ребята. Таким же как я оставалось надеяться на внезапное озарение. Иными словами, преподавателям было о чем поговорить с прокачанными в UI ребятами, отстающим же нужно было уделять гораздо больше времени, которого не было.

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

Недожали — это универсальный ответ, который я слышал практически на все действия по UI. Обычно это означало, что можно было сделать лучше. Причем, как именно лучше, было не совсем ясно. Все валится, ничего не выходит, не знаешь что делать дальше — ты просто «недожал».

Но однажды я все же получил небольшое пояснение этого термина. Одним вечером, после занятий я решил спросить, Сергея, что же делать когда ничего не получается? Он поделился своим опытом — когда ничего не получается можно начать решать проблемы постепенно, брать какую-то одну небольшую часть проекта, например, контролл и доводить его до совершенства. То есть фокусируешься на одном моменте, не отвлекаясь ни на что больше. И… постепенно «дожимаешь» весь проект.

Напомню, что мы работали в командах по 2-3 человека, и работа над UI выглядела следующим образом: каждый из студентов делал заход на визуал проекта, составлял мудборд и на основе его рисовал несколько экранов. В итоге, в каждой команде отбиралась самая проработанная концепция. На её основе составлялся UI-Kit, который затем раскатывался на всё приложение с дальнейшей шлифовкой.

На зачете по блоку UI наша команда предоставила три одинаково плохие концепции, и Женя Бондарев посоветовал смешать несколько идей из каждой концепции. На этом его активное участие в обучении закончилось. А мы остались один на один с очень сырым UI, и тут же стали его переделывать. Про мои страдания вы можете почитать в прошлом посте, скажу лишь, что все майские праздники я потратил на погружение в особенности работы над UI. Это время не прошло зря, я открыл для себя много нового и из зачаточных мои навыки стали чуть более крепкими.

Что же по обратной связи — то блок, который вел Женя закончился, и чтобы получать хоть какую-то обратную связь я стал донимать Сергея Гальцева, на что однажды получил комментарий, что он уже не отвечает за блок UI, т.к. со второго семестра является куратором курса. Исторически он вел блок UI, в первом семестре так и было. Но во втором семестре блок UI вел Женя Бондарев, при этом Сергей также продолжал комментировать макеты и принимать активное участие. Но четкого понимания, кто рулит процессом и несет ответственность не было. Я уже молчу про ситуации, когда комментарии разных преподавателей по одному макету противоречили друг другу.

Какое-то время мы варились сами в себе, пока не поняли, что все это зашло слишком далеко и нужно спасать положение. Тогда я забил тревогу, после чего мы с командой активизировались, а преподаватели собрались в общем с нами чате и пытались помочь.

Нашей команде нужно было понять куда будет двигаться наш UI. Решили начать все с самого начала, откатились до мудборда и ключевых слов, чтобы таким образом синхронизироваться и начать грести в одном направлении.

По итогу мы нашли общее видение направления, и оно звучало следующим образом:
«Чистый интерфейс с понятной типографикой, умеренный и местами незаметный, но со своим стилем и продуманной навигацией. Он не должен быть грубым и непонятным, не должен напоминать голый ios, не детский, не захламленный, не космический».

После чего каждый из нас сделал заход на поиск референсов по ключевым словам, которые мы согласовали. В итоге что-то стало выкристаллизовываться — на наших референсах появились повторяющиеся элементы. Мы стали отбирать повторяющиеся визуальные ходы, строить на их основе принципы построения сетки, типографики, цветов, чтобы на основе этого стали собирать первые экраны.

Но практически до самой защиты я был недоволен результатом и постоянно переделывал экраны так или иначе.

Минутка рекомендаций книг

Минутка рекомендаций книг о человеке, для неторопливого чтения в самоизоляции и для творческого осмысления потребностей современного общества в период перемен внешних условий.

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

Леви-Стросс. «Структурная антропология»
Пиаже. «Психология интеллекта»
Тейяр де Шарден. «Феномен человека»
Вебер. «Протестантская этика и дух капитализма»
Веблен. «Теория праздного класса»
Фрейд. «По ту сторону принципа удовольствия»
Ортега-и-Гассет. «Восстание масс»
Лебон. «Психология народов и масс»
Фромм. «Бегство от свободы»
Фромм. «Анатомия человеческой деструктивности»

HTML-разметка — это просто текст, который делит страницу на смысловые (и не очень) блоки

Когда браузер получает HTML-документ, он на его основе создаёт древовидную структуру блоков, вложенных друг в друга. Каждый объект при этом называется узлом.

Потом к узлам применяются CSS-стили и получается та страница, которую мы видим в браузере.

К любому из узлов можно обратиться через JS как к объекту, чтобы узнать и изменить их свойства или содержимое, создать новые узлы или удалить старые. Структура этих объектов и называется DOM — Document Object Model. Она нужна для того, чтобы вы могли динамически менять содержимое документа после его загрузки в браузер.

Подробнее в видео: https://youtu.be/TKxR2tNxTcA
И в примере с кодом: https://codepen.io/detepr/pres/mQqKZO

По умолчанию

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

Почему это работает?
Так уж вышло, что наш мозг по своей природе очень ленивый. Каждый раз сталкиваясь с выбором, он напрягается. Для минимизации усилий он более склонен к выбору по умолчанию.

Пример
Если вы делаете сайт благотворительного фонда, поставьте на главной странице форму пожертвования с 50-100 рублями по умолчанию: пользователь все еще сможет ввести любую сумму, но процент людей, пожертвоваших сумму по умолчанию, значительно вырастет.

Наше отношение к этому эффекту таково, что пользователей нельзя заставлять делать то, что вам нужно. Примите факт, что они свободны в выборе. Но можно помогать пользователю с выбором более полезных и правильных вещей.

Синхронизация с заказчиком

И вот мы провели ряд исследований — и что же это значит? Как передать свои идеи заказчику? Как синхронизироваться?

Есть три отличных метода, как на ранних стадиях показать заказчику то, что его ждет на выходе (ну а нашем случае самим понять куда мы движемся)

Вот эти три метода:
-пресс релиз
-идеальный день пользователя
-design challenge

Пресс-релиз
Это описание вашего продукта/редизайна, которое вы могли бы дать профильным СМИ, или приложить в качестве описания для магазина приложений. Пресс-релиз — это взгляд на текущую работу из будущего, как будто работа уже завершена и вы готовитесь к релизу.

Хочу только отметить, что тот пресс-релиз который я привел ниже — отражение нашего видения проекта на начальном этапе — в начале марта. Тогда мы еще не сузили фокус до одних только специалистов, и думали решать проблему всех пользователей сразу.

Итак, пресс-релиз:
«Профи.ру провели масштабный редизайн. Встречайте новое поколение сервиса по поиску услуг.
Взаимодействие между заказчиком и специалистом вышло на новый уровень — удалось построить систему без использования модератора.
Поиск специалиста стал умным — теперь вам не нужно ждать обработки запроса. Система, основанная на нейросети, сама подберет специалиста по заданным параметрам в считанные минуты.
Изменения затронули и работу специалистов — теперь найти работу соответствующую вашим навыкам стало гораздо проще — после регистрации, уже в течении нескольких минут, вы получите доступ в систему и сможете найти свой первых заказ. Это стало возможным благодаря системе автоматизированной проверке документов.»

Вы можете заметить, что первая часть, посвященная клиентскому приложению, выглядит очень натянуто — какие-то нейросети, что-то там улучшают. Видно, что решение мы высасываем из пальца (потому что там не было явных проблем). Поэтому становится логично, что мы в итоге сконцентрировались только на проблемах специалистов.

Экскурсия в офис авито

На прошлой неделе ходили в гости к авито, в отдел исследования. Экскурсию проводил Миша Правдин.
Наиболее интересные моменты:

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

Миша привёл в пример моменты из свой практики. Когда он работал в билайне, то всем сотрудникам полагалась льготная связь и довольно большая сумма на счёт в месяц. Этого хватало абсолютно всем, у людей никогда не возникало проблем с роумингом, в колл-центре они получали VIP поддержу без очереди и т.д. Когда руководство сменилось, они поняли, чем чревата такая политика и перевели сотрудников на реальные тарифы, чтобы они жили проблемами обычных людей.

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

____________

Сейчас авито на взлёте, но взлет этот такой же, как и у нокиа в своё время, и их персональный «айфон» уже на подходе — в виде sharing economy. То есть модели, построенной не на владении, чем либо, а на временном пользовании. Уже сейчас модель совместного потребления можно увидеть на примере Airbnb, городского каршеринга и велопроката. И когда подобные сервисы закроют большинство потребностей — авито станет не нужен.