Методы проектирования GUI для улучшения пользовательского [закрытого] опыта
22 ответа
Если Вы действительно даете пользователю вопрос, не делайте его вопросом "да"/"нет". Не торопитесь, чтобы сделать новую форму и поместить глаголы как выбор как в Mac
, Например:
Would you like to save?
Yes No
Должен Быть:
Would you like to save?
Save Don't Save
существует более подробное объяснение здесь.
Sung Meister упомянул Mark Miller. Можно найти некоторые его сообщения в блоге относительно большого UI на блог экспресса Разработчика. Вот экранная демонстрация его Науки о большом представлении UI: part1 и part2. (оба требуют плеер Veoh ).
можно также найти его на dnrTV: Наука о большом пользовательском опыте: part1 и part2.
Вот Google techtalks о пользовательском опыте Jen Fitzpatrick.
Аплодисменты
Если Ваш UI включает ввод данных или управление (типичный для бизнес-приложений) тогда, я рекомендую предоставить Вашим пользователям способность действовать на наборы из элементов данных как можно больше. Также попытайтесь разработать таким способом, которым опытные пользователи могут взаимодействовать с UI в очень случайном, в противоположность последовательному пути (сочетания клавиш, гиперссылки, и т.д.).
Объекты в списке, который Вы представили, являются действительно зависимым ситуации - они будут варьироваться от приложения до приложения. Для некоторых приложений будет нужна кнопка сохранения, некоторые не будут. Некоторые условия гарантируют модальное диалоговое окно, некоторые не будут.
Мое главное правило для разработки применимого интерфейса: Следуйте существующим соглашениям UI. Ничто не смущает пользователя больше, чем UI, который не работает как ничто, что они когда-либо использовали. Lotus Notes имеет один из худших пользовательских интерфейсов, когда-либо созданных, и это почти полностью, потому что они шли вразрез с общими соглашениями UI с примерно всем, что они сделали.
, Если Вы подвергаете сомнению, как необходимо разработать определенную часть UI, думайте о нескольких стандартных/известных приложениях, которые обеспечивают схожую функциональность и видят, как они делают это.
Лучшая техника, которую я нашел, должна поместить Ваш сам в пользовательскую обувь. Что хотели бы Вы видеть от GUI и помещать это впереди. Это также дает Вам способность расположить по приоритетам, поскольку те вещи должны быть сделаны сначала тогда работа оттуда.
, Чтобы сделать это я пытаюсь найти, что "слои полноценности" и добавить / вычитают из слоев, пока это не кажется чистым. В основном для нахождения слоев я составляю список всех функций, которые GUI должен иметь, все функции, которые он должен иметь, и все функции, которые это было бы аккуратно для имения. Тогда я группирую тех так, чтобы каждая вещь имела логическое упорядочивание, и группировки становятся "слоями". От слоев я тогда добавляю самую важную функциональность (или что использовалось бы для Повседневной операции), и это становится самой видной частью, и я работаю вещи в функцию вокруг тех объектов.
Одной из самых жестких вещей является навигация, поскольку у Вас есть так много для предоставления использования, как Вы делаете его полезным, и это - то, где слои действительно помогают. Это облегчает видеть, как к меню разметки, как другие части взаимодействуют, какие части могут быть скрыты, и т.д.
, я нашел самый легкий способ сделать, это должно запуститься, видят, какой и как Ваши пользователи функционируют на ежедневной основе это, которое облегчит входить в их обувь (еще лучше должен сделать их задание в течение нескольких дней). Тогда сделайте некоторые демонстрации и поместите их перед пользователями, даже если они - Бумажные Прототипы (существует книга по этому процессу под названием Бумажная Разработка прототипа Carolyn Snyder). Тогда начните создавать его и поместите его перед пользователями, поскольку это создается часто .
я буду, также рекомендовал книжные Интерфейсы Разработки Jenifer Tidwell, опубликованной O'Reilly
Здесь большой эпизод подкаста DotNetRocks, где Mark Miller говорит о том, как создать Хороший UI; Даже при том, что выставочный заголовок является скалами.NET, этот эпизод переговоры об общем правиле ползунков о том, как создать UI для повышения производительности пользователя программы.
Вот отрывок эпизода
, Хороший дизайн пользовательского интерфейса может быть сделан путем придерживания некоторых хороших правил и предотвращения частых ошибок. Вы не должны быть разработчиком переноса MacBook татуировки-wearin латте-sippin для создания пользовательских интерфейсов та работа.
Попытайтесь думать о конечных целях своего пользователя сначала прежде, чем решить, какие отдельные задачи они выполнили бы при использовании программного обеспечения. Книга О Поверхности имеет превосходные обсуждения этого вида вещи и хотя довольно долго очень интересно и проницателен. Интересно отметить, сколькими из их предложений об улучшении разработки программного обеспечения кажутся используемому в документах Google...
Еще одна вещь, сохраните свой пользовательский интерфейс максимально простым и уберите.
Если Вы сделаете программное обеспечение предприятия, у большого количества пользователей будут маленькие мониторы в низком разрешении. Или если они будут стары, то у них будет он в низком res, таким образом, они будут видеть гигантские кнопки (я видел 800x600 на 24 "мониторах выхода). У меня есть старый 15-дюймовый монитор в низком разрешении (800 x 600), таким образом, я вижу то, что посмотрит программа, любит в меньше, чем неактивных условиях время от времени. Я знаю, что корпоративные пользователи в значительной степени должны принять то, что им дают, но если Вы разрабатываете winform, которая не вписывается 800x600 экран, он не помогает никому.
Действительно хорошая обратная связь чрезвычайно важна. Даже простые вещи как создание его очевидный, что может и не может быть нажато, могут быть пропущены или слишком тонкие. Обратная связь, когда что-то могло бы произойти в фоновом режиме, является большой. В Gmail замечательно, что существует лента состояния, появляющаяся наверху который, позвольте нам, Вы знаете, отправляет ли что-то или загружается, но еще лучше, что это сообщает, что что-то отправило успешно или все еще загрузка.
"желтый исчезает" техника, что-то еще сделанное, популярное среди толпы RoR, которая выполняет что-то подобное. Вы никогда не хотите, чтобы пользователь задал вопрос, "Что просто произошло?" или, "Что произойдет, когда я сделаю это?".
Другой прием, который стал более популярным в последнее время, что я использовал много, редактирует на месте. Вместо того, чтобы иметь представление некоторых данных с отдельным экраном "редактирования" (или пропустить представление и [только 111] наличие экрана редактирования), это может часто быть более удобно для пользователя для имения, приятно разметил представление некоторых данных, и просто нажмите для редактирования частей его. Эта техника является действительно только соответствующей, когда чтение данных происходит чаще, чем редактирование и не подходит для серьезного ввода данных.
Ну, одна вещь, которая может быть очевидной: не меняйте (даже немного) положение, цвет, размер шрифта, и т.д. кнопок, меню, ссылок, и т.д. между экранами, если они делают тот же тип действия.
При реализации поиска сделайте его живым поиском как то, что Locate32 и Google Suggest делают теперь. Я так привык к не нажатию "Enter" в поле поиска теперь.
Я нашел Шаблоны UI быть полезной ссылкой для этого вида вещи. Это расположено во многом как классическая книга Шаблонов разработки GoF с каждым описанием шаблона, содержащим:
- проблема шаблон решает
- пример шаблона в действии
- Демонстрационные варианты использования для шаблона
- решение реализовать шаблон
- Объяснение для решения
Один из классика заказывает для помощи, Вы думать о дизайне являетесь "Дизайном Повседневных Вещей" Donald Norman. Он дает большие реальные примеры. Например, при разработке двери хорошо Вам никогда не придется добавлять маркировки, которые говорят "нажатие" и "получение по запросу". Если Вы хотите, чтобы они вытянули, поместите дескриптор; если Вы хотите, чтобы они продвинули, поместите плоскую пластину. Нет никакого способа сделать это неправильно, и они не должны даже думать об этом.
Это - хорошая цель: сделайте вещи очевидными. Столь очевидный, что это никогда не происходит с пользователем, чтобы сделать неправильную вещь . Если существует четыре кнопки на печи, каждом рядом с глазом, очевидно, что каждая кнопка управляет глазом, который это рядом с. Если кнопки находятся в прямой линии, всех на левой стороне, необходимо маркировать их, и пользователь должен остановиться и думать. Плохой дизайн. не заставляют их думать.
Другой принцип: если пользователь делает , делают ошибку, должно быть очень легко отменить . Программное обеспечение обработки изображений Google, Picasa, является хорошим примером. Можно обрезать, повторно окрасить и исправить фотографии все, что Вы любите, и если Вы когда-нибудь передумали - даже месяц спустя - можно отменить изменения. Даже при явном сохранении изменений Picasa делает резервное копирование. Это освобождает пользователя, чтобы играть и исследовать, потому что Вы не собираетесь повреждать что-либо.
Полезная техника, которую я никогда не вижу, что любой использует, состоит в том, чтобы добавить подсказку для отключенного управления UI, объясняющего, почему управление отключено. Таким образом, если существует поле списка, которое отключено, и не ясно, почему это отключено, я хочу нависнуть над ним, и это говорит мне, почему это отключено. Я хочу видеть что-то как, "Он отключен, потому что два текстовых поля на экране были оставлены незаполненные или потому что я не ввел достаточно символов в некоторое поле или потому что я не сделал определенные действия"..
я вхожу так много таких ситуаций, и это печально. Иногда я заканчиваю тем, что отправил на форуме программного обеспечения, спрашивающем, почему управление отображается серым, когда подсказка, возможно, помогла мне через секунду! Большинство из них, программное обеспечение имеет справочные файлы, которые бесполезны в этих видах сценариев.
Попытка притвориться Вы ничего не знаете о своем программном обеспечении и пытаетесь использовать его. Однако это не практично, потому что у Вас уже есть определенный набор ума к приложению. Так наблюдайте за поддерживающими разработчиками, или друзья используют приложение и высматривают болевые точки и просят обратную связь.
Для добавления к списку, aku, я поместил бы explorability как один из моих самых высоких приоритетов. В основном я хочу, чтобы пользователь чувствовал себя в безопасности, испытывая функции. Они никогда не должны отступать от использования чего-то из опасения, что их действие могло бы быть необратимым. Обычно, это реализовано с помощью команд отмены/восстановления, но другие опции являются несомненно доступными, например, автоматическими резервными копиями.
кроме того, для приложений, которые более ориентированы на процесс (а не приложения ввода данных), я рассмотрел бы реализацию интерфейса что руководство пользователь немного больше. Microsoft Индуктивные инструкции по Пользовательскому интерфейсу могут помочь здесь, хотя необходимо очень бояться переусердствовать ее, поскольку можно легко замедлить пользователя слишком много.
Наконец, как с чем-либо, что включает текст, делают пользовательский интерфейс максимально поддающимся сканированию. Например, если у Вас есть заголовки, в соответствии с которыми команды/опции появляются, рассматривают помещение слова действия в запуске, а не вопросительного слова. Мнение, которое высказывает Maudite, является хорошим примером scannability также, поскольку "не Сохраняют" текст кнопки, не полагается на контекст предыдущего абзаца.
Первые Принципы: Wilfred James Hansen
- Знает, что Пользователь
- Минимизирует Запоминание
- , Оптимизируют Операции
- Инженер для Ошибок
Последующие Расширения: доктор Theo Mandel
Пользователи Места в Управлении
- Режимы Использования Рассудительно (немодальный)
- Позволяют Пользователям использовать или Клавиатуру или Мышь (гибкий)
- , Позволяют Пользователям Изменять Фокус (прерываемый)
- Дисплей, который Описательные сообщения и текст (полезный)
- Обеспечивают Непосредственным и Обратимым Действиям, и Обратная связь (прощение)
- Обеспечивает значимые Пути, и Выходы (пригодный для навигации)
- Снабжают Пользователей Различными Уровнями квалификации (доступный)
- , Делают Пользовательский интерфейс Прозрачным (facilitative)
- , Позволяют Пользователям Настраивать Интерфейс (предпочтения)
- , Позволяют Пользователям Непосредственно Управлять Интерфейсными Объектами (интерактивный)
, Уменьшают Загрузку в память Пользователей
- , Уменьшают Кратковременную память (помнят)
- , Полагаются на Распознавание, не, Отзыв (распознавание)
- Обеспечивает, Визуальные индикаторы (сообщают)
- , Обеспечивают Значения по умолчанию, Отмену, и Восстановление (прощение)
- Обеспечивает, Интерфейсные Ярлыки (частота)
- Продвигают Синтаксис Действия объекта (интуитивный)
- Использование Реальные Метафоры (передача)
- Пользователь, Прогрессивное Раскрытие (контекст)
- Способствует Визуальной Ясности (организуют)
, Делают Интерфейс Последовательным
- , Выдерживают Контекст Задач Users’ (непрерывность)
- , Поддерживают Непротиворечивость в, и через продукты (опыт)
- Сохраняют Результаты Взаимодействия Тем же (ожидания)
- , Обеспечивают Эстетическое Обращение, и Целостность (отношение)
- Поощряют Исследование (предсказуемый )
Выезд замечательная книга не заставляет меня думать Steve Krug.
Это - сфокусированная сеть, но многие conepts могут относиться к чему-либо от блендеров до автомобильных панелей инструментов.
Темы покрыли:
- Пользовательские шаблоны
- Разработка для сканирования
- Мудрое использование копии
- расположение Домашней страницы дизайна
- Навигации
- Тестирование удобства пользования
у Него также есть блог, названный Усовершенствованный Здравый смысл
И некоторые случайные ссылки по теме UI:
- Дизайн Пользовательского интерфейса для Программистов Joel Spolsky
- 10 Кошмаров Удобства использования Необходимо Знать
Я дам один из своих любимых: избегайте диалоговых окон любой ценой. Действительно хороший U я почти никогда не должен должен быть открываться диалоговое окно. Добавьте их к своей программе только как действительно последнее средство.
Для больше, Вы могли бы хотеть проверить легко удобоваримые ui подсказки для разработчиков.
При использовании выпадающего выпадающая высота по умолчанию является обычно слишком низкой (значение по умолчанию является 8 объектами для winforms, например).
Увеличение его или сохранит пользователя щелчок, если количество объектов будет небольшим, или помогите искать выпадающее, если существует много объектов.
На самом деле я вижу мало точки в не использовании всего свободного пространства!
Это настолько очевидно для меня теперь, но например, кажется, что даже разработчики VisualStudio не поняли это (btw, если Вы вручную увеличите высоту Intellisense, то это останется этот путь, но это - offtopic:))
Блог ужасов кодирования регулярно дает отличные идеи. Вот лишь несколько примеров:
- Исследовательское и пошаговое обучение
- Самодокументирующийся пользовательский интерфейс
- Инкрементальный поиск функций / доступ с интеллектуальной клавиатуры
- Конструкция, ориентированная на задачи (лента вместо меню и панелей инструментов)
- Обеспечение отмены вместо постоянного подтверждения
Другой аспект: использовать масштабируемые значки для решения проблемы множественных разрешений экрана пользователя без поддержки растровых изображений с разным разрешением.
Мне нравится следовать этим трем рекомендациям:
- Стандартный - следуйте известным стандартам/шаблонам, повторно используйте идеи из всех продуктов, которые вы уважаете
- Простой - держите ваши решения простыми и легко изменяемыми (если нужно)
- Элегантный - используйте меньше для достижения большего