Сам процесс проектирования UX очень гибок и может значительно меняться в зависимости от обстоятельств, поскольку разные команды разработчиков могут по-разному реализовывать свои процессы. ,
Однако, если бы не существовал надежный процесс проектирования UX, команда разработчиков могла бы работать полностью в темноте. С другой стороны, четкий и лаконичный процесс UX позволяет создавать удивительные и менее проблемные процессы для пользователя.
Но как реализовать такой процесс, если вы работаете в качестве индивидуального дизайнера — Какова общая позиция, чтобы найти себя в эти дни? В этом руководстве мы рассмотрим простой процесс UX, который поможет упростить ваш рабочий процесс соло, в том числе какие инструменты веб-дизайна использовать в дальнейшем.
Содержание статьи
- 1 01. Определите свои проблемы
- 2 02. Сбор данных от реальных пользователей
- 3 03. Проанализируйте своих конкурентов
- 4 04. Создание персон
- 5 05. Определите потоки пользователей
- 6 06. Мозговой штурм!
- 7 07. Создание бумажных каркасов
- 8 08. Разработка каркасов
- 9 09. Создайте базовый прототип
- 10 10. Уточнение визуального дизайна
- 11 11. Не забывайте о системах проектирования
01. Определите свои проблемы
Сначала определите проблему (и)! Вы должны четко понимать, что вы пытаетесь решить: спросите своих клиентов, работаете ли вы в агентстве, и спросите заинтересованных лиц или менеджера по продукту, если вы работаете в команде по продукту. UX-дизайн — это дисциплина для решения проблем, которая помогает конечным пользователям с легкостью достигать своих целей. Поэтому выяснить, будет ли идея вашего продукта удовлетворять этим потребностям, — ваш первый шаг.
02. Сбор данных от реальных пользователей
Опросы позволяют получить приличный объем данных от реальных пользователей. Используя умные вопросы, вы можете узнать больше о том, кто они, где они и каковы их потребности и цели. Вы можете использовать множество доступных инструментов для проведения опросов, таких как SurveyMonkey и Google Forms.
03. Проанализируйте своих конкурентов
Посмотрев, кто ваши конкуренты, вы сможете лучше понять, как можно создать что-то более необычное. Однако это не должно быть длительным процессом, так как все, что вы делаете, это видите, насколько жизнеспособна ваша идея продукта и есть ли у нее место на рынке.
04. Создание персон
С данными, полученными из опросов пользователей и анализа ваших конкурентов, вы теперь можете создавать персон. Персоны — это не те клиенты, которых вы хотите, а клиенты, которые действительно существуют, будь то те, которые у вас уже есть, или потенциальные клиенты на рынке. Несмотря на то, что эти персонажи вымышленные, они должны отражать поведение, мотивы, цели и потребности реальных людей. Хотя в последнее время горячо обсуждается эффективность создания персон, это очень хороший способ напомнить себе, что вы не пользователь.
05. Определите потоки пользователей
Имея информацию, которую мы теперь имеем в наших персонах, мы можем начать планировать поток, который будут принимать наши пользователи. Это поток пользователей — путь, пройденный опытным пользователем на веб-сайте или в приложении для выполнения задачи. Пользовательский поток переносит их от точки входа через ряд шагов к успешному результату и конечному действию, например, покупке продукта. В большинстве случаев пользовательский поток представляет собой визуальную диаграмму, которая показывает каждый экран, на котором пользователь может или может оказаться. Несмотря на то, что это отличный способ для дизайнеров визуализировать и работать с сайтом, он также может помочь разработчикам увидеть и понять типичное путешествие пользователя.
06. Мозговой штурм!
Мозговой штурм — это сочетание неформального решения проблем и латерального мышления. Это отличный способ генерировать идеи, которые вы не смогли бы придумать, просто взявшись за ручку и бумагу. Тем не менее, это будет самый сложный шаг для сольного дизайнера, потому что в большинстве случаев это делается внутри группы. Итак, вот несколько шагов, которые вы можете предпринять, чтобы ваш мозговой штурм был успешным.
Во-первых, вырвитесь из уединения, выйдите наружу и осмотрите, как маленькие сцены могут привести к большим идеям. Если вы работаете в компании, идите и задавайте вопросы разработчикам, менеджерам проектов, регистратору — даже начальнику! Получение новых перспектив может зажечь все виды идей. Теперь, используя липкие заметки или чистый лист бумаги, потратьте 15-30 минут, записывая как можно больше идей. Не суди их; просто продолжайте записывать то, что вы думаете.
07. Создание бумажных каркасов
К настоящему времени у вас должно быть приличное количество идей, будь то липкие заметки, прикрепленные к стене или написанные на бумаге. Теперь пришло время проявить еще большую креативность и начать набрасывать эти идеи на бумаге, которую иногда называют бумажными каркасами.
Создание эскизов — очень эффективный способ опробовать множество идей и выполнить итерации, прежде чем выбрать лучший. Сначала используя карандаш, мы можем нарисовать множество основных набросков, чтобы взглянуть на проблему с разных сторон и рассмотреть различные решения. После того, как вы определились с решением, вы можете просмотреть эскизы с помощью ручки, а затем стереть карандаш.
Чтобы было понятнее, добавляйте аннотации и примечания, где это возможно. После того как вы сделали несколько набросков, сделайте перерыв и вернитесь к своим наброскам через некоторое время. Посмотрите на них и посмотрите, имеют ли они смысл.
08. Разработка каркасов
Каркасы низкого качества включают в себя самый основной контент и визуальные элементы и обычно являются статичными (не интерактивными). Они часто используются, чтобы помочь наметить оболочку интерфейса, его экранов и базовой информационной архитектуры.
В настоящее время доступно множество каркасных инструментов, включая Figma, Sketch и даже Photoshop. Какой бы инструмент вы ни использовали, ваши низкокачественные каркасы обычно служат контрольной точкой для начала процесса проектирования для заинтересованных сторон и групп разработчиков, и вы должны быть в состоянии представить им четкие решения.
09. Создайте базовый прототип
На данный момент у вас есть все эти красивые каркасы, разработанные с помощью вашего любимого инструмента проектирования, и что теперь? Хорошо, если вы используете такой инструмент, как Figma, Sketch или InVision Studio, тогда будет легко и просто создать прототип с низкой точностью. Прототип — это простой и удобный перевод концепции продукта и дизайна. Он используется для превращения дизайнерских идей в проверяемые и ощутимые артефакты, сбора и анализа требований пользователей на этом раннем этапе, совершенствования вашего продукта на ходу.
10. Уточнение визуального дизайна
Теперь мы являемся счастливыми обладателями рабочего прототипа и всех заинтересованных сторон, и команда разработчиков довольна. Обычно это тот случай, когда вы передадите свой прототип дизайнеру пользовательского интерфейса. Но поскольку мы летим в одиночку, наша задача — создавать финальные визуальные элементы.
Несмотря на то, что доступно множество инструментов для проектирования, только пара считается «отраслевым стандартом» для дизайна пользовательского интерфейса, а это Sketch и Figma. Оба инструмента очень похожи, поэтому, какой бы вы ни выбрали, вы сможете легко переключаться позже, если передумаете.
11. Не забывайте о системах проектирования
Системы проектирования — это отличный способ использования набора повторяющихся компонентов и набора стандартов, в которых описывается использование этих компонентов. Многие компании смогли изменить темпы создания и инноваций в своих командах благодаря системам проектирования.
Как индивидуальный дизайнер, управление системой проектирования вашей компании (или даже вашей собственной) не будет легким, но определенно стоит сделать в долгосрочной перспективе. Вы можете использовать инструменты проектирования, такие как Figma и Sketch, для создания повторно используемых компонентов пользовательского интерфейса в библиотеке шаблонов, или вы можете работать с командой разработчиков переднего плана и создавать их с помощью кода. Эту коллекцию повторно используемых компонентов можно быстро собрать вместе, чтобы создать любое количество приложений.
Присоединяйтесь к нам 26 сентября для создания CSS, представленного вам Creative Bloq, net и веб-дизайнером. Сэкономьте 50 фунтов стерлингов за ранний билет при бронировании до 15 августа 2019 года.
Эта статья была первоначально опубликована в net самый продаваемый в мире журнал для веб-дизайнеров и разработчиков. Подписаться сейчас .
Подробнее: