Насколько прочен ваш пользователь процесс проектирования опыт?У всех нас есть наши благоприятствования методы и приемы, но общий процесс аналогичен: Проведение исследований, прототип, затем представляют заинтересованных сторон и пользователей .
Мы успешно доставлен проектов, исправлены проблемы и отточенные наши возможности по предоставлению в различных сценариях.Тем не менее, мы все знаем, что каждый проект unique, и каждый раз в то время что-то будет считать вас врасплох .
Каждый раз в то время, что-то будет считать вас врасплох .
За последние три года, я был ведущим дизайнером над большим проектом веб-приложения в правовой сфере.Когда я начал работать с клиентом в 2011 году, документ требований было 100 страниц.С тех пор миллионы фунтов были инвестированы спроектировать и построить этот весьма амбициозный, изменит правила игры кусок программного обеспечения .
В этой статье я буду обсуждать различные проблемы, с которыми мы столкнулись, и как мы в конце концов преодолел их.Многие из этих Уроки могут быть применены для повышения эффективности процесса проектирования пользовательский опыт в небольших проектов .
Проблема 1: Столкнувшись с Feasibility
С небольшого проекта (например, простого сайта), идти прямо в Wireframing инструмент выбора и сделать быструю интерактивные прототипы, чтобы сообщить свои идеи клиенту вполне приемлемо.В более сложном случае, многие из нас будут наметить Пользователь journeys 1 и, возможно, определить personas 2 прежде чем добраться до этой стадии.В этом нет ничего нового.Но то, что происходит, когда пользователь поездки настолько сложны, и их число настолько высоко, что технико-экономическое обоснование проекта является неопределенным
В Интернете или мобильного приложения, вы можете иметь много различных рабочих процессов, которые обслуживают пользователей, которые имеют различные роли в системе.Тем не менее, несмотря на сложности, которые могут существовать в некоторых частях, мы знаем, что большие куски, вероятно, будут реально — вход, регистрационная форма и навигационные элементы, которые мы все так хорошо знакомы с .
При Wireframing, я всегда брал логический шаг после путешествия пользователя, начиная с целевых страниц, а затем через него к конечной goal.Тем не менее, с таким много земли, чтобы покрыть, приготовления гарниры просто не имеет смысла, если основное блюдо недостижимо .
Технико-экономическое обоснование в бизнесе часто сосредотачиваются на рыночных условиях итехнические ограничения, однако для определения того, является столь же важным звука пользователей (UX) может быть доставлено.Если будет обнаружено, по линии, что проект слишком амбициозным, то много усилий, возможно, были потрачены впустую .
Решение 1: Решение проблем, сложных частей в First
Во время фазы обнаружения, выявления наиболее сложных аспектов пользовательского интерфейса (UI), а затем создать каркасы для этих конкретных деталей.Это прекрасно вписывается в привычные практики UX, таких как отображение из различных типов пользователей и их путешествиях по системе .
Решение этих проблем в первую очередь не только поможет дизайна прогресс быстрее, но также ПОМОЩЬ вы оценить, сколько времени разработки является needed .
Давайте рассмотрим гипотетический сценарий.Вы попросили создать сайт, содержащий функцию, которая позволяет пользователю, чтобы пригласить людей для разработки поздравительную открытку друга, вместе в режиме реального времени .
Рассмотрим следующий путь:
3
гипотетическая пользователь путешествие.( Просмотр большой version 4 )
Теперь давайте определить проблемы.Мы все знаем, что логин и пригласительные части возможно.Даже если мы не построили его сами в прошлом, мы видели подобные вещи в действии в другом месте .
Имея группа пользователей сотрудничать в режиме реального времени?Это может быть хаос! Мы должны создавать прототипы, что часть first, в противном случае вся поездка будет недействительным.Вы также можете рассмотреть мотив project 5 .Возможно, большая задача состоит мотив, или, возможно, это что-то попроще.Если это так, то вы должны обязательно включать что в ваших ранних каркасов, слишком .
Подводя итог, в то время как вопрос о целесообразности может быть трудно в крупных проектах, мы можем ответить на него быстрее, создавая каркасы для трудных частей UI фронт .
Проблема 2: Представление неполной Journey
Эта проблема является побочным эффектом первого решения!Как мы можем объяснить пробелы мы оставили позади?Чтобы проверить работу, проделанную до сих пор, мы должны разделить его со всеми заинтересованными сторонами и потенциальными пользователями .
Даже на этом этапе проекта — начало крестового похода, который может длиться месяцы, может быть, даже лет — “Wow” фактором является решающим.Нам нужно, чтобы все участвующие и обеспечить их бай-ин .
Решение 2: рассказывать историю Заполните Gaps
Продолжая пример рождения-карты, это, как мыбыло бы ввести понятие веб-сайта, чтобы наших партнеров и потенциальных клиентов:
Пользователь будет начать процесс входа в систему и выбора Как только они выбрали своих друзей из списка, они должны ждать ответа “новой карты.”.Когда их друзья ответили, все они входят редактор вместе, и это, как она работает .
Это может показаться странным, но это работает хорошо.И она имеет дополнительные преимущества:
- Вместо длительного монтажа, навигации все неприметных частей UI, мы сбрасывать встречу с мясом предлагаемого решения.Сокращая на охоту, мы гарантируем, что внимание не будет дрейфовать к тому времени мы доберемся до более важных вещах .
- Начало отвлекаться на презентации каркасном является распространенным явлением.Оглядываясь на наше путешествие диаграммы, представьте себе, если бы мы представили каркасы для этапов с 1 по 4, а затем застрял в длительной дискуссии о том, какие поля формы обязательны для заполнения на шаге 3. То, что мы действительно хотим, отзывы о шаге 5, так что давайте попастьрано, в то время как разум каждого человека еще свежи .
- Делая это, мы также сократить на удовлетворение раз, и вы окажетесь в состоянии проводить больше семинаров в пределах отведенного времени .
Рассказывая историю вместе с нашими выбранных каркасов, мы получаем все эти преимущества и решить проблему представления неполного пользователю путешествие .
Проблема 3: Wireframing программное обеспечение имеет Limitations
Как детальный должны каркас действительно быть?Многие веб-приложения имеют богатые анимации и тонкие взаимодействия, которые большинство инструментов Wireframing и эскизы не может моделировать .
Кроме того, каркасы не может поддерживать state.Например, как делает изменение макета, когда администратор входит в систему?Если это сайт электронной коммерции, то, что для полной и пустой корзины выглядеть?Мы, возможно, захотите, чтобы имитировать оба этих государств в нашем прототипе .
Без государства, наши приложения бесполезны.Тем не менее ни WYSIWYG Wireframing инструмент, который я знаю, не имитирует это эффективно .
Можно возразить, что, если мы собираемся строить логику, как это в наших каркасов, то почему бы просто не построить с чего следует начать?Дебаты интересно.Возможно, в один прекрасный день кто-то изобрести продукт, который может достичь этого;до тех пор, мы не должны останавливаться на других методов .
Решение 3: Перейти на более точный и Wireframes
На ранних стадиях проекта, определить, сколько сложность участвует в взаимодействия с пользователем.Может ли ваша идея быть легко поняты любым в виде серии статических каркасов?Если это не очевидно, то Вы не будете терять время в долгосрочной run создав более точный и прототип .
Делать это рано может показаться излишним (он может быть более длительным, конечно), но это имеет свои преимущества:
- В проекте, который требует сложных взаимодействий, каждое движение мышью и ход клавиши может включать в себя мелкие детали, которые делают большой разницы в общий опыт.Анимированные прототиппроще передать большой командой разработчиков, так что каждый точно знает, как сайт должен работать .
- Прототип будет также сделать ваше зрение яснее, когда демонстрируя пользователей и заинтересованных сторон .
3A: Создание HTML Prototype
Если у вас есть навыки разработки интерфейсных в вашем распоряжении, затем здание с HTML, CSS и JavaScript может быть выгодным вложением .
Этот метод имеет несколько ключевых преимуществ.JavaScript позволяет моделировать состояние, и многие структуры поможет нам быстро создавать тонкие анимации и эффектов (в том числе JQuery и Scripty2) .
Недостаток, конечно, в том, что весь процесс может быть более трудоемким.Существует также небольшая проблема несоответствия браузера, который лучше оставить неприятности в течение позже в проекте
3B: Создание анимированных Prototype
Анимированные прототипы также хороший способ, чтобы продемонстрировать свои идеи.Мой инструмент выбора для этого является Adobe Flash.В то время как некоторые сказали бы, что вспышка имеет свой день в качестве веб-плагина, это еще быстро анимация tool.Рисование, что в нем так же просто, как и в любой другой графической программы, и анимации так же просто, как перетаскивание.Выход может потребоваться плагин для просмотра, но это обойти эти досадные несоответствия браузера .
Много других инструментов может это сделать, тоже, конечно. Sketchflow 6 производит очень гладкие прототипы, и Adobe InDesign 7 также способен производить анимированные взаимодействия .
Вот тот, который я сделал ранее:
Пример анимированная прототип .
Давайте применим анимацию на нашем сайте рождения-карты.Мы знаем, что наша совместная инструмент будет иметь много движения (несколько указателей, можно перемещаться по экрану), а статическая каркас не будет захватывать должным образом.Таким образом, давайте подумаем о тонкостях каждого interaction и захватить их .
Один хороший пример в том, что парит над стрелкой, чтобы перейти к следующему странице сделает страницы немного вырастут.В нормальных-страниц токарей, мы могли бы сделат …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров