Юзабилити / UI Design / UX и т. Д. - документирование проекта - PullRequest
4 голосов
/ 08 января 2010

Я разработчик программного обеспечения, и сейчас я приступаю к проекту, который предусматривает создание веб-сайта с использованием ASP.NET (3.5 / 2008, с использованием фабрики программного обеспечения веб-клиента). Мне было поручено создать UI / UX Design Document для проекта, однако я не знаю, с чего начать.

Я участвовал в одном проекте за 3 года, где был официальный документ по дизайну пользовательского интерфейса, который включал в себя макеты и правила / правила стиля (например, приложение имеет заголовок, навигацию и т. Д., Ссылки должны быть цвета A, кнопки за положительные действия надо быть справа и тд и тп). Оглядываясь назад, это было очень полезно, я оценил, что кто-то тоже приложил столько усилий - даже определив классы CSS в документе. Однако документ основан на существующем приложении и соответствует общему фирменному стилю бизнеса.

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

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

Что бы вы включили в этот документ? Он нацелен на бизнес (клиента), а также на разработчиков. Я могу думать только о следующем:

  1. Макет - верхний и нижний колонтитулы, контент, навигация
  2. Стили - цветовая палитра и стили различных ожидаемых компонентов
  3. Взаимодействие с пользователем - когда пользователь выполняет действие и должен ждать уведомления от модального диалога, проверка выполняется с использованием AJAX, навигация должна быть контекстной, задачи должны выполняться с минимальным количеством нажатий / переходов и т. Д. И т. Д. .

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

Спасибо

Джеймс

Ответы [ 3 ]

2 голосов
/ 08 января 2010

Существует множество элементов, которые могут быть включены в такой набор документации:

  • рекомендации по визуальному стилю (цвета, шрифты, размеры, значки и т. Д.)
  • рекомендации по брендингу (корпоративные логотипы, цвета, сообщения и т. Д.)
  • Руководство по стилю авторского права (терминология, правильная передача сообщений, правильная озвучка и т. Д.)
  • персона / демографический таргетинг
  • рекомендации по макету страницы
  • Руководящие принципы / стандарты CSS
  • JS руководящие принципы / стандарты
  • варианты использования
  • проблемы доступности
  • вопросы юзабилити
  • пример реализации
  • Путь потока IA
  • Каркасные компоненты
  • и т.д.

Я бы взял эту книгу, если бы вы могли подумать об этом:

http://www.amazon.com/Web-Anatomy-Interaction-Frameworks-ebook/dp/B002ZY5FCW/ref=sr_1_2?ie=UTF8&s=books&qid=1262983955&sr=8-2

1 голос
/ 15 января 2010

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

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

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

0 голосов
/ 08 января 2010

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

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

...