Usability *

Функция определяет форму

Удивительно, но сто лет назад дизайнеры были интереснее, смелее и прогрессивнее современных.

Какую программу вы обычно запускаете сразу после загрузки операционной системы? Кто-то сразу стартует браузер — поглядеть, кто там сегодня в Интернете (на Хабре) неправ. У многих — это редактор кода: «Я, как утром встал, сразу за дрель!». Возможно, вы сначала привычно открываете мессенджеры и почту — проверить, что там нового и важного.

Я обычно сразу после запуска операционки открываю свой Любимый Файловый Менеджер. Это «переходящее звание» — в разные периоды моего компьютерного прошлого этой чести «удостаивались» разные приложения с классическим двухпанельным интерфейсом. Сначала это был простой, но универсальный Norton Commander. Потом появился DOS Navigator со всяческими классными фичами: CD-плеер, телефонная книга с дозвоном по модему, встроенный табличный редактор и прочие прекрасные и поразительные для тех лет вещи.

Когда Windows прочно вытеснил DOS и все понемногу забыли про файл autoexec.bat, звание моего любимого файлового менеджера плавно перешло к Total Commander. Он продержался довольно долго, но в какой-то момент в мою жизнь буквально ворвался FAR...

Привет, Хабр! Мы приготовили для вас долгожданный подарок (из заголовка вы уже поняли, какой), но мы вам его просто так, как говорится, не отдадим 😃

Например, прототип формы, поля которой можно заполнять непоследовательно.

Иногда сценарии и механики перехода между экранами (или состояниями одного экрана) получаются такими сложными, что для подготовки прототипа и тестирования на респондентах приходится переносить макеты из Фигмы в специальные инструменты вроде ProtoPie или Axure.

Летом 2023 года в Фигме появились условия и переменные, благодаря которым можно показывать всё более сложные взаимодействия. А также меньшими усилиями добиваться того, что раньше требовало усилий значимых, например, давать респондентам возможность заполнить поля формы в произвольном порядке.

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

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

При помощи api2app можно быстро создать графический интерфейс для API. Его можно использовать для тестирования или демонстрации работы вашего API. Созданным приложением можно поделиться со всеми желающими или использовать по приватной ссылке.

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

Оптимальное решение в такой ситуации — создание и поддержка единой базы данных. Ниже на примере отдельного продукта мы пошагово расскажем, как её спроектировать.

Здравствуйте, меня зовут Дмитрий Карловский, и я.. буквально только что написал эту статью. Ну, на самом деле вчера. А если точнее, то в этом году. Удачи вам понять когда же именно.

Далее вашему вниманию представлен чуть более подробный, но всё же бесчеловечный анализ этого вопроса..

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

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

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

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

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

Полосы прокрутки. Слышали когда-нибудь о них? Довольно крутая штука. Достаточно зажать и перетаскивать полосу прокрутки, чтобы перемещаться по контенту панели со скроллингом. Я это просто обожаю. Ежедневно целыми днями сижу за компьютером и тягаю полосу прокрутки. Но полосы прокрутки становятся мельче, и это оказывается всё более серьёзной проблемой. В статье я покажу скриншоты, но они настолько малы, что даже делать их было сложно. А разработчики продолжают делать их всё мельче, как будто не хотят, чтобы вы скроллили! Они говорят: «для этого ведь колесо прокрутки и существует». Друг мой, не у каждого есть колесо прокрутки и не каждый может свайпать по сенсорному экрану. И даже я, счастливый обладатель колеса прокрутки, хотел бы перемещаться по контенту быстро.

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

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

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

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

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

На днях Apple выпустила очередную версию macOS. Но когда на презентации этой версии холёные топ-менеджеры наперебой говорили «amazing», я смотрел на анонсированные фичи и вместо «amazing» ощущал «ну блин, зачем». В macOS позволили добавлять виджеты прямо на рабочий стол, и из-за подобных вещей ощущаю, что компания постепенно захламляет свой продукт и предаёт свою собственную идеологию минимализма.

Новые фичи могут делать продукт не только лучше, но и хуже. Кто постарше — помните, как приложение NERO Burning ROM превратилось в монстра с тысячей щупалец? Ты хочешь просто записать CD-R, а ощущаешь, словно безумный комбайн поглощает всю твою жизнь. Или вот функции редактирования видео в Photoshop — это правда нужно? Может, Photoshop и без них достаточно сложная штука, а видео лучше оставить другим приложениям? А сториз в Телеграме точно делают всем только лучше, или кому-то они замусорят инструмент рабочей коммуникации? Почему мы не умеем вовремя останавливаться?

И в случае с macOS мне особенно обидно. Ведь Apple — это компания с подходом «мы не предустанавливаем на ноутбуки стороннюю дребедень за копеечку, как делают другие». С подходом «мы не обклеиваем ноутбуки рекламными наклеечками вроде Intel Inside». С подходом «ничего лишнего». А теперь она сама превращает собственную ОС в пёстрое лоскутное одеяло (не только виджетами).

Что происходит, кто виноват и что делать? Я далеко не первый, кто об этом говорит, так что вряд ли скажу что-то принципиально новое. Но думаю, чтобы такого было поменьше, эту тему нужно поднимать регулярно, напоминая о ней.

Когда я рассказываю о своих исследованиях редактирования текста на мобильных в Google, то обычно сталкиваюсь с непониманием и немного враждебным «Разве на телефонах нельзя редактировать тексты? В чём проблема?»

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

Недавно мы с моим другом оплакивали странную смерть OKCupid. Семь лет назад, когда я впервые попробовал онлайн-знакомства, он работал следующим образом: нужно было написать длинный рассказ о себе и о том, что ты ищешь. Ты отвечал на сотни вопросов о своей личности, мечтах, о том, что хочешь увидеть в партнёре, о том, что для тебя недопустимо. Затем тебе показывали самых совместимых с тобой пользователей с «показателем соответствия» от 0 до 100%. Эти показатели работали пугающе хорошо. Почти каждый раз, когда я читал профиль пользователя с показателем соответствия 95% или выше, я как будто немного влюблялся. Каждое свидание было интересным; «химия» возникала не всегда, но мне казалось, что мы, по крайней мере, можем стать отличными друзьями.

Сегодня я достаточно скептически отношусь к количественным оценкам романтики и к идее о том, что схожесть обеспечивает хорошие отношения. Да и в то время я был довольно скептичен. Чего я не ожидал, так это того, что OKCupid образца 2016 года окажется лучшим, на что будут способны сервисы онлайн-знакомств. Что инструменты, при помощи которых люди будут пытаться искать самые важные отношения в своей жизни, будут становиться всё хуже, и хуже, и хуже. OKCupid, как и другие проекты, купленные Match.com, сегодня стал просто ещё одним клоном Tinder — видишь лицо, свайпаешь влево, видишь лицо, свайпаешь вправо. Цифровой ночной клуб. А я не хочу искать себе жену в ночном клубе.

И это касается не только приложений для знакомств. Почти все популярные потребительские приложения двигаются в сторону минимального участия пользователя, лент с бесконечным скроллингом и мусорного контента. Даже самое драгоценное в Интернете, поиск в Google, настолько испортился, что его нельзя использовать для сложных запросов. Reddit и Craigslist остаются невероятно полезными и ценными именно потому, что их ПО замерло в своём развитии. Как старые викторианские дома в Сан-Франциско, они стоят, защищённые причудами судьбы от ветров капитала, напоминая нам о более гуманной эпохе.

Всем привет! Меня зовут Кира Калимулина, я руководитель группы UX-редактуры в Ozon. Я занимаюсь всеми интерфейсными текстами в приложении и на сайте. 

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

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

Эту статью Ника Коленды я перевёл ещё в конце 2016 года. И не просто перевёл, а ещё и сопроводил комментариями от лица бренда, под которым проектирую интерфейсы все эти годы.

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

Свои старые комментарии я немного освежил и оформил в виде цитат.

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