Студия дизайна «Разумный подход» Владимира Соловьёва, podhod.ru

Большие отступы в интерфейсе Скайпа

Владимир Соловьёв, 26 декабря, 2016

В Skype 7.30 совершенно не используется место на экране. В программе для общения, на одном экране, при обычном сегодняшнем разрешении 1920×1200, умещается около 6–12 сообщений среднего размера и 18 контактов в столбике-списке. Это очень мало.

Причины, которые привели разработчиков Скайпа к такому виду, такие:

  • Огромные плашки и высокие строчки в списке контактов. Видимо, чтобы иметь достаточный размер для тач-интерфейса;
  • Огромные отступы по по бокам от сообщений. Видимо, чтобы ограничить ширину строки, для удобства чтения;
  • Желание обязательно показывать баннер в правой колонке. Видимо, чтобы извлекать прибыль.

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

Различимый зелёный для людей с проблемами восприятия цвета

Владимир Соловьёв, 5 декабря, 2016

В приложении Google Play зелёный цвет плашек, кнопок и иконок изменился с травяного на изумрудный. Такой сдвиг тона, в сторону синего цвета, помогает людям с дальтонизмом воспринимать цвет отчётливее.

Было:

Стало:

Макет сайта «в рамке» ноутбука

Владимир Соловьёв, 9 сентября, 2016

Некоторые дизайнеры, для демонстрации своей работы, вставляют созданные ими макеты сайтов в фотографию экрана монитора, ноутбука, планшета или телефона (обычно в технику Эппл).

Иногда это совмещается с искажением макета в перспективе, с уменьшением.

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

Причины, по которым дизайнер может решить показывать «макеты в рамке» могут быть такие:

  • Без рамки макет будет выглядеть не так эффектно, дизайнер пытается усилить слабое оформление;
  • Макет сам по себе недостаточно хорошо держит форму, и требуется поддержать композицию;
  • Недостаточная проработка, например, на макете не хватает приятных деталей;
  • Предъявить без подробностей. По каким-то причинам вы не должны увидеть настоящий макет целиком.

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

Разумеется, есть задачи когда использование мокапа, в виде рамки из устройства, оправдано:

  • Показать, что расположение важных элементов сайта продумано и они умещаются на «первом экране»;
  • Продемонстрировать, что у пользователя не возникнет сомнений в том, что на сайте есть скролл;
  • Дизайн подразумевает вёрстку «на весь экран», совсем без прокрутки или только с горизонтальной;
  • Макет показывает как сайт выглядит среди других, созданных в том же стиле, продуктов: других сайтов и приложений, фирменной и сувенирной продукции.

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

Листалки ← → 1 2 3 4 …

Владимир Соловьёв, 3 декабря, 2014

Пагинатор — неудобный элемент. Его придумали программисты, когда столкнулись с ситуацией, что всё, что есть в базе данных не стоит выводить на одной странице.

Пагинатор не помогает ориентироваться, а предлагает пользователю сыграть в рулетку. Если использовать пагинатор как основную навигацию, то получается монстр.

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

А так же, не используйте знаки сравнения < > и кавычки « », в качестве стрелок. В юникоде есть масса стрелочек для этого:  ← →, 〈 〉, ◄►, ◀▶, ◂▸, ◁▷, ◅▻, ◃▹.

Неудобное поведение фильтра товаров на Яндекс.Маркете

Владимир Соловьёв, 9 сентября, 2014

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

  • Не видно сразу какие есть опции в скрытом фильтре;
  • Не используется вся доступная ширина браузера;
  • Блок фильтров имеет свою независимую прокрутку. Надо контролировать где находится курсор мыши;
  • Свёрнутый фильтр достаточно узок. Приходится целится чтобы он показался;
  • Анимация заставляет ждать. В контролы свёрнутого фильтра нажимать бесполезно;
  • Логика скрытия и показа фильтра основана на области которую скролит пользователь. Нельзя одновременно просмотривать и список товаров и фильтр;
  • Развёрнутый фильтр закрывает цены в списке товаров;

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