Содержание

Что на самом деле означает определение «интуитивно понятный» интерфейс — UXPUB

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

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

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

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

Интуитивность не должна быть целью дизайна

Вы видели хоть один документ с требованиями к продукту, в котором было четко указано, что определенный продукт не должен быть интуитивно понятным?

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

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

Разбор значения определения «интуитивно понятный»

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

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

В общем, интуитивно понятный означает простой в использовании.

Но если вы посмотрите глубже, что на самом деле имеют в виду люди, когда начинают приводить примеры опыта, который «кажется интуитивно понятным», вы в конечном итоге получите фундаментальный набор принципов дизайна, которые должны быть вам знакомы, если вы UX или UI дизайнер:

  • Заметность: видны ли важные элементы на экране? Чем заметнее элемент, тем больше вероятность того, что пользователи узнают о нем и о том, как его использовать.
  • Обратная связь: когда пользователь предпринимает какие-либо действия, ясно ли ему, какое действие было предпринято и что было достигнуто этим действием?
  • Ограничения:
    ограничивает ли интерфейс набор действий, которые может предпринять пользователь? Бесконечные возможности часто оставляют пользователя в замешательстве.
  • Аффордансы: помогает ли дизайн людям понять, как взаимодействовать с определенными элементами? Суть заключается в том, чтобы дать пользователям «подсказки» о том, как работает каждый компонент.
  • Очевидность: можно ли выяснить, как использовать объект, взаимодействуя с ним?
  • Ориентация: знает ли пользователь, где он находится в структуре продукта в данный момент времени? Он знает, как двигаться вперед и назад?
  • Ожидание: соответствует ли результат действия ожиданиям пользователей до выполнения этого действия?
  • Эффективность: эффективен ли продукт, помогая пользователям выполнить задачу? Есть ли место для повышения эффективности, сокращения сценариев или ускорения результатов?

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

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

Юзабилити или интуитивно понятный интерфейс

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

Что такое юзабилити?

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

Есть 5 основных факторов юзабилити сайтов:

  • Обучаемость: насколько удобно и легко пользователь, который впервые попал на сайт, может выполнить простейшие задачи.
  • Эффективность: насколько быстро пользователь сможет повторить выполненные действия снова.
  • Запоминаемость: насколько быстро пользователь сможет сориентироваться на сайте, посетив его второй раз.
  • Ошибки: какое количество ошибок делает пользователь, насколько эти ошибки серьезны, и как легко их можно исправить.
  • Удовлетворенность: насколько пользователю в целом приятно пользоваться данным ресурсом.

Юзабилити – это одно из главных условий жизни и развития сайта. Если работа с сайтом ставит перед посетителем ряд трудностей, то, скорее всего, он поспешит покинуть такой сайт и вряд ли когда-то еще вернется. Вряд ли он станет изучать всевозможные курсы о том, как правильно работать с сайтами. В сети интернет еще множество ресурсов, которые также могут ему подойти.

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

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

Юзабилити сайтов можно оформить довольно просто. Походите по сайтам успешных конкурентов, сделайте выводы и придумайте что-то свое, что-то оригинальное. Это не сложно. Главное – правильно выбрать именно то, что действительно «работает на плюс».

Не надо размышлять о том, как удобно будет Вам находится на своем сайте. Поставьте себя на место посетителя. Вы ведь не собираетесь у себя что-то покупать? Но, не смотря на это, Ваше юзабилити должно быть настолько безупречным, чтобы Вы действительно захотели осуществить покупку у самого себя. Мы поможем вам справиться с подобной задачей – создать интересный и легкий в «обживании» сайт!

Голосов: 1796 | Просмотров: 7802

Почему интуитивно понятный интерфейс важен для веб-дизайна и разработки программного обеспечения

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

Что отличает действительный пользовательский интерфейс?

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

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

Чтобы оптимизировать веб-сайт или приложение, обычно необходимо провести подробные тесты. Исследования с пользователями могут обеспечить одинаково полезные результаты, такие как технические измерения, благодаря анализу с использованием тепловой карты . Таким образом отображается удобство использования: поведение пользователя восстанавливается с помощью отслеживания кликов, прокрутки, перемещения мыши или глаз и последующего отображения с хроматическими градациями.

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

Почему интуитивно понятный интерфейс настолько важен

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

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

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

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

Какую роль играет графический интерфейс в области seo?

Действительный графический интерфейс также оказывает положительное влияние на оптимизацию поисковых систем (SEO). Если пользователи могут перемещаться без проблем, просматривая ваш веб-сайт, то они будут хорошо и охотно тратить время на изучение : существенный фактор , поскольку поисковые системы учитывают время, проведенное пользователем на страницах сайта. По этой причине, когда вы разрабатываете графический интерфейс вашего сайта, вы всегда должны стараться поставить себя на место посетителя, который впервые видит ваш проект.

Если пользователю что-то не нравится при первом посещении ресурса, он сразу же оставляет страницу и начинает искать лучшую альтернативу. Таким образом, ключевая действующая концепция здесь, как и разработка программного обеспечения, — это интуитивная навигация.

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

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

Пользовательский интерфейс: лучшие примеры из мира веб-дизайна

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

Evernote

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

Домашняя страница Evernote сводится к минимуму без пренебрежения эстетическим фактором. Такой ясный и приятный внешний вид сразу же вдохновляет на простоту и интуитивное использование приложения. Источник: https://evernote.com/intl/ru/

Регистрационная форма разработана трезво и существенно. Требуется только адрес электронной почты и пароль, после которого вы уже можете начать. Такая структура определенно более удобна для пользователя, чем километровая форма ввода. Еще удобнее зарегистрировать аккаунт Google без необходимости создания специального профиля. Еще одна важная функция, сразу видимая пользователю, — это доступ с любого устройства и в любое время.

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

Google

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

Дизайн пользовательского интерфейса Google минимален, значки приложений легко понять, а голосовые поиски даже были введены как часть пользовательского интерфейса. Источник: google.com

Значки приложений для YouTube, Новостей, Карт и т. д. Всплывают и легко доступны одним щелчком мыши. Они также сразу понятны, логичны и подчеркивают их основную функцию символом изображения, который их представляет. А с реализацией интерфейса VUI поисковая система становится образцом для подражания: таким образом, на самом деле, Google умеет понимать голосовые запросы, даже через мобильное приложение. Как только он откалиброван на вашем голосе, поиск работает с голосовыми записями, и вы активируете его, произнеся «OK Google».

Руководство по Dropbox

Инструкции для использования являются утомительными, сложными и иногда более запутанными, чем полезными: по крайней мере, это клише. Но есть способ для достижения эффективного обучения и показывает графический интерфейс руководства Dropbox, который в 2015 году был даже награжден общественным голосом с премией Webby за «Лучший пользовательский интерфейс». Причина, по которой руководство так приветствуется публикой, уже ясно видно на главной странице: цифровые инструкции структурированы четким и информативным способом.

Руководство Dropbox четко структурировано для разных пользователей. Таким образом, бизнес-пользователи и администраторы могут быстро найти правильные ответы.

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

 

Создаем интуитивно понятный интерфейс для сайта

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

Главное в интуитивном дизайне то, что он незаметен. Дизайн понятен, когда пользователи могут сосредоточиться на задаче, не останавливаясь ни на секунду. Такой дизайн направляет внимание людей на важные задачи.

Представьте, что вы находитесь в салоне проката автомобилей, и вам показывают машину, которую собираетесь арендовать. Вы подходите к ней и хотите сесть в салон, протягиваете руку, чтобы открыть дверь, но дверной ручки нет! Как попасть в автомобиль?

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

То же касается веб-дизайна. Пока пользователи могут выполнять задачи без промедлений и раздумий — все в порядке. Интуитивный дизайн незаметен, а не интуитивный дизайн бросается в глаза.

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

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

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

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

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

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

Если пользователи впервые зашли на сайт, это не значит, что их текущие знания о нем равны нулю. Скорее всего, они уже пользовались похожим сайтом или продуктом раньше. Допустим, вы никогда не делали онлайн-покупок, зато в реальном мире совершали их миллион раз.

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

Но предположим, что они делали покупки в интернете раньше, только не на Amazon. В этом случае их концептуальная модель будет другой, как и их представление о покупках на сайте Amazon.

Если большинство пользователей никогда не пользовалось сайтом или онлайн-сервисом, похожим на ваш, то нужно опираться на концептуальную модель. Необходимо выяснить, какой наиболее приближенный к использованию вашего сайта опыт у них есть.

Если сайт не соответствует ментальной модели пользователя, он посчитает сайт сложным в использовании, не интуитивным.

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

Есть два отличных способа выяснить это:

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

Юзабилити-тест «Стоя за плечом». Попросите людей воспользоваться сайтом, выполнить набор задач и прокомментировать свой мыслительный процесс. Это также можно сделать удаленно. Это определит целевые знания.

В обоих случаях вы наблюдаете и записываете, не вмешиваясь. Вы быстро определите основные проблемы. 10 испытуемых обычно дают представление о 90% трудностей.

Дизайн интуитивно понятен, когда текущие знания соответствуют целевым знаниям.

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

  1. Текущие знания идентичны целевым. Когда пользователь видит дизайн, он знает все, что ему нужно, чтобы работать с ним и выполнить свою задачу.
  2. Текущие знания не совпадают с целевыми, но пользователь не осознает, что дизайн помогает ему преодолеть этот разрыв. Пользователь учится естественным образом.

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

Лучший пример первого условия — поиск Google. Его невозможно использовать неправильно.

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

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

76% пользователей говорят, что для них самое важное в дизайне сайта — это «чтобы я мог легко найти, что хочу».

Как они ищут то, что нужно? С помощью навигации, конечно. Тут возникает сложность: если на сайте много контента, как структурировать его таким образом, чтобы это имело смысл?

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

Важно называть пункты меню правильно, чтобы люди знали, что находится за ссылкой. Интересно, что 50% всех пользователей отказываются от покупок, потому что не могут найти то, что ищут. Вот почему поиск чрезвычайно важен. На вашем сайте должен быть поиск, который можно легко найти. У Amazon огромный перечень товаров, и они сделали поиск центральным элементом своего сайта.

И не забудьте подключить отслеживание сайта в Google Analytics. С его помощью вы обнаружите, что пользователи, которые используют поиск, имеют более высокий коэффициент конверсии.

Люди проводят большую часть времени на других сайтах. Поэтому они привыкли к тому, что сайт выглядит определенным образом (текущие знания). Если нарушаете это правило, то сами напрашиваетесь на неприятности.

Типичные привычные элементы:

  • Клик по логотипу, расположенному в левом верхнем углу всегда должен возвращать на главную страницу.
  • Последняя ссылка в горизонтальном меню или нижняя в вертикальном меню – это контакты.
  • Контактная информация должна быть представлена в нижней части сайта.
  • Будьте последовательны: навигация и другие важные элементы должны оставаться в одном и том же месте на любой странице сайта.
  • Ссылки выделяются на фоне обычного текста.
  • Если пользователи могут скролить вниз, полоса прокрутки должна быть хорошо видна.
  • Текст с выравниванием по левому краю легче читать, чем выровненный по правому краю.
  • Отображайте всплывающие справочные сообщения и уведомления,
  • При проектировании веб интерфейсов сайта используйте понятные, которые пользователи могут понять.

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

20% пользователей тратят 80% своих доходов в интернете. И именно на этих людях отражается смена дизайна. Они привыкли к тому, как все работает, и когда вы переделываете сайт, то меняете его, в первую очередь, для них.

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

Крупный продавец потратил 100 миллионов долларов на редизайн, в результате чего продажи упали на 20%. Юридической фирме пришлось закрыться. В расписании врача и авиакомпании серьезные задержки. Их сайты/приложения перестали быть интуитивными для большинства пользователей.

Нужно ориентироваться на самых важных покупателей. Интерфейс сайта должен быть наиболее интуитивным для них. Не пытайтесь угодить всем.

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

Это правило работает в случае, если у вас большая аудитория. Если на вашем сайте небольшой трафик из-за дизайна, смело меняйте его.

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

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

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

ВЛВиктория Лебедеваавтор-переводчик статьи «Intuitive Web Design: How to Make Your Website Intuitive to Use»

Интуитивно понятный пользовательский интерфейс — Win32 apps

  • Статья
  • Чтение занимает 2 мин
  • 2 contributors

Были ли сведения на этой странице полезными?

Да Нет

Хотите оставить дополнительный отзыв?

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

Отправить

В этой статье

в первый раз Windows 7 позволяет разработчикам и их конечным пользователям управлять своими компьютерами, касаясь экрана. Возможности сенсорного ввода и управления несколькими касаниями обеспечивают естественный и интуитивно понятный способ взаимодействия пользователей с ПК. Платформа разработчика включает интерфейсы API жестов высокого уровня, а также низкоуровневые сенсорные сообщения и API сенсорного ввода. элементы пользовательского интерфейса верхнего уровня, такие как меню « пуск » и панель задач, имеют большие целевые объекты, чем предыдущие Windows выпусках, что упрощает выбор с помощью пальца вместо мыши. Визуальная обратная связь предоставляется для касания и двойного касания. Windows обозреватель и Windows Internet Explorer 8 удобны и легко интегрируются с приложениями Windows 7.

Жесты с несколькими касаниями, API манипуляции и инерции

в Windows 7 реализована улучшенная поддержка сенсорного ввода и жестов, позволяющая разработчикам быстро и легко создавать уникальные возможности приложений, которые выходят за рамки простого указателя мыши, щелчка и перетаскивания. Новые многосенсорный API-интерфейсы поддерживают богатые жесты, такие как панорамирование, изменение масштаба и вращение. Все жесты обеспечивают прямую визуальную обратную связь и взаимодействуют с базовым содержимым естественным и интуитивно понятным способом. Например, жест масштабирования выравнивает представление по положению жеста. Интерфейсы API сенсорного ввода нижнего уровня также доступны для определения пользовательского жеста и расширенного взаимодействия с сенсорным реагированием. Windows 7 предоставляет платформу разработки, которая предоставляет разработчикам средства, необходимые для разработки творческих приложений для устройств ввода с несколькими сенсорными устройствами, путем обработки вводимых пользователем данных с устройств с несколькими сенсорными устройствами и улучшения пользовательского интерфейса. Результатом являются более интуитивно понятные среды, которые позволяют повысить эффективность взаимодействия с компьютером.

Windows 7 также обеспечивает поддержку платформ для обработки объектов и инерции. Широкий набор функций манипуляции позволяет растянуть, изменить размер или повернуть несколько объектов одновременно и в очень тонкой детализации. Например, несколько цифровых фотографий можно обрезать, изменить их размер и повернуть в одном сеансе с помощью жестов на основе сенсорного ввода.

Windows 7 включает api инерции, которые имитируют инерцию при перемещении объектов и работают с интерфейсами api манипуляции. Например, в приложении Photo можно использовать API манипуляции, чтобы позволить пользователям поворачивать, изменять размер и перемещать фотографии. Аналогичным образом, если пользователь «отменяет» фотографию, интерфейсы API инерции предоставляют естественное взаимодействие и позволяют проделать фотографию в побережье или воздержаться на границах окна приложения. (см. Windows руководство по программированию touch и Windows Touch: ресурсы для разработчиков).

Single-Finger панорамирование

Во многих распространенных приложениях функции сенсорного ввода более удобны для навигации, чем для выбора текста. С помощью расширенных API сенсорного управления приложение разработчика может включить панорамирование, а не перетаскивание. Например, если вы создали приложение, которое использует жесты с несколькими касаниями для пользователей, воспроизводящих музыку, эти пользователи могут просто сдвинуть палец вверх или вниз, чтобы настроить том, изменить песни или загрузить файл. Прокрутка не требуется.

Windows 7 предоставляет неограниченные возможности для разработчиков, заинтересованных в создании приложений для компьютеров следующего поколения. И, что самое главное, это затрудняет проверку полос прокрутки и реализацию семантики панорамирования. Приложения также получают более широкий набор событий и отзывов о настраиваемых элементах управления жестами, чем в предыдущих версиях Windows. (См. статью улучшение возможностей панорамирования Single-Finger.)

Необработанные входные данные сенсорного ввода

в Windows 7 новые сенсорные возможности поддерживаются моделями взаимодействия, которые обращаются к сообщениям с сенсорным входом низкого уровня и предоставляют настраиваемые ответы на сочетания сенсорных сообщений. Платформа поддерживает получение необработанных входных данных для таких сценариев, как приложения для рисования с несколькими касаниями и пользовательские жесты в приложении. Вы можете использовать поддержку платформы для сенсорного ввода или создания собственных оригинальных и многофункциональных возможностей. (См . _ сообщение WM Touch.)

Разработка UI | Web, Mobile & IoT — CimpleO

Что такое UI-дизайн

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

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

Главная задача UI-дизайнера — дать пользователю интуитивно понятный интерфейс, в котором легко разобраться. Всем должно быть с ходу понятно, как пользоваться сайтом, приложением или программой. Дизайнер следит, чтобы интерфейс был четко структурирован и соответствовал требованиям Техзадания.

Процесс реализации UI

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

Затем создается User Flow Diagram — карта экранов. На этом этапе проектируется каждый экран, который увидит пользователь. Прогнозируется как будет вести себя человек при использовании будущего приложения и какое состояние принимает интерфейс при каждом взаимодействии пользователя с ним.

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

Утверждение дизайна

На финальном этапе клиент оценивает результат, даёт свои комментарии и предложения, а разработчик при необходимости вносит мелкие правки.

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

Факторы, на которые влияет UI

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

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

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

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

Доверьте нам дизайн своего проекта

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

Дизайн — первое, на что обращает внимание ваш потенциальный клиент. Если сайт не заинтересовал посетителя в первые секунды, то он просто закроет вашу страницу и продолжит поиски. Когда приложение морально устарело, пользователь перейдет на конкурирующее, более современное и удобное приложение.

Наша команда занимается разработкой с 2012 года. Мы следим за тенденциями и трендами веб-дизайна для создания интересных и современных сайтов, способных заинтересовать ваших клиентов.

Как определить, что твой дизайн интуитивно понятен | by Olga Chernenka

Если элементу интерфейса необходим лейбл, обьясняющий, как с ним взаимодействовать, доступность интерфейса храмает.

С этой стороны нужно было просто убрать ручку. Ручка есть и человек за нее хватается и начинает тянуть, вместо того чтобы толкать

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

Как протестировать?

Берем того же друга или коллегу и спрашиваем, как ты думаешь что это такое? Что с этим можно сделать?Если он не понимает что инпут это инпут и его можно заполнить, то сделайте его больше похожим на поле ввода.

3. Прогнозируемость

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

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

Обращайтесь к пользователю на понятном ему языке, коротко и ясно. Но не пытайтесь сократить тексты на столько, что смысл будет теряться, здесь нужна мера. Избегайте непонятный для ЦА жаргон, акронимы и аббревиатуры. Чтобы чувствовать себя более уверенно с текстами, почитайте книгу “Пиши, сокращай”.

Не старайтесь заменить тексты иконками полностью, это оправдано в редких случаях, при использовании стандартных иконок, таких как wi-fi.

Это похоже на злую шутку

Как протестировать?

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

4. Отзывчивость

Это понятная, точная, незамедлительная реакция на действие пользователя.

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

Прелоадеры и прогресс-бары

Если процесс займет меньше 10 секунд вы можете обойтись прелоадером, если больше, покажите юзеру прогресс-бар, чтобы он понимал, что страница не зависла и процесс выполняется.

Загрузка макетов в Zeplin

Отображение статуса

Статус действия — успешный, внимание, ошибка; локация внутри сервиса/сайта/приложения. Часто, для отображения статусов используется цвет. Помните, что около 8% мужчин имеют нарушения восприятия цвета. Если вы работаете в Sketch, можете воспользоваться плагином Stark, вы сможете посмотреть, как люди с разными нарушениями восприятия цвета видят вашу страницу. Главное правило, все должно быть достаточно контрастно, переведите макет в чб и если текст на цветном фоне читается плохо, то добавьте контраст.

Как протестировать?

Сразу после выполнения действия спросите у пользователя, что на его взгляд, происходит или произошло.

5. Предсказуемость

Пользовательдолжен получить результат, которого он ожидал от своих действий.

Если человек удивился, тому к чему привели его действия, то возможные проблемы:

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

Как протестировать?

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

6. Эффективность

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

Неэффективное взаимодействие

Кнопка должна быть полностью кликабельна, а не только ее часть. Если цель маленькая, сделайте кликабельную область больше, чем она сама. Для ссылок используйте лейблы подлиннее.

Ненужное взаимодействие

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

Запоминайте

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

Не давайте ошибиться

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

Не заставляйте думать, покажите в каком именно формате вы хотите получить данные

Как протестировать?

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

7. Прощение ошибок

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

Интерфейс Spark

Для таких действий можно использовать отложенный старт выполнения, например на 5 секунд. В течении этих 5-ти секунд, дать пользователю отменить действие или проигнорировать и позволить ему выполниться.

Но самое лучшее, это постараться предотвратить ошибки

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

Как протестировать?

Делайте акцент на ситуации, когда пользователь совершает ошибку. Как часто он это делает? На сколько просто отменить действие и исправить ошибку?

8. Безопасность

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

Самая распрастраненная причина отсутствия чувства уверенности у пользователя — нестандартная навигация, неясные сообщения и руководства к действию. Человек должен чуствовать, что он контролирует ситуацию. Это очень широкая тема, постараюсь донести самые главные тезизы.

Подтверждение деструктивных действий

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

Если действие повторяется часто, не просите у пользователя подтверждение действия, потому что он начнет подтверждать его автоматически (привет всем, кому я отправила письма, которые потом не смогла отменить).

Действие требуется только для отмены действия. В случае, если вы все сделали правильно, вы просто игнорируете сообщение

Когда пользователь удаляет альбом с фотографиями, заставьте его задуматься. Вместо того, чтобы спросить: “Удальть альбом Untitled?”, поставьте вопрос таким образом: “Вы уверенны, что хотите удалить альбом Untitled с 1366 фотографиями?”.

Если вероятные последствия слишком серьезные, дайте возможность отменить действие на протяжении еще какого-то времени. Например, сохраните этот альбом в удаленных на месяц, дайте возможность восстановить аккаунт после деактивации и тд.

Для мобильных приложений

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

Не просто будет разблокировать телефон в кармане штанов своими ягодицами, правда?

Просто держите в голове, что такие действия как тап, двойной тап, свайп, длинный тап, можно легко сделать случайно. Смоделируйте ситуацию, если такое происходит, к каким последствиям это приведет?

Пользователь контролирует ситуацию

Просто будьте осторожны с автоматическими действиями. Я пользуюсь несколькими аккаунтами в google, когда я была разлогинена и нажимала “Войти”, google сам принимал решение в какой аккаунт я хочу зайти (на данный момент, кажется, это уже не так). Это заставляло делать много дополнительных действий, чтобы войти туда, куда я хотела.

Если вы не уверенны в своих предположениях, лучше уточните у пользователя, дайте ему возможность самостоятельно принять решение. Последнее слово за пользователем!

Понятная модель навигации

Вы должны убедиться, что пользователь понимает как выполнить основные действия:

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

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

Очевидная система сохранения и подтверждения действий

Просто сделайте очевидным текущий статус или возможность этот статус изменить. Худший сценарий, это заполнить несколько шагов регистрации, на последнем шаге нажать кнопку “пропустить” и осознать что все предыдущие данные не сохранились.

Очевидный статус о сохранении контента

Работайте над уверенностью пользователя

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

На какой день выставлен будильник? На 6 am или 6pm?

Как протестировать?

Обращайте внимание на частое использование “назад”, на общую неуверенность пользователя, страх нажать на подтверждение действия.

Интуитивность интерфейса — это не дело вкуса и не абстрактное понятие. Используйте эти атрибуты принимая решения, выявляя проблемы и эффективно аргументируя дизайн-решения коллегам.

Интуитивный интерфейс | User Experience Office

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

Определить интуитивно понятный интерфейс довольно просто, хотя создать его может быть непросто. Вот определение:

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

Другими словами, мы находим что-то интуитивное, когда нам не нужно об этом думать.

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

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

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

Это больше, чем просто дизайн

Как создать интуитивно понятный интерфейс? Интуиция касается не только дизайна. То, что интуитивно понятно вам, может меня сбить с толку. Подобно прекрасному костюму или платью, интерфейс должен подходить пользователю. Портной будет использовать измерительную ленту и манекен, чтобы подогнать одежду под клиента. UX-дизайнер использует исследования и прототипы, чтобы понять ментальную модель пользователя, а затем разрабатывает соответствующий интерфейс.

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

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

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

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

  1. Приветствую.

  2. Я сяду.

  3. Мне вручат меню.

  4. Я выберу то, что хочу.

  5. Мне принесут еду.

  6. Я съем.

  7. Я за это заплачу.

Это немного упрощено, но суть должна быть ясной. Если ресторан следует этому сценарию, процесс интуитивно понятен. Посетителю не нужно придумывать, что делать, потому что все совпадает с его или ее ожиданиями. Сценарий также позволяет пользователю идентифицировать отсутствующие элементы.Если клиент сидит за столиком, но никто не приносит меню, она будет знать, что нужно его попросить.

А теперь представьте, что в каком-то ресторане модель другая. Возможно, вы должны заплатить до того, как сядете.

Я помню, как много лет назад встречал такое место в Италии. Вы платили при входе, а затем вам подавали еду в стиле столовой. В первый раз, когда я пошел в этот ресторан, я был сбит с толку, потому что процесс не соответствовал моей ментальной модели; это было не интуитивно.Конечно, как только я узнал, как это работает, это стало легко. Но первое знакомство смутило.

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

Как создавать интуитивно понятные проекты

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

Если вы хотите создавать интуитивно понятные дизайны, вам нужно начать с понимания ментальной модели пользователя.Затем вы можете разработать дизайн, максимально соответствующий ожиданиям пользователя. Проблема, конечно, в том, что ментальные модели скрыты. Они существуют в голове пользователей, поэтому вам нужно сделать некоторые предположения о том, что происходит. Кроме того, у каждого пользователя своя ментальная модель, потому что у них разный опыт.

Существует два основных способа оценки ментальных моделей ваших пользователей:

Исследование пользователей

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

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

Юзабилити-тестирование

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

Вот несколько советов по созданию интуитивно понятного дизайна:

  • Разделите пользователей на сегменты.Группируйте пользователей с похожим опытом и потребностями вместе. Тщательно выбирайте сегменты, чтобы у вас было как можно меньше групп пользователей. У всех не будет одинаковых ментальных моделей, но, сгруппировав их вместе, у вас будет шанс выявить общие черты в каждой группе.
  • Постарайтесь понять их представления. Попросите их набросать шаги, которым они будут следовать, или напишите сценарии.
  • Внимательно слушайте их терминологию. Интуитивно понятный интерфейс должен использовать те же слова, что и его пользователи.
  • Подумайте об основных концепциях и знаниях, которые должен иметь пользователь, чтобы понять пользовательский интерфейс. Особое внимание уделите техническим терминам и понятиям, которые могут быть неочевидны для пользователя. При необходимости дайте им определение или объясните, чтобы пользователь мог принимать осмысленные решения.
  • Организуйте задачи и информацию так, как их ожидает пользователь.

Заключение

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

Разработка интуитивно понятного пользовательского интерфейса | by Rizki Mardita

Иногда люди говорят, что работа дизайнера не тяжелая. Они предполагали, что дизайнеры Visual/UI всего лишь переводят концепцию продукта в визуальную форму (рисуют на бумаге и делают цифровые версии).Вот почему дизайн становится чем-то, что некоторые люди считают тривиальным.

Существуют различия между этими различными типами дизайна:

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

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

Из приведенных выше типов дизайна, на самом деле ответили некоторые люди воспринимаются.

Чтобы сделать продукт, конечно же, мы хотим, чтобы наш продукт всем нравился и был любим. И правильный выбор — № 4 (хороший дизайн пользовательского интерфейса и интуитивно понятный, полезный, удобный для пользователя, осмысленный, решающий проблемы, понимающий потребности пользователей, понимающий потребности бизнеса и т. д.).) и отбросьте представление о том, что дизайн тривиален. Если вы не выберете вариант № 1, 2 или 3.

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

1. Знать 2 вещи (Цели)

  • Бизнес-цели
  • Пользовательские цели

2. Визуальная иерархия и приоритет

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

3. Применение принципов гештальта

Гештальт — это теория, которая объясняет процесс визуального восприятия путем организации компонентов и связанных элементов, формирования паттернов или сходств в единое целое.

Теория гештальта — это фундаментальное знание, которое очень важно для визуального/UI-дизайнера. Вот несколько основных принципов гештальта, которые я всегда использовал в процессе дизайна:

  1. Рисунок Ground
  2. Близкость
  3. Сходство
  4. Непрерывность
  5. Общая область
  6. Закрытие
  7. Фокусные точки

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

4. Эвристическая оценка

Эвристическая оценка — это теория измерения использования веб-сайта/приложения, разработанная Джейкобом Нильсеном и Рольфом Моличем в 1990 году и состоящая из 10 основных принципов:

  1. Видимость состояния системы
  2. Система и реальный мир
  3. Пользовательский контроль и свобода
  4. Согласованность и стандарты
  5. Предотвращение ошибок
  6. Распознавание, а не повторение
  7. Гибкость и эффективность использования
  8. Эстетичный и минималистичный дизайн
  9. Помощь пользователям в восстановлении после распознавания, диагностики и восстановления ошибки
  10. Справка и документация

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

интуитивно понятный интерфейс в предложении

Эти примеры взяты из корпусов и из источников в Интернете. Любые мнения в примерах не отражают мнение редакторов Кембриджского словаря, издательства Кембриджского университета или его лицензиаров.

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

Из

Википедия