Мои заметки3 мин чтения

Удобство начинается со следующего шага

В работе над MaxBook я отдельно попросил показывать в ноутбуке или телефоне сам сайт, а в просмотре документа - страницы PDF. Описание проекта можно прочитать рядом. Но если я пришёл посмотреть работу, мне нужно до неё добраться. Вроде бы небольшое уточнение к портфолио, а для меня в нём собралось многое из того, что я понимаю под удобством

Кнопка с указателем, круг подтверждения и панель следующего шага соединены последовательными стрелками
После действия понятен следующий шагМоя иллюстрация для MaxBook.pro, подготовлена с помощью ИИ

Сначала показать предмет

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

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

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

У кнопки есть продолжение

Другой пример оказался ещё приземлённее: окно с согласием на использование файлов cookie. Мне понадобилось, чтобы на сайте можно было нажать на принятие и закрыть это окно. Здесь не помогает аккуратный цвет кнопки, если после нажатия остаётся ошибка или окно продолжает перекрывать материал

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

Название должно помогать действию

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

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

Посмотреть на готовой странице

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

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