В этом выпуске: о поиске клиентов на фрилансе, поиске работы проектировщиком в Барселоне, перетаскивании элементов, обратной связи при наведении курсора на кнопки, использовании сторифреймов.
Анонсы одной строкой
Егор записал 14-минутное видео с рассуждениями о том, как искать клиентов, если вы только вышли на фриланс. Нужно ли их действительно искать или лучше сосредоточиться на том, чтобы заявлять о себе среди тех, кто сам вас ищет?
Инструкция к шпаргалке по составлению функциональных требований (видео на 13 минут) и сама шпаргалка.
Перетаскивание элементов
Грейс Но написала о перетаскивании (Drag and Drop) на примере интерфейсов VMware.
Где используется:
- Изменение порядка и уровня вложенности элементов дерева;
- Изменение порядка колонок в таблице данных;
- Изменение порядка рядов в таблице данных;
- Перемещение элементов между древовидным меню и таблицей данных;
- Упорядочивание и объединение карточек.
Если элемент можно перетаскивать, надо проработать:
- Состояние покоя;
- Состояние перетаскивания;
- Обозначение исходного местоположения элемента — где он был до начала перетаскивания и куда вернётся, если пользователь не найдёт для него подходящее место приземления;
- Обозначение места приземления — новое место, в котором элемент окажется после завершения перетаскивания.
В состоянии покоя:
- Специальным маркером обозначить возможность перетаскивания. Особенно важно так делать, если не все элементы можно перетащить;
- При наведении на элемент менять курсор, например, на руку.
В состоянии перетаскивания:
- Стилистически выделять элемент. Например, с помощью тени приподнимать его над соседними. В Трелло перетаскиваемые карточки слегка наклоняются;
- Менять курсор, например, на сжатую руку.
Исходное местоположение можно показывать полупрозрачным экземпляром перетаскиваемого элемента. Его может не быть, если создаётся эффект естественного движения, когда все элементы вокруг сдвигаются и уступают место перетаскиваемому (пример — упорядочивание вкладок в Хроме или Сафари).
Место приземления можно показывать жирной линией с кружком. Если место приземления недоступно, можно менять курсор, например, на запрещающий знак.
Важно придерживаться одних паттернов перетаскивания в рамках единого интерфейса. Антипример: Salesforce использует 3 разных маркера для обозначения возможности перетаскивания.
Поиск работы UX-дизайнером в Барселоне
Ольга Шаврина написала о поисках работы UX-дизайнером в Барселоне.
В 1-й части статьи: список сайтов для поиска работы, возможные названия должностей, рекомендации по составлению резюме и прокачке профиля в LinkedIn, а также интересные наблюдения и выводы:
- Описание вакансии на испанском не означает, что компания не рассматривает англоговорящих соискателей. Возможно, просто затупил HR-специалист. Не игнорируйте такие вакансии;
- Чем компания привлекательней, тем меньше в тексте вакансии диких требований и больше собственных ценностей и видения;
- На указанный уровень специалиста можно не смотреть. На наличие или отсутствие в названии слов Senior или Lead — тоже;
- На фото в Линкедине принято улыбаться;
- Список навыков очень важен. В Линкедине есть статистика ключевых навыков для разных должностей, можно подсмотреть и добавить себе;
- Чаще всего небольшие компании и стартапы не помогают с визой. Если у вас есть право на пребывание и работу в стране, много раз напишите об этом;
- Креативное анимированное портфолио с нестандартной сеткой — ад для HRов. Для UI-дизайнера лучше всего Dribbble или Behance. Если улучшил важные бизнес-показатели, надо вынести это в заголовок;
- Не ждите, что найдёте вакансию мечты, отправите резюме, и вас пригласят работать. Поиск работы — воронка. Ваши отклики — лишь её 1-й уровень. Откликайтесь на все вакансии, которые удовлетворяют вашим критериям.
(Самая популярная ссылка в этой подборке, если судить по количеству лайков в ВК.)
Комментарий с Фейсбука: «Полезность этой статьи равна 100%, пересмотрела своё портфолио и профиль в LinkedIn, переделала».
Курсор и обратная связь
Илья Бирман написал, надо ли на сайтах менять курсор мыши на палец над кнопками. Одна из тех заметок, где в конце нет правильного ответа или инструкции, как надо делать.
Если навести курсор на текстовую ссылку, он меняется на палец. Это пример обратной связи в интерфейсе — изменение курсора подсказывает, что на элемент можно нажать.
Интерфейс должен быть последовательным. Если на текстовые ссылки и кнопки можно нажать, менять курсор на палец стоит и там, и там. Но тогда поведение курсора на сайтах и в программах будет отличаться — в программах он не меняется при наведении на кнопки. Это тоже непоследовательно (в более широком контексте) и непривычно пользователям.
В программах кнопки раньше были объёмными. Дополнительная подсказка с помощью курсора не требовалась. А ещё: если поведение курсора в программах изменить, то не получится спокойно провести курсором над каким-нибудь тулбаром — курсор будет постоянно меняться туда-сюда.
Сторифрейм
Фабрицио Тейшейра написал о сторифреймах — небольших рассказах о продукте, которые стоит написать до создания первого вайрфрейма.
Даже если вы мастерски владеете инструментом и работаете на низком уровне детализации, часть мозгового ресурса (и времени) всё равно уходит на подбор форм. Гораздо проще и эффективнее сначала зафиксировать, что вы пытаетесь сказать пользователю. Проектирование в инструменте или на бумаге подразумевает принятие дизайнерских решений (2 колонки или 3?), хотя на начальном этапе вы ещё не уверены, нужен ли вообще этот блок и где его место.
Вся прелесть (и, вообще-то говоря, цель) написания истории в том, её можно показать людям и собрать их мнения и советы. Можно принимать важные решения по стратегии, процессам и повествованию — и для этого не надо часами копаться в визуальных редакторах.