Повторим основы, совсем немного.

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

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

Оптимизируйте информационную эффективность. Часто существует возможность уместить больше информации на меньшей площади. Главное не перестараться.

Я на этой странице ошибся два раза.

В первый раз я подумал, что счетчик лайков является и кнопкой «Лайк» потому что существует ментальная модель социокнопки, привычная всем.

Потом я два раза нажал на кнопку «Мне нравится» потому что после первого нажатия ничего не произошло. Как выяснилось, счетчик обновляется только при перезагрузке страницы.

Ну и сам факт разделения кнопки-счетчика на кнопку и счетчик. Два элемента вместо одного. Я не сразу нашел саму кнопку потому что она ещё и стоит в другой строке элементов. Как будто они не имеют отношения друг к другу.

В качестве упражнения переверстал страницу. Есть такой сайт — no comments shop, в нём есть раздел Блоги. Недавно там написали про фотопроект моего друга. Зашел почитать и понял, что приходится преодолевать сопротивление при чтении текста.

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

Было

Стало

Разумеется, в моем прототипе реагирует на наведение всё, что должно реагировать.