Fishlake-scripts.ru

Образование и уроки
0 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Обучение проектирование интерфейсов

С чего начать обучение UX-дизайну

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

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

Кто такой UX-дизайнер, чем он занимается

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

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

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

Кто может стать UX-дизайнером

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

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

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

Поэтому хорошими проектировщиками могут стать и архитекторы, и инженеры, и программисты. Главное — разобраться в основах интерактивного дизайна и понять, как строится логика работы в UX. Это можно сделать самостоятельно или на специальных UI/UX-дизайн курсах.

С чего начать

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

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

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

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

Исследование

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

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

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

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

Что изучить

«Customer Development:50 вопросов для интервью».

Яндекс: Продуктовые исследования.

Анализ данных

Когда задачи продукта ясны, дизайнер продумывает логику взаимодействия.

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

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

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

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

Что изучить

«Создание пользовательских профилей».

«Что такое Jobs-To-Be-Done и Job stories».

«Артефакты: сценарии».

Персонажи и сценарии при проектировании.

Проектирование

На этом этапе визуализируют все собранные данные. Строят структуру приложения, располагают элементы для каждого экрана.

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

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

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

Что изучить

Примеры хороших прототипов.

Axure7 для начинающих.

Первый вайрфрейм вашего приложения.

Руководство по вайрфреймам для начинающих.

Мокап, вайрфрейм, прототип и скетч.

Дэн Роэм «Визуальное мышление».

Дизайн

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

На этапе из прототипов и вайрфреймов создают визуализацию, работают с цветом, композицией и типографикой, оформляют контент.

Для этого подходят графические редакторы, в которых работают дизайнеры:

Задача для UX-дизайнера — следить за юзабилити отдельных элементов и страниц в целом. Наблюдать, чтобы при добавлении визуальных эффектов, не потерялся основной смысл продукта.

Что изучить

Если нет времени изучать верстку и типографику.

Азы типографики: нескучно о шрифтах.

Список ресурсов для начинающих дизайнеров.

План обучения младшего дизайнера.

Анализ метрик

После публикации первой рабочей версии продукта UX-дизайнер следит за реальным поведением пользователей. Для этого используют системы аналитики и различные метрики.

Работают над продуктом — проводят юзабилити- и A/B-тесты. Улучшают пользовательский опыт, добавляют новые возможности.

Что изучить

UX-методики конкурентного анализа и сравнения продуктов.

Роль исследований UX в разработке продукта.

Как учиться UX-дизайну

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

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

Что изучить

Mail.ru: «Прототипируем приложение: сценарии, анимация, иконки, юзабилити-тест на примере Моего Мира».

Алан Купер «Об интерфейсе. Основы проектирования взаимодействия».

Джесс Гарретт «Элементы опыта взаимодействия».

Стив Круг «Как сделать сайт удобным. Юзабилити по методу Стива Круга».

Начать обучение UX-дизайну, научиться создавать эффективные и полезные решения для бизнеса поможет курс «UX-дизайн» от Skillbox.

Учебный курс для глубокого погружения в профессию UX/UI дизайнера. Вы изучите основы веб-дизайна, UX и работу в Figma, научитесь проектировать интерфейсы, проводить исследования, составлять карту пользователя и презентовать свои работы клиенту.

  • Первые полгода учёбы — без оплаты.
  • Неограниченный доступ к материалам курса.
  • Обучение на реальных задачах.
  • Карьерные консультации и помощь в трудоустройстве.

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

Принципы создания пользовательских интерфейсов

Описание

Разбираемые темы

1. Принципы создания ПИ (8 а.ч.)

1.1. Дискуссия. Элементарные строительные блоки (4 а.ч.)

  • Обзор, цели и задачи тренинга.
  • Знаки, метафоры и идиомы. Дуальность знака по Ф. де Соссюру. Знаки разной модальности. Коммуникация через знаки. Изобразительные, указательные и символические знаки. От знаков — к метафорам. Визуальные и невизуальные метафоры и идиомы. Метафорический и идиоматический интерфейс. Проблемы обучения и самообучения пользователей продукта.
  • Работа с текстом, шрифтом и цветом. Использование текста и шрифта. Введение в типографику. Использование цвета. Цветовая эргономика. Цветаантагонисты. Цветовой круг И. Иттена. Примеры цветовых сочетаний. Нарушения цветового восприятия.

1.2 Деловая игра. Бумажное прототипирование ПИ (Часть 1, 4 а.ч.)

  • Формат проведения: в командах по 3 чел.
  • Цель игры (для ведущего): сформировать навыки бумажного прототипирования ПИ цифрового продукта.
  • Задача игры (для команды): создать бумажные прототипы одной или несколько основных (и вспомогательных) экранных форм программного продукта (настольного, мобильного или веб-приложения) или программноаппаратного комплекса, решающего проблему конкретной категории пользователей в известном контексте (проблема, категория пользователей и контекст выбираются командой самостоятельно или после консультирования с ведущим); на усмотрение ведущего задача может быть дополнительно усложнена проектированием и использованием системы визуальных знаков (не менее 4 – 5 ед.); на усмотрение команды экранные формы могут быть заменены информационными панелями (dashboards) или объектами информационной графики.
  • Ожидаемый результат: бумажный прототип одной или нескольких основных (вспомогательных) экранных форм программного продукта или программноаппаратного комплекса.
Читать еще:  Профессионал центр обучения москва

2. Целеориентированное проектирование ПИ (12 а.ч.)

2.1 Дискуссия. Теоретические основания проектирования ПИ (2 а.ч.)

  • Монопольные, временные и фоновые продукты. Командные, WIMP- и SILKинтерфейсы. Использование физической и виртуальной клавиатуры, указательных устройств (манипуляторов, сенсорных экранов и др.).
  • Категории пользователей по А. Куперу. Ментальная и системная модель продукта по Д. Норману.
  • Lean Canvas как инструмент моделирования продукта. Сегментация клиентов и описание проблем и решений. Архетипы пользователей и персонажи по А. Куперу.

2.2 Деловая игра. Сегментация пользователей и описание персонажей (2 а.ч.)

  • Формат проведения: в командах по 6 чел.
  • Цель игры (для ведущего): сформировать и закрепить навыки сегментации пользователей продукта и их предварительного психографического описания.
  • Задача игры (для команды): сформировать частично заполненный Lean Canvas продукта (разделы Customer Segments, Problem / Existing Alternatives, Solution, Unique Value Proposition) и описать два персонажа, одного из которых — восстановить для ранее разработанного бумажного прототипа (см. модуль № 1.2).
  • Ожидаемый результат: частично заполненный Lean Canvas продукта и описания двух персонажей.

2.3 Дискуссия. Обсуждение результатов сегментации пользователей и описания персонажей (1 а.ч.)

  • Совместная оценка работ, являющихся результатом игры в модуле № 2.2.

2.4 Дискуссия. Целеориентированное проектирование (GDD) (1 а.ч.)

  • Ценность и значение GDD для команды продукта.
  • Стадии GDD. Мотивы поведения персонажей. Типизация персонажей. Одушевление персонажей: «один день из жизни».
  • Инфраструктура взаимодействия. Современные визуальные языки.

2.5 Деловая игра. Бумажное прототипирование ПИ (Часть 2, 3 а.ч.)

  • Формат проведения: в командах по 6 чел.
  • Цель игры (для ведущего): закрепить навыки бумажного прототипирования ПИ цифрового продукта и применение принципов проектирования ПИ.
  • Задача игры (для команды): описать «один день из жизни» и создать бумажные прототипы одной или несколько основных (и вспомогательных) экранных форм программного продукта (настольного, мобильного или вебприложения) или программно-аппаратного комплекса для удовлетворения конечных целей, информационных и функциональных потребностей ключевого персонажа продукта, впервые введенного в ходе игры в модуле № 2.2.
  • Ожидаемый результат: описание «одного дня из жизни», бумажный прототип одной или нескольких основных (вспомогательных) экранных форм программного продукта или программно-аппаратного комплекса.

2.6 Дискуссия. Строительные блоки ПИ (2 а.ч.)

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

2.7 Дискуссия. Обсуждение результатов прототипирования (1 а.ч.)

  • Совместная оценка работ, являющихся результатом игры в модуле № 2.5.
  • Подведение итогов, закрытие блока № 2.

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

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

Проектирование пользовательского интерфейса – что это такое

UI (User Interface — пользовательский интерфейс) — это внешний вид веб-продукта и одновременно способ взаимодействия пользователя с системой. Чтобы у аудитории не возникало проблем при использовании приложения, функциональные возможности визуализируются в виде понятных элементов — это уже поле деятельности UX-дизайнеров (User Experience).

Процесс проектирования интерфейса

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

Для чего это нужно

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

Экономия времени и денег на UI в дальнейшем станет причиной трат на исправление ошибок и техподдержку.

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

Главные принципы проектирования интерфейса

Удобный и красивый интерфейс = благодарный пользователь. “Красиво” — соответствие современным визуальным нормам. Например, Apple сделала популярным “плоский дизайн” (flat), Google выпустила Material design — это основные тренды. В ближайшее время дизайн будет развиваться в этих направлениях. Понятие ”удобно” предполагает:

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

Соблюдение принципов проектирования помогает выбрать лучший вариант интерфейса, но не гарантирует, что дизайн будет идеальным. Средствами Microsoft Office, например, пользуется более 1,2 млрд человек (это сообщила компания Microsoft в своем аккаунте Twitter). Цели и способы решения задач у этих пользователей могут быть разными, так что сложно учесть все сразу.

Где используется проектирование интерфейса

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

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

Обязанности проектировщика

UXUI-дизайнер проектирует, как пользователь будет взаимодействовать с системой, определяет, как будет выглядеть интерфейс. Эти задачи связаны между собой, но иногда профили UXUI разделяются. В таком случае UX-специалист проектирует максимально простой и удобный для пользователя интерфейс, тестирует и анализирует пользовательские сценарии, продумывает логику, а UI занимает отрисовкой на основе UX-данных, определяет, какими будут элементы интерфейса.

Ключевые обязанности и задачи UXUI-дизайнера включают:

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

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

Что нужно знать разработчику для проектирования

UXUI-разработчик должен понимать принципы юзабилити, знать последние тенденции в области дизайна, особенности оптимизации графики, владеть графическими пакетами, Adobe illustrator, Adobe Photoshop и прочими современным ПО по проектированию и документированию интерфейсов (MS Visio, Axure, Adobe InDesign).

Разработчику интерфейсов нужно обладать широкими знаниями в области фронтенда. UXUI-специалист должен знать HTML+CSS, JavaScript и фреймворки, основы VCS. Такие требования предъявляет к будущим проектировщикам «Яндекс».

Обучение проектированию интерфейса: курсы

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

Интерактивных курсов для UX/UI -дизайнеров на рынке достаточно: обучение действительно предлагают и онлайн-школы, и классические университеты. Разработчику интерфейсов желательно фундаментальное IT- или дизайнерское образование, но UX/UI лучше изучать на курсах.

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

Интерактивные курсы для UX/UI-дизайнеров длятся от нескольких недель до 2 лет. Все зависит от обширности программы, количества практических проектов, подготовки слушателей. Стоимость курсов для проектировщиков пользовательского интерфейса тоже различается в разы. За краткосрочный интенсив нужно заплатить 15-30 тыс. руб. Полноценный курс для новичков стоит 30-80 тыс. руб., а годовая подготовка — 200-350 тыс. руб.

Можно ли изучить самостоятельно

UX/UI-дизайнер Александр Чернушин считает, что людям, которые хотят пойти в дизайн, нужно начинать с развития вкуса и правильного мышления — это можно делать без курсов. Нужно думать, для кого создается продукт и какие задачи решает. Можно прочитать книги Д. Нормана (“Дизайн привычных вещей”), А. Купера (“Алан Купер об интерфейсе”), С. Круга (“Веб-дизайн, или Не заставляйте меня думать”), найти своих UX/UI-гуру (например, топовые агентства Clay и Hello Monday), смотреть, что они делают, следить за трендами и применять их на практике.

Читать еще:  Презентации в powerpoint обучение

Теорию можно изучить самостоятельно, но без практики никуда.

Денис Кортунов, директор по UX в Acronis, рекомендует новичкам решать новые задачи, рисовать концепты, учить новые инструменты. А Павел Горшков, главный дизайнер Redmadrobot, придерживается мнения, что самый верный способ получить не только знания, но и реальный опыт — стажировка в компании, которая хорошо зарекомендовала себя на рынке.

Где искать вакансии разработчикам

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

Евгений Засименко, product-дизайнер в Avito, рассказывает, что начал искать работу за несколько месяцев до окончания обучения. Процесс трудоустройства был стандартным для сферы дизайна: портфолио, тестовое задание, два собеседования. Другой студент курсов, Денис Ушаков, продолжил работу над своим дипломным проектом — разработкой мобильного приложения для агронома-скаутера для компании Exact Farming — уже в штате компании в качестве продуктового дизайнера.

Вакансии появляются на специализированных HR-порталах, в социальных сетях (можно пользоваться поиском, подписаться на тематические группы и интересующие компании — они публикуют предложения в своих блогах). Разовые проекты и удаленную работу можно искать на биржах фриланса. Кстати, просматривать вакансии желательно даже тем, у кого уже есть работа — чтобы быть в курсе происходящего на рынке.

Чтобы найти высокооплачиваемую и перспективную работу, нужно:

  1. Портфолио. Чем более исчерпывающе портфолио показывает дизайнера, тем меньше вопросов будет на собеседовании.
  2. Резюме. Краткое и лаконичное. Ссылка на портфолио в резюме обязательно должна быть кликабельной.
  3. Инициатива. Соискатели, которые пишут на почту арт-директора, СЕО, главы дизайнерского отдела и подобных официальных лиц, запоминаются.

Катя Бурлуцкая, Head of Design в креативном digital-агентстве Facility, рассказывает, что при приеме на работу нанимателя интересуют качественное портфолио и стремление соискателя развиваться. В портфолио желательно включить креативные концепты, какое-то сложное приложение и E-commerce. Работодатель обращает внимание на способность обосновать свое решение с точки зрения удобства для пользователя, чувство стиля и способность создавать целостную визуальную атмосферу.

Зарплата проектировщиков интерфейса

Зарплата проектировщиков сравнима с доходами других специалистов IT-отрасли. Аналитическая служба HeadHunter подсчитала, что компании готовы предложить UXUI-дизайнерам 70-200 тыс. руб. в месяц и более. Согласно данным HR-агрегатора Trud.com, средняя зарплата проектировщика интерфейсов в России — 100 тыс. руб.

Компания Ward Howell, которая занимает поиском квалифицированных кадров и корпоративным управлением, сравнила зарплаты IT-специалистов, трудоустроенных в разных отраслях:

  • UX/UI-дизайнер в интернет-холдинге получает 100-120 тыс. руб.;
  • в e-commerce — 100-140 тыс. руб.;
  • в системном интеграторе — 150-200 тыс. руб;
  • в банках — 130-350 тыс. руб.;
  • в телекоме — 110-250 тыс. руб.

Начальник отдела аналитических исследований в “Сбербанк-Технологии” Алена Ермакова уверена, что большинство компаний все еще воспринимают UX/UI и другие дизайнерские методики просто как услугу, которую можно заказать. Но с ростом конкуренции в разных видах бизнеса и переходом компаний в цифровое измерение мыслить как дизайнер и проектировщик пользовательского интерфейса нужно начинать всем.

Проектирование интерфейсов

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

Методы

UX-воркшоп

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

Концептуальное проектирование

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

Детальное прототипирование

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

Документирование интерфейса

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

Авторский надзор

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

Артефакты

UX-стратегия

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

Концептуальный прототип

Модель взаимодействия пользователя с цифровым продуктом в виде принципиальных схем и эскизов (каркасов) будущих экранов.

Интерактивный прототип

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

Спецификация интерфейса

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

Методы и артефакты

  • Концептуальное проектирование
  • Детальное прототипирование
  • Документирование интерфейса
  • Авторский надзор
  • UX-воркшоп

Концептуальное проектирование

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

Детальное проектирование

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

Документирование интерфейса

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

Авторский надзор

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

UX-воркшоп

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

  • Концептуальный прототип
  • Детализированный прототип
  • Интерактивный прототип
  • Спецификация интерфейса
  • UX-стратегия

Концептуальный прототип

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

Детализированный прототип

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

Интерактивный прототип

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

Спецификация интерфейса

Документ, объединяющий все требования к пользовательскому интерфейсу и функциональности продукта

UX-стратегия

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

Как мы проектируем интерфейсы

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

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

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

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

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

Читать еще:  Product manager обучение

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

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

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

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

Основы проектирования интерфейсов: становимся специалистами, не выходя из дома!

Дата публикации: 2016-12-22

От автора: привет, друзья! Сегодня, в эпоху интернета, хочу рассказать вам про основы проектирования интерфейсов. «Фу, что за скучная тема, кому это может понадобиться?», — подумаете вы. Поэтому сразу попытаюсь обосновать свой выбор. Практически каждый пользователь Всемирной сети, попадая на любой интернет-ресурс, первым делом обращает внимание на комфорт и удобство пребывания на сайте. Не знаю конечно, как вы, но я безумно придирчив к навигации, и в случае если за пару-тройку секунд не вижу в поле зрения необходимые функции, то без капли сомнения покидаю этот сайт и перехожу к следующему. Именно поэтому, если вы имеете собственный интернет-проект, рекомендую особое внимание уделить проектированию интерфейсов. Это поможет вам сохранить существующих клиентов и не потерять потенциальных.

Что такое интерфейс, и зачем он нужен?

Когда речь идет об основах проектирования интерфейсов, в первую очередь, упоминается термин HCI, что в переводе с английского языка означает «взаимодействие пользователя (человека) и компьютера». Пользовательский интерфейс — это коммуникативный канал, по которому происходит взаимодействие человека и компьютера.

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

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

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

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

программа обязана помогать в решении задачи, а не становиться ей;

в процессе работы с программой юзер не должен чувствовать себя глупым;

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

Законы проектирования интерфейсов

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

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

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

соответствие сигнал / шум. В любом HCI есть сигналы (важные элементы) и шумы (бессмысленные маловажные элементы). Конечно же, концентрироваться необходимо на сигналах, а шума — избегать;

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

привычные элементы управления. Используйте привычные для пользователей визуальные образы и элементы управления;

краткость — сестра таланта. Зарубите себе на носу, большинство людей не любит читать гигантские массивы текста, они их всего лишь просматривают;

умное заимствование. Этот принцип гласит: «Не изобретайте велосипед для стандартных вещей»;

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

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

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

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

все необходимое на виду. Все самые полезные и важные элементы HCI должны располагаться на виду и быть выделены соответствующим образом;

правило 3-х кликов. Переход из раздела в раздел должен происходить не более чем 3 кликами. Этот же принцип относится к главной странице: пользователь должен иметь возможность получить всю важную информацию, сделав максимум 3 клика;

принцип мостовых перил. Пользователи должны быть защищены от случайных действий;

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

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

Как стать проектировщиком интерфейсов?

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

Заинтересовались профессией, но у вас нет денег на посещение курсов по проектированию интерфейсов? Не расстраивайтесь и не опускайте руки! Вот вам небольшой перечень базовых навыков, которыми нужно овладеть (старайтесь осваивать их именно в предложенной мной последовательности):

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

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

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

программирование. Изучите основы программирования: принципы объектно-ориентированного программирования, базовый синтез, массивы, циклы и матрицы. Научитесь работать с базами данных и разберитесь в ключевых особенностях разных языков программирования;

СЕО-оптимизация. Любому специалисту, работающему во Всемирной паутине, просто необходимо разбираться в поисковых системах и понимать, как они работают; знать, что такое мета-данные и прочие СЕО-понятия;

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

Может показаться, что большинство из этих навыков вам никогда не пригодятся. Но я настоятельно советую, не ленитесь и никогда не останавливайтесь на достигнутом. Чтобы стать высококлассным специалистом, нужно постоянно развиваться, читать специализированную литературу (Норман Д. «Дизайн привычных вещей», Алан Купер «Об интерфейсе. Основы проектирования взаимодействия», Тидвелл Дж. «Разработка пользовательских интерфейсов») и повышать свою квалификацию. Любая компания с большим удовольствием примет на работу специалиста, идущего нога в ногу с прогрессом.

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

Как создать сайт самому?

Какие технологии и знания необходимы сегодня, чтобы создавать сайты самостоятельно? Узнайте на интенсиве!

Хотите узнать, что необходимо для создания сайта?

Посмотрите видео и узнайте пошаговый план по созданию сайта с нуля!

Ссылка на основную публикацию
Adblock
detector