Дизайн и юзабилити

Отличная презентация Richard Rutter — Golden Rules of Typography on the Web. Рекомендую ознакомиться. Если кто-то найдёт текст или видео — поделитесь, плиз, в комментариях.

Краткое содержание:

Полтора года назад писал о представлении таблиц и диаграмм. По-прежнему считаю, что ту гифку сложно превзойти (по соотношению объём/полезность).

Прочитал ещё одну статью по теме — более длинную, зато с парой свежих советов.

Вас бесят запросы о подписке на сайтах? Меня бесят. Неважно — это про пуш-уведомления или о добавлении в список рассылки. Сегодня про то, как самим такое не делать.

В чём основная проблема? На многих сайтах запрос на подписку открывается до того, как ты успеваешь хоть что-то сделать. Как исправить? Очевидно, предлагать подписку после совершения какого-то действия. Чтобы была понятна польза от неё. Вот пользователь оформил заказ. Почему бы не предложить ему подписаться на уведомление о доставке или смене статуса?

Больше года назад, я рекомендовал почитать статью Design Better Forms (Common mistakes designers make and how to fix them). От своих слов я не отказываюсь и по-прежнему рекомендую :) Заодно, добавлю ещё пару статей, которые особенно полезны для тех, кого заботит вопрос правильного использования меток.

Почему я выделяю метки? Знаете, у меня есть мечта… что в приложениях, в разработке которых я буду участвовать, инпуты будут расположены одним столбцом а метки — сверху. Максимум — внутри и всплывают наверх. За исключением, может быть, “сурового ынтырпрайза”, хотя и в этом случае что-нибудь можно придумать…

В прошлом месяце я писал про слишком минималистичный интерфейс, а недавно увидел статью Better Form Design: One Thing Per Page (Case Study).

Cтатья про упрощение интерфейса. Причём для всех — и для пользователей и для разработчиков. Идея не новая, но рассказана очень грамотно. Вот что мне понравилось:

• Всё хорошо структурировано и иллюстрировано удачными примерами.
• Там нет призывов “измельчить формы до предела” :)

Сегодня хочу поделиться ссылкой на презентацию SVG can do THAT?!

Красиво сделано. Познавательно.

Ещё у меня накопилось несколько ссылок на статьи про SVG. Возможно, кого-то заинтересует.

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

Думаю, большинство из вас в курсе, что такое Smashing Magazine. Если нет — почитайте там статьи, получите удовольствие.

Мне лично они нравятся. Недавно они затеяли редизайн сайта. И, что вдвойне приятно, наряду с редизайном они перешли с глючного решета WordPress на Hugo. Чуть больше подробностей далее.

Ant Design — это альтернатива Material Design. Что лучше, что хуже — решать вам, я лишь делюсь информацией.

Вы наверняка слышали про Material UI — библиотеку, которая реализует принципы Material Design для React. Аналогично, есть реализация Ant Design — Ant Design of React. Подробно не смотрел, но выглядит красиво. Далее несколько восторженных отзывов про табличное представление.

У меня накопилось много интересных ссылок, подробно описывать каждую утомительно. Поэтому, я просто оставлю это здесь.

Хочу поделиться подборкой статей про руководства по стилю (или как говорят наши зарубежные коллеги, style guides).

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

Что ж, начну с отечественных наработок.

Прошлые две недели прошли для меня под знаком статьи Clear off the table. Сначала увидел ссылку в комментарии к другой статье на хабре, потом ещё пара человек мне ссылку на перевод прислали.

Что характерно, поскольку сама статья и анимация достаточно грамотная, у многих возникает ощущение “круто! давайте всё так сделаем”. Не надо так :)

Собственно, о чём речь? Речь о том, что в идеале, пользователь должен быть избавлен от лишней информации и “визуального шума”. С этим я согласен более чем абсолютно. Только всё хорошо в меру. Что предлагают авторы?

Недавно прочитал статью Tips for Using Icons in Your App. Понравилась. Вроде всё по делу. Делюсь кратким содержанием.

Хочу поделиться подборкой хороших статей про особенности дизайна кнопок.

Сегодня расскажу о релизах из мира JavaScript и немного про новые веяния в типографике:

• Angular2;
• Node.js v6.6.0;
• WebStorm 2016.3 EAP;
• Variable fonts.

Сначала хотел сделать подборку статей по UX, но одна статья достойна отдельного поста. Это отличная статья Susan Weinschenk о том, как можно применить знания психолога к UX-проектированию.

Статья короткая и не даёт подробных рецептов. Зато она затрагивает многие моменты, которые не всегда очевидны для разработчиков. Разумеется, большинство из них очевидны для UX-проектировщиков и тех, кто вечерами перечитывает книги Алана Купера :)

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

Сегодня предлагаю вашему вниманию несколько наиболее полезных, на мой взгляд, недавних твитов Luke Wroblewski на тему Usability и UX. Если вы не в курсе о том, кто это, вы серьёзно? крайне рекомендую посмотреть, как минимум, эти твиты

Скажу сразу, спорить на тему границ UX и Usability считаю неблагодарным занятием, поэтому просто оставлю эти два термина вместе :)