Руководство по цифровому проектированию

Александр Волошин на сайте UX CLAN опубликовал большое руководство по дизайну. С его разрешения мы публикуем его на AppTractor.ru. Если вы хотите узнать больше и получить практические навыки по проектированию цифровых продуктов, то можете также пройти его интернет-тренинг DIGITAL PRODUCT DESIGN.

Так же как и многие начинающие дизайнеры, я лихорадочно осваивал только программы и инструменты, и совсем не думал о методологии, из-за чего и испытал на себе все тяготы дизайнерской работы, как на фрилансе, так и в различных дизайн-студиях и айти-компаниях. Однажды я решил разобраться во всем и разработать простой в освоении и гибкий алгоритм, в результате чего и родилось это пособие. В его основе лежат методологии Human Centered Design и Design Thinking, богатый личный опыт работы над проектами разной сложности, а так же понимание специфики работы мозга. Эта статья является копией страницы на моем сайте http://ux-clan.org/weapon/.

Часть первая. Поиск силы

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

Человеческий мозг

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

Кроме того, есть два режима мышления: сфокусированное и рассеянное. Сфокусированное мышление применяется тогда, когда нужно сосредоточиться на какой-либо информации, проанализировать и изучить её. Рассеянное мышление применяется, когда нужно придумать что-то новое, сгенерировать идеи. В рассеянном режиме мозг способен обдумывать то, над чем мы не сосредоточены в данный момент, то есть задействовать подсознание. В сфокусированном режиме мы используем рабочую память, а в рассеянном — долгосрочную.

Твой мозг обладает потрясающими способностями, но к нему не прилагается руководство. Вот основные моменты, которые нужно понимать о мозге:

• мозг эффективно работает только над одной задачей;
• головой надо думать; для запоминания есть другие инструменты;
• рабочая память — это пространство, где мы думаем;
• когда мозг думает, он тратит энергию. Мозг устает думать через 40 минут, потому что заканчивается энергия;
• много думать над одной задачей плохо и неэффективно, и если вам нужно что-то придумать, нужно думать мало;
• мозг в течение рабочего дня думает максимум 2–3 часа;
• чтобы мозг отдохнул, нужно не думать и не нагружать его вообще ни чем, то есть потупить;
• отделяем «думать» от «делать», то есть думаем только в момент принятия решения, потом делаем и не думаем в этот момент;
• любое дело мы дробим на задачи;
• хорошо составленная задача не заставляет думать, с чего начать и отвечает на вопрос: «Что нужно сделать?»;
• разложить все по местам и освободить мозг.

Подсознание

Подсознание человека похоже на автономный компьютер, в котором все вычислительные процессы проходят незаметно для хозяина. Это значит, что оно способно работать над задачей даже тогда, когда вы не сфокусированы на ней. В этом и заключается вся его мощь. Хотя ученые продолжают изучать работу подсознания не одну сотню лет, мало кто из них способен внятно объяснить, как оно устроено. На сегодняшний день уже точно установлено, что наше подсознание понимает только конкретные команды и образы. То есть, если ты хочешь что-то получить и чего-либо достичь, тебе нужно сначала это представить, помечтать об этом, описать словами, в общем нарисовать яркую картинку в своем воображении. Если загонять в подсознание невнятные образы, если ты не понимаешь, что хочешь получить, то и результат будет соответствующим.

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

Продукт как цель

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

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

Часть вторая. Управление силой

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

Дизайн-мышление

Дизайн-мышление — это такая методология решения проблем в условиях неопределенности и работы с нестандартными задачами. Ценность методологии заключается в том, что она заточена на работу с «неявным знанием» потребителя, который не в состоянии осознать и вербализировать свои проблемы и потребности, а также помогает находить инновационные решения. Это тот случай, который описывал Генри Форд в своем знаменитом высказывании: «Если бы я спросил людей, чего они хотят, они бы попросили более быструю лошадь». Апологетом дизайн-мышления является компания IDEO, которая специализируется на разработке инновационных продуктов для крупных компаний.

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

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

Что есть?
Исследуется существующая реальность.

Что если?
Представляется новое будущее, генерируются идеи.

Что цепляет?
Делается определенный выбор из предложенных идей.

Что работает?
Проводится тестирование и вывод продукта на рынок.

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

Проходя по этапам мы то расширяем поток информации, используя дивергентное мышление (лат. diverge — расходиться), то фокусируемся на самом важном, используя конвергентное мышление (лат. convergere — сходиться). Дивергентное мышление — это то же самое, что и рассеянное мышление; применяется, когда нужно придумать что-то новое, сгенерировать идеи. Конвергентное мышление — это сфокусированное мышление; применяется когда нужно сосредоточиться на какой-либо информации, проанализировать и изучить её, принять решение. Коротко рассмотрим каждый этап.

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

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

Фокусировка на проблеме
После сбора информации определяем проблему, которую нужно решить, и фокусируемся на ней.

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

Выбор идеи
Анализируем идеи и выбираем ту которая должна решить проблему.

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

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

Реализация
Когда тестирование проведено успешно можно приступать к реализации, то есть ставить задачу программистам и дизайнерам.

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

Три уровня дизайна

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

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

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

Рабочий процесс

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

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

Итерации и жизнь продукта

Выше были описаны шаги для одной итерации которая представляет собой один цикл работы над продуктом. Первая итерация начинается с исследований и заканчивается выпуском первой версии продукта. В стартапах это так называемый минимально-жизнеспособный продукт (MVP от англ. minimum viable product) который позволяет без больших затрат проверить гипотезу и получить обратную связь.

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

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

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

Часть третья. Применение силы

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

Дизайн продукта

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

В процессе проектирования нужно всегда помнить о трех основных составляющих, которые лежат в основе любого цифрового продукта: бизнес-требования, пользовательские требования и используемые технологии. Именно из этих трех составляющих и получается хороший продукт, то есть UX (англ. User eXperience — пользовательский опыт взаимодействия). Любой правильно настроенный процесс должен помогать дизайнеру постоянно держать в фокусе эти составляющие, иначе есть большой риск заблудиться в информации и пойти не в том направлении. На первом этапе проектирования мы опираемся на эту информацию, поэтому так важно уделить процессу сбора информации особое внимание. Почему это так важно поможет понять такая легенда: однажды Эйнштейна спросили, как бы он потратил час времени, выделенный на решение трудной задачи, и он ответил, что потратил бы 55 минут на определение задачи и её альтернатив, а 5 минут — на её решение.

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

1. Определить конечные цели и потребности бизнеса.
2. Узнать кто конечный пользователь продукта, определить каковы его цели и потребности, с какими проблемами сталкивается сейчас и как он их решает.
3. Описать персонаж пользователя на основе полученных данных и держать его перед глазами в течение всей работы над проектом.
4. Изучить существующие технологии которые используются в данной предметной области.
5. Изучить уже существующие решения и конкурентов.
6. Проанализировать полученную информацию и сгенерировать идеи.
7. Описать требования к будущему продукту.
8. Описать будущий опыт работы с продуктом с помощью пользовательских сценариев и сторибордов. Нужно охватить все ключевые сценарии, должно быть понятно как работает продукт.
9. При необходимости, составить диаграммы потоков задач опираясь на ключевые пользовательские сценарии.
10. Сделать первые концептуальные наброски.

[notice]

Контрольная точка

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

[/notice]

Дизайн взаимодействия

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

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

1. Выявить и записать абсолютно все сценарии использования.
2. Составить информационную структуру продукта (разбивка по экранам/страницам).
3. Описать функционал и информационное наполнение для каждого экрана/страницы.
4. Проработать несколько прототипов будущего продукта.
5. Провести эвристическую оценку интерфейса.
6. Провести пользовательское тестирование прототипа и внести правки.
7. Составить карту навигации на основе сценариев и прототипа.

[notice]

Контрольная точка

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

[/notice]

Дизайн графического интерфейса

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

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

1. Определить общее настроение, тон визуальной и текстовой коммуникации на основе исследований целевой аудитории.
2. Проработать несколько вариантов графического оформления для ключевых экранов.
3. Выбрать один вариант и проработать все экраны.
4. Проработать эффекты и анимацию.
5. Подготовить графику для вёрстки и руководство для программистов.
6. Проверить результаты работы программистов.

[notice]

Контрольная точка

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

[/notice]

Рабочий процесс и документация

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

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

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

Если вы нашли опечатку — выделите ее и нажмите Ctrl + Enter! Для связи с нами вы можете использовать info@apptractor.ru.

Пример проектирования цифрового устройства «на пальцах»

Привет, Хабр! Это начало небольшого цикла из двух статей с пошаговым проектированием цифрового устройства с уклоном на практику. Минимум «воды» и максимум практики!

Для начала работы возьмем следующие выходные параметры: 0000110001110001

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

Инструменты, материалы и прочее:

• Electronics Workbench
• Линейка, ручка и листок (для общих расчетов)
• Базовые знания дискретной математики, цифровой схемотехники и принципа работы представленных программ
• Условное графическое обозначение микросхем 7404 (аналог К155ЛН1), 7410 (аналог К155ЛА4), 7410 (аналог К155ЛА4) и 7420 (аналог К155ЛА1)
• Фактическое изображение микросхем 7404 (аналог К155ЛН1), 7410 (аналог К155ЛА4), 7410 (аналог К155ЛА4) и 7420 (аналог К155ЛА1)

Начало работы

1. Построение таблицы истинности и нахождение совершенной дизъюнктивной нормальной формы (СДНФ)

Первым делом необходимо составить таблицу истинности по формуле

где N – количество возможных вариантов, а i – количество выходных сигналов.

В представленном случае это будет выглядеть так:

На основе полученных данных можно перейти к построению таблицы истинности. Для наглядности входные сигналы были обозначены как A, B, C и D, выходной как F.

После построения таблицы истинности можно приступать к получению СДНФ. Это выполняется в два шага:

1. Выделяются строчки таблицы истинности, в которых F=1.
2. Выписывается конъюнкция переменных у всех выделенных строк по следующей формуле: если значение переменной равно 1, то в конъюнкцию включается сама переменная. Если значение равно 0, то включается отрицание переменной. Полученные конъюнкции нужно связать в дизъюнкцию.

По итогу выходит такая СДНФ:

2. Создание карты Карно, минимизация и приведение к базису И-НЕ

Полученную СДНФ необходимо сократить при помощи карт Карно.

Три шага для построения карт Карно:

1. так как используются четыре переменные (A, B, C и D), то строится таблица 5×5 клеток;
2. таблица заполняется на основе «координат» из таблицы истинности (из строк, в которых F=1) или СДНФ (суть одна. Просто кому как удобнее);
3. в заключение смежные клетки объединяются в группы. Группы не должны содержать нули. Группы должны быть кратны двум. Группы могут пересекаться.

В итоге получилось 4 группы:

Следующее действие — минимизация полученных групп. Общий принцип можно свести к следующему:
Если 11 — значение не меняется;
Если 00 — присваивается отрицание;
Если 01 (или 10) — вычеркивается.

Полученные произведения связываются в дизъюнкцию:

После чего составленное выражение приводится к базису И-НЕ при помощи закона де Моргана (отрицание конъюнкции есть дизъюнкция отрицаний, отрицание дизъюнкции есть конъюнкция отрицаний):

Обратите внимание на изменения — появилось двойное отрицание (по одной на «группу» и одно общее) и изменились знаки.

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

Пример логической схемы:

3. Электронная схема на основе логических элементов

Основные расчеты завершены. Теперь можно отложить листок с ручкой и линейкой. Переходим в Electronics Workbench.

В данном случае этот этап выступает «промежуточным» и упрощает процесс перехода от выражения в базисе И-НЕ к электронной схеме на основе микросхем.

Как можно заметить, логические элементы электронной схемы внешне отличаются от тех, что были представлены ранее (в логической схеме). Это связано с тем, что в Electronics Workbench условное графическое обозначение логических элементов выполнено по стандартам ANSI, тогда как показанная ранее логическая схема была выполнена в соответствии ГОСТ 2.743-91.

Идем дальше.

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

и начать производить переключения, проводя сравнение с таблицей истинности.

Пример:

ВАЖНО: нужно проверять каждую строчку. Выборочная проверка ничего не даст.

4. Электронная схема на основе микросхем

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

Как можно заметить, в полученной электронной схеме использовано 4 микросхемы — 7404 (аналог К155ЛН1), 7410 (аналог К155ЛА4), 7410 (аналог К155ЛА4) и 7420 (аналог К155ЛА1). Для того чтобы понять, как происходит подключение, следует обратиться к фактическому изображению микросхем.

Сначала это может показаться сложным, но со временем вы поймете, что это не так уж и трудно.
ВАЖНО: не забывайте делать проверку.

Продолжение следует…

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

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

Этап 1: Стейкхолдеры 

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

Этап 2: Формирование и проверка гипотез ценностного предложения 

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

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

Процесс выглядит таким образом: проводим совместный воркшоп с целью описания главных гипотез и потребностей стейкхолдеров, после этого проводим интервью для детального исследования целей и задач. Этап как правило занимает 8–10 дней.  

Этап 3: Выбор бизнес-модели и просчет юнит-экономики 

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

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

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

Такие вычисления позволят стартапу приступить к созданию цифрового продукта. 

Этап 4: Бэклог, разбивка на спринты, формирование стека технологий и состав команды 

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

Зачастую эти тач-поинты включают в себя: 

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

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

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

Обычно этот этап занимает от 5 до 10 дней в зависимости от объема планируемой разработки. 

Этап 5: UХ-прототип, отрисовка основных сценариев 

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

Вначале разрабатываем карту экранов и карту смены состояний и действий, за ними следует отрисовка сценариев на уровне вайерфреймов. 

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

Этап 6: Фиксация плана и передача в разработку 

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

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

1. Детально отрисовываем UI и создаем кликабельный прототип. Для этой цели чаще всего используется Figma – в ней будет комфортно и дизайнерам, и разработчикам. Важно продумать непопулярные кейсы в UX – если этого не делать, то с ними могут столкнуться позже разработчики и это приведет к потери времени. 
2. Разрабатываем back-end. Начинаем с разработки документации API, после чего запускается написание кода. 
3. Мобильная разработка. Полноценно стартует после согласования кликабельного прототипа. По опыту, команде стартапа будет важно приступить к первым фазам разработки уже во время согласования дизайна.

МИНОБРНАУКИ
РОССИИ

Федеральное
государственное бюджетное образовательное
учреждение высшего профессионального
образования

«Самарский
государственный технический университет»

О. В. Лысенко

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

Учебно-методическое
пособие по курсовому проектированию

Сызрань
2013

УДК 621.3

Р е ц е н з е н т:: канд.
техн. наук Н.Н. Р о д и о н о в,

Лысенко О.В.

Проектирование
цифрового устройства:
Учебно-метод. пособ.. по курсовому

проектированию
/О.В.Лысенко; Самар. гос. техн. ун-т, филиал
в г.Сызрани,

Сызрань, 2013,
с.22.

Представлены
методические
указания
по
курсовому проектированию в соответствии
с программой дисциплин «Цифровая
схемотехника», «Схемотехника
высокопроизводительных систем».
Рассмотрен пример проектирования
цифрового
устройства в среде Multisim.

Пособие
предназначено для студентов вузов,
обучающихся по напрвылению подготовки
бакалавров 230100 «Информатика и
вычислительная техника» и профилю
подготовки «Вычислительные машины,
комплексы, системы и сети»

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

Допущено научно-методическим советом
электротехнического факультета

к использованию в учебном процессе
(протокол № от)

Предисловие

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

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

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

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

Пособие
восполняет недостаток учебно-методической
литературы в области компьютерного
моделирования цифровых устройств

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

Введение

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

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

В
настоящее время при практическом
изучении основ цифровой электроники в
технических вузах наряду с традиционными
лабораторными стендами применяются
различные компьютерные программы.
Наиболее
известные
из
них
— это
Multisim, Еlectronics
Workbench, Micro-Cap, Desine Center,. Эти
программы помогают восполнить недостаток
функциональных возможностей физического
моделирования.
Также
использование
виртуальных стендов в учебном процессе
соответствует современным требованиям
подготовки специалиста.

Наиболее
распространенным пакетом для
схемотехнического моделирования
является программа Multisim американской
компании National Instruments. Она широко
применяется и в отечественном образовании.

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

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

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

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

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

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

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]

• #
• #
• #
• #
• #
• #
• #
• #
• #
• #
• #

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

Мы — Red Collar. Если вы о нас слышали, то, наверняка, в первую очередь как о диджитал-агентстве.

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

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

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

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

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

Продуктовая разработка: заказчики

Всё начинается с идеи.

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

Весь этот опыт мы объединили и конвертировали в небольшую классификацию.

Стартапы

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

Переход бизнеса в цифру

Есть заказчики, которые хотят полностью или частично перевести в «цифру» уже работающий офлайн-бизнес.

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

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

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

Работа с готовым бизнесом и рефакторинг

Мы берём готовые продукты и улучшаем их.

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

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

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

Этапы создания цифровых продуктов

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

Предпроектная аналитика

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

Тут начинают работу сразу две команды Red Collar: бизнес-аналитики и маркетологи.

Состав исследований и задач меняется от проекта к проекту и подбирается под конкретный запрос, но есть своего рода «золотой стандарт» этапов: брифинг, изучение бизнес-процессов, описание целей и желаемого состояния продукта, исследования целевой аудитории и окружения, валидация гипотез и выбор лидирующей гипотезы. Иногда сюда добавляется просчет монетизации.

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

Весь этот объём информации позволяет перейти к проектированию сервиса и определению состава MVP (минимально жизнеспособного продукта), где бизнес-аналитики описывают функциональные и нефункциональные требования, текущие («As Is») и целевые («To Be») состояния продукта, ролевую модель пользователей и карту сервиса.

И теперь, наперевес с чётким пониманием концепции, переходим к этапам, в которые постепенно включаются дизайнеры.

Совмещаем аналитику и визуал: вайрфреймы и прототипы

Вайры

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

Прототипы

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

Проектируем архитектуру приложения

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

Создаём дизайн-концепцию

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

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

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

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

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

Что будет в следующих сериях?

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

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

Вместо итогов

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

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

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

Поэтому при работе с такими задачами мы стараемся глубоко погрузиться в бизнес клиента, становимся не только подрядчиком, но и консультантом, что позволяет понимать очень тонкие детали. Тем и ценны такие проекты: мы расширяем свою доменную экспертизу, заказчик получает сервис высокого уровня и работающий бизнес. Win-win.