“Кружки лучше квадратиков?”
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 карточек с описанием психофизиологических моделей поведения людей, которые лежат в основе принципов веб-дизайна. Они помогают дизайнерам, проектировщикам лучше понять поведение пользователей и найти эффективные решения при создании дизайна интерфейсов.
Видеокурсы и практика по дизайну интерактивных систем: ux/ui, веб-дизайн и бренд-дизайн
Вас ждет плотная проектная практика по анимации интерфейсов, дизайну сайтов, а также мобильных и веб-приложений. Под руководством наставников в стиле «смотри и повторяй»!
Breezzly — это среда для тренировки digital-навыков. Здесь вы встретите комплекты видеокурсов в актуальных инструментах интерактивного дизайна, среди них Figma, Principle и Invision Studio. А каждый проект — это живой кейс с историей, собранной по горячим следам!