Описание бизнес модели сайта

Оригинальное название: Elements of User Experience.
Переводчик: Александр Качанов

Введение

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

Пять уровней

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

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

Проектирование требований к ИС, ТЗ, ТЭО и бизнес модели сайта. Попов 02ВТд4010м

Поверхность

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

Схема

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

Структура

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

Рамки

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

Моушн-дизайн в 17 лет: создаю рекламы для Xiaomi в Cinema 4d

Стратегия

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

От фундамента к крыше

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

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

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

Решения, принимаемые на каждом уровне, влияют на набор решений, которые можно принять на следующих уровнях

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

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

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

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

Двойственность

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

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

А какая между ними разница? Существует ли она?

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

Когда Web находился только в зачаточном состоянии, в нем главенствовал гипертекст. Люди создавали документы и соединяли их гиперссылками. Тим Бернерс-Ли — изобретатель Web-а — создал систему для того, чтобы специалистам-физикам, разбросанным по всему миру, было легче обмениваться документами и связывать их друг с другом.

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

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

Развитие технологии продолжалось на обоих фронтах по мере того, как все больше и больше сайтов переходило от простого набора редко обновляемых статических документов к динамически развивающимся хранилищам данных. Когда сформировалось сообщество людей, занимающихся веб-дизайном, они вдруг обнаружили, что говорят на различных языках. Одна группа рассматривала каждую проблему с точки зрения дизайна приложения и предлагала решения, традиционные для разработки обычных компьютерных программ (которые в свою очередь были переняты из других сфер производства будь то автомобилестроение или изготовление кроссовок). Другая же группа рассматривала Web с точки зрения распространения и сбора информации, и предлагала решения, характерные для индустрии печати, СМИ и теории информации.

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

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

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

Модель сайта

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

Уровень стратегии

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

Целями сайта могут быть например коммерческие показатели («Заработать на сайте за год 1 миллион долларов») либо что-то другое («Проинформировать посетителей о нашем кандидате на выборах»). В Главе 3 мы более подробно рассмотрим эти элементы.

Уровень рамок

С программной стороны стратегия трансформируется в рамки путем создания функциональной спецификации: подробного описания набора функций на вашем сайте. С информационной стороны рамки определяют наполнение сайта: описывают что будет представлено на сайте. Об этих элементах речь пойдет в Главе 4.

Уровень структуры

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

Уровень схемы

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

Уровень поверхности

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

Использование элементов

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

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

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

Стоит упомянуть о двух дополнительных темах, которые мы не будем здесь подробно рассматривать. Первое — это контент. Старая поговорка (старая для Web-а) гласит «главное в Web-е — это контент». Это абсолютная правда — самое главное, что Web может предложить своим пользователям, это интересующий их контент.

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

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

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

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

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

Ищете исполнителя для реализации проекта?

Проведите конкурс среди участников CMS Magazine

Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.

Источник: cmsmagazine.ru

Как донести концепцию и видение сайта до разработчиков

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

С чего начинается концепция

Концепция – это система взглядов на решение какой-либо задачи.

ПРИМЕНИТЕЛЬНО К ВЕБ-РАЗРАБОТКЕ, КОНЦЕПЦИЯ – ЭТО ОПИСАНИЕ КЛЮЧЕВЫХ ПАРАМЕТРОВ САЙТА. К НИМ, В ПЕРВУЮ ОЧЕРЕДЬ, ОТНОСЯТСЯ ЦЕЛИ, КОТОРЫЕ ПРЕСЛЕДУЕТ ВЕБ-РЕСУРС.

Целями могут быть:

увеличение прибыли;
повышение узнаваемости бренда;
информирование покупателей;
продажи через интернет;
поиск новых клиентов;
проведение маркетинговых исследований;
Увеличение посещаемости сайта;
улучшение имиджа компании.

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

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

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

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

Что учитывать при построении концепции

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

Целевая аудитория. От нее во многом зависят дизайн , концепция сайта и его наполнение;
Особенности бизнеса. Не каждая коммерческая деятельность способна полноценно функционировать онлайн без соответствующих коррективов;
Бизнес-модель сайта. Необходимо решить, насколько веб-пространство будет вовлечено в бизнес-процессы;
Величина бюджета. Влияет на уровень квалификации исполнителей и качество конечного продукта;
Конкурентные преимущества. Чем компания лучше или хуже конкурентов;
Уникальное предложение. Какие условия сотрудничества предлагает фирма своим клиентам, и чем они отличаются от аналогов.

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

Как оценить концепцию

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

В проверке концепции должны участвовать как минимум три стороны:

заказчик;
разработчик;
пользователь.

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

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

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

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

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

Как донести концепцию до разработчика

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

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

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

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

Если Вам понравилась статья — ставим лайк и делимся ей в социальных сетях. Хотите получать больше полезных статей? Подпишитесь на рассылку. Раз в неделю пишем коротко про интернет-маркетинг.

Источник: dzen.ru

Разработка бизнес-модели веб-сайта

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

Функциональная часть модели

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

Например, выкладывать, группировать и комментировать фотографии (социальная сеть) или заказывать и оплачивать товар (интернет-магазин).

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

Если придуманная функция не решает ни одну из задач — это может означать, что она лишняя.

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

Формирование информационной структуры

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

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

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

Источник: onepix.ru