“Кружки лучше квадратиков?”

UX Курс: 19 из 30 глупых вопросов

←Предыдущий вопрос

(Вы читаете перевод нового ускоренного курса UX. На этот раз курс посвящен глупым вопросам (UX Crash Course: 30 Stupid Questions). Если вы здесь впервые, то лучше начните с первой главы).

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

“Кружки лучше квадратиков?”

Если вы проектируете интерфейс с целью набрать побольше лайков на Dribbble или Behance, делайте ставку на красоту, а не на решение проблемы.

Почему?

Потому что красота очевидна. А хорошее решение проблемы в глаза не бросается.

Дизайн красивее, если в нем много белого пространства, фотографий красивых людей и простых, ярких цветов. Старайтесь избегать мелких разрушительных деталей: таких как меню, тексты и формы.

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

Так что же, кружки лучше квадратиков в контексте UX?

Глупый ответ:

Конечно лучше! Иначе все бы до сих пор использовали квадратики.

Настоящий ответ:

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

Кружки концентрируют внимание пользователя на центре изображения, а не на его углах.

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

В общем, все эти кружочки делают интерфейс визуально менее “полным”.

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

Кроме того, квадратные изображения проще выравнивать с прямоугольными текстовыми блоками, что позволяет взгляду пользователя плавнее скользить вдоль вертикального “края” страницы. Итак, квадраты меньше отвлекают пользователя, а, значит, оставляют больше внимания контенту страницы — а это может быть важным фактором.

Вот почему этот вопрос совсем не глупый:

Красивые макеты в деле могут оказаться совершенно дерьмовыми.

Как дизайнер, вы должны остерегаться подбора “удобных примеров” во имя красоты макета.

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

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

В реальности появляются все остальные фотки: лицо под углом 45°, кот в карнавальном костюме, противный ребенок, парочка. У всех этих фоток словно специально обрезали углы! И если на фото вы на свадьбе где-то в поле держитесь за руки — половина ваших лиц отрезана. Уж извините.

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

Начните искать квадратные фотографии — и будете замечать и их. На Facebook, Twitter, LinkedIn и на других, столь же “неуспешных” сайтах.

Короче говоря, форма фотографий профиля — это скорее вопрос стиля, а не функциональности.

Предпочитайте результат красоте.

Неоднократно доказано, что пользователям больше нравятся красивые интерфейсы — до тех пор, пока люди не начинают их использовать. Если спросить человека “какой дизайн лучше?”, он скорее всего выберет тот, что красивее.

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

Измерять надо пользователей — только они дадут вам правдивую информацию.

Страшненькие дизайны очень часто побеждают красивые в ходе A/B-тестирования. Все эти функциональные детали (меню, формы, тексты), которые вы убираете, чтобы заработать лайки на Dribbble, просто необходимы пользователю, чтобы понять, что происходить, и принять верное решение.

Не советую оценивать качество UX сквозь призму красоты.

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

Самый лучший дизайн — тот, который и красивее, и удобнее в использовании.

Завтра мы ответим на вопрос: “Плоский дизайн лучше для UX?”

Если вам понравилась и статья, и перевод, дайте нам знать — нажмите кнопку Recommend.

Также мы будем благодарны за любые отзывы по поводу адекватности и понятности перевода этой книги. Нас можно найти в Facebook: Nancy Pong и Ринат Шайхутдинов.

Мобильное приложение «Заметки о психике» | Mental Notes

Подкидывает идеи как привлечь, удержать и направить внимание пользователя

Mental notes — это колода из 53 карточек с описанием психофизиологических моделей поведения людей, которые лежат в основе принципов веб-дизайна. Они помогают дизайнерам, проектировщикам лучше понять поведение пользователей и найти эффективные решения при создании дизайна интерфейсов.

Скачать приложение в Appstore

Видеокурсы и практика по дизайну интерактивных систем: ux/ui, веб-дизайн и бренд-дизайн

Вас ждет плотная проектная практика по анимации интерфейсов, дизайну сайтов, а также мобильных и веб-приложений. Под руководством наставников в стиле «смотри и повторяй»!

Breezzly — это среда для тренировки digital-навыков. Здесь вы встретите комплекты видеокурсов в актуальных инструментах интерактивного дизайна, среди них Figma, Principle и Invision Studio. А каждый проект — это живой кейс с историей, собранной по горячим следам!

Посмотреть каталог курсов →

--

--