Трекер курса «UX для desktop-продуктов»

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

Бесплатно · без регистрации

Ваш вариант для печати

Скачать PDF Распечатать

Откроется PDF. В окне печати выберите размер бумаги и масштаб 100%. Ссылки на шаблон и курс работают прямо в файле.

Заполнение онлайн появится позже.

Как пользоваться

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

Задания по дням

День 1
Возьмите один реальный desktop-экран, с которым работаете. 1. Запишите намерение человека на этом шаге одним предложением. 2. Сделайте скриншот и проведите тест прищура. Что видно первым? 3. Выберите один главный ответ или действие. Ослабьте два конкурирующих акцента. 4. Проверьте, что вторичные
Что получилось после урока «День 1. Визуальная иерархия» и что проверите при следующей попытке?

Советы для практики

Проверяйте действие, а не украшение

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

Оставьте исходник для сравнения

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

Не расширяйте упражнение до полного редизайна

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

Продолжите с курсом

Трекер связан с курсом «UX для desktop-продуктов»: используйте бумагу для отметок и заметок, а уроки — для объяснений и разбора задания. Количество шагов отражает доступные уроки, а не обещание будущей программы.

Открыть курс →

Вопросы и ответы

Почему в трекере только один урок?

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

Подойдёт ли экран чужого сайта?

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

Нужен ли специальный редактор макетов?

Нет. Важно обозначить главные и второстепенные элементы и объяснить проверяемое изменение. Для этого достаточно бумажного наброска, снимка экрана с пометками или знакомого редактора. Печатайте минималистичный вариант на своей бумаге A4 или Letter; выбор цветного оформления трекера не влияет на задание урока.