Вадим Митякин написал о проектировщике в рамках продюсерского подхода к созданию цифровых продуктов

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

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

Нет универсального навыка проектировать любые системы на любых технологиях для любых отраслей. За проектировщиком стоят:
— Реальный опыт создания систем, когда у него была возможность проверить разные гипотезы и узнать, как может вести себя система в реальной рабочей среде;
— Системный подход — поиск и своеобразные вычисления, за которыми стоят и прототипирование и способность смотреть на задачу с разных точек зрения.

Проектировщик — человек, имеющий привычку принимать решения. И имеющий достаточно смелости для этого.

Как состояться в профессии:
1. Насмотренность — знакомство с разными областями знаний;
2. Исследования — освоение выбранной области знаний;
3. Мастерство — использование своих знаний и создание новых областей знаний.

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

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

Недожали

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Специальные организмы

Специальные организмы

Год назад мы перестроили процесс работы команды с китом в Figma и перестали проебываться с правками по десяткам экранов разом.

Для этого в общей теории атомарности мы вели специальные организмы.

Они отвечают за конкретный текст внутри сценария и позволяют быстро править тексты и иконки внутри этих сценариев. Например, требуются правки в сценарий входа — заменить с Подтвердить на Войти.

В нашей дизайнерской вселенной живут пять сущностей, две из них — наша находка.

1. Атомы
Базовые элементы-одноклеточные. Отвечают за стиль и используются много раз. Атомом бывает фигура или иконка.

2. Молекулы
Сумма атомов, основа дизайна: это целостный элемент, например кнопка, инпут, меню или тапбар. Отвечает за разметку (расстояния).

3. Организмы
Это состояния молекулы, которые передают цвет и отображение атомов. Например, состояния кнопки: при наведении или при нажатии.

4. Специальные организмы
Отвечают за текст и иконки и конкретный текст внутри сценария.

5. Общие организмы
Это специальные организмы, которые используются в неизменном виде в нескольких сценариях.

Три правила организации процесса дизайна

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

Эдвард Скотт написал о сравнении товаров в интернет-магазине.

Прежде, чем добавить эту функцию:

1. Проверьте, что у вас есть данные о параметрах товаров и что они структурированы, то есть, например, размеры не указаны то в сантиметрах, то в миллиметрах.

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

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

Если вы уже добавили:

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

2. При наведении курсора на контрол «Сравнить» показывайте подсказку с кратким пояснением: что это за инструмент и как он работает. Так его не примут за функцию сравнения цен с другими магазинами.

3. Дайте легко перейти к сравнению выбранных товаров. Например, отобразите панель с кнопкой «Сравнить выбранные товары» и миниатюрами этих товаров, прикреплённую к нижней или верхней границе окна браузера.

https://ux.pub/ux-rekomendatsii-po-uluchsheniyu-instrumenta-sravnenie-tovarov/

Решительность и находчивость

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

Сегодня про решительность.

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

Получается, что решительный человек в состоянии самостоятельно принимать решения, реализовывать их и нести за них ответственность.
Боязнь принять ответственность за решение может снижать скорость, с которой двигается продукт или проект вперёд. Отсутствие решительности выглядит примерно так:

👎 Я проверил, но ты тоже посмотри, чтобы наверняка.

👎 Никто не говорил, что так можно делать.

👎 Я сделаю, но под твою ответственность.

👎 Я написал в поддержку, если не ответят за два дня, тогда позвоню.

👎 Обычно это делает Володя, поэтому я и не стал делать.

👎 Давайте соберёмся и обсудим.
...

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

Задача лидеров направлять нерешительных коллег в решительное русло, выгонять их из зоны комфорта: сам проверь и подведи итог; а сам как думаешь?; позвони сразу в поддержку; Володи нет — сам сделай; не надо собираться — сам реши. Лидер должен решительно бороться с нерешительностью.

Я какое-то время писал статьи и публиковал их только в личный блог. Понятно, что мало прочтений (почти ноль), мотивация писать новое близка к нулю. Я не знал хорошо ли пишу или нет, но я знал, что есть только один способ это узнать — опубликовать статью в тематическом паблике. И вот в конце 2018 года я написал статью про способы onboarding пользователей и решился пригласить коллег из отрасли её почитать — запостил ссылку в UX club на Facebook.

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

Прокачивали свою решительность и многие известные (теперь уже известные) люди. Например, знаменитый физик Лев Ландау был очень стеснительным. Но решил бороться с этим: в юном возрасте он привязывал к своей шляпе воздушный шарик и гулял так по Невскому проспекту в Ленинграде. Это было в начале 20-го века. Возможно, не решись он на такую прокачку он бы и не стал учёным, который мог сформулировать и реализовать самые смелые идеи.

В общем, решайтесь на расширение зоны комфорта не с понедельника, а сейчас. Если не попробовать, то и не получится.

Решительность хороша в связке с находчивостью, но об этом в следующий раз.