ВКР (1195834), страница 4
Текст из файла (страница 4)
Обычно решение задач информационной архитектуры требует создания классификационных схем, соответствующих целям приложения, потребностям пользователей и контенту.
Есть два подхода к разработке такой классификации: нисходящий («сверху вниз») и восходящий («снизу вверх»).
Нисходящий подход к созданию информационной архитектуры заключается в ее построении непосредственно на основе целей приложения и потребностей пользователей. Начиная с самых общих категорий будущего контента и функциональных возможностей, необходимых для достижения этих стратегических целей, проводится логическое разбиение категорий на подкатегории. Получившаяся иерархическая структура служит пустой оболочкой для контента и функциональности.
Восходящий подход к построению информационной архитектуры также состоит в выделении категорий и подкатегорий, но при этом в основу ложится анализ контента и функциональных требований. Начиная с имеющегося исходного материала (или того, который будет в наличии к моменту запуска приложения), элементы группируются в категории низшего уровня, а эти категории – в более крупные, чтобы выстроить структуру, отражающую цели приложения и потребности пользователей.
Ни один из этих подходов не лучше другого. При нисходящей разработке архитектуры можно иногда упустить из виду важные детали, касающиеся контента. С другой стороны, восходящий подход иногда приводит к архитектуре, настолько точно подогнанной под имеющийся контент, что ее гибкости не хватает для учета последующих изменений и дополнений. Поэтому необходимо соблюдать баланс между нисходящим и восходящим подходами.
Структура приложения, как и весь опыт взаимодействия в целом, опирается на понимание целей приложения и потребностей пользователей. Если изменяются цели приложения или потребности пользователей, может возникнуть необходимость соответствующей переработке структуры приложения [12].
2.1.5 Уровень компоновки
Компоновка является конкретным воплощением абстрактной структуры приложения.
Компоновка страниц приложения задает расположение кнопок, вкладок, фотографий и текстовых блоков. Компоновка проектируется так, чтобы организация этих элементов была максимально эффектной и эффективной.
На уровне компоновки проводится уточнение структуры, выделяются специфические аспекты дизайна интерфейса и навигации, а также информационного дизайна.
Уровень структуры, определяет, как будет работать приложение, а уровень компоновки определяет, какую форму примет эта функциональность. Помимо конкретизации представления информации, на уровне компоновки решаются вопросы, требующие более глубокой детализации.
Если на уровне структуры вводились общие понятия архитектуры и взаимодействия, то на уровне компоновки рассматриваются преимущественно отдельные страницы и их составные части.
На программной стороне этого уровня компоновка определяется дизайном интерфейса, то есть путем манипулирования кнопками, полями ввода и прочими элементами интерфейса. А информационные среды обладают спецификой, и дизайн навигации – это специализированная ветвь дизайна интерфейса, занимающаяся представлением информационных пространств. Кроме того, через весь уровень компоновки пролегает информационный дизайн, задачей которого является максимально доходчивое представление информации [12].
При хорошо скомпонованном интерфейсе пользователи сразу замечают важную информацию, а не столь важная остается менее заметной, поэтому важной задачей является определить какие аспекты не нужны пользователям и перевести их в разряд неприметных (или исключить вообще).
Дизайн навигации любого приложения должен одновременно решать три задачи:
Во-первых, он должен предоставлять пользователям способ попасть из одной точки приложения в другую. Поскольку во многих случаях связать каждую страницу со всеми остальными невозможно (а если и возможно, то из общих соображений неразумно), приходится подбирать навигационные элементы так, чтобы они упрощали реальные передвижения пользователя.
Во-вторых, дизайн навигации должен отражать взаимоотношения между внутренними элементами навигации. Просто предоставить список ссылок недостаточно. Пользователю необходима информация о том, как эти ссылки соотносятся друг с другом, какие из них могут быть более важными, чем остальные и какая между ними разница. Данная информация позволяет пользователю понять какой он имеет выбор.
В-третьих, дизайн навигации должен отражать связь между содержательной стороной элементов навигации и страницей, которая находится перед глазами пользователя. Информация о том, какое отношение имеют те или иные ссылки к конкретной странице, помогает пользователю понять, какой выбор ему следует сделать, чтобы наилучшим образом достичь своей цели или решить стоящую перед ним задачу.
Информационный дизайн является связующим материалом, который скрепляет другие компоненты дизайна. Однако во всех случаях информационный дизайн сводится к принятию решений о том, как представить информацию, чтобы людям было легче воспринимать и использовать ее [12].
Иногда информационный дизайн подразумевает организацию элементов информации. Часто этот аспект дизайна воспринимается как нечто само собой разумеющееся, потому что большинство привыкло к определенной организации часто встречающейся информации.
Одной из важнейших функций, которую информационный дизайн и дизайн навигации выполняют совместно, является ориентирование.
Система ориентирования пользователей веб-приложения обычно задействует как дизайн навигации, так и информационный дизайн. Навигационные системы, применяемые в приложении, должны не только обеспечивать доступ к различным областям приложения, но и способствовать осознанному осуществлению выбора. Хорошая система ориентирования позволяет пользователям быстро представлять, где они находятся, куда могут перейти и что надо сделать, чтобы приблизиться к выполнению своей цели.
Информационный дизайн, дизайн интерфейса и дизайн навигации, совместно формируют единую конструкцию – макет страницы. Макет страницы должен включать в себя все навигационные системы, имеющиеся в приложении; все эле менты интерфейса, необходимые для использования функциональности этой страницы; а также информационный дизайн, поддерживающий вышеупомянутые элементы и контент страницы [12].
2.1.5 Уровень поверхности
Уровень поверхности представляет собой визуальный дизайн.
Здесь контент, функциональность и эстетика объединяются, создавая законченный продукт, соответствующий всем целям, сформулированным на предыдущих четырех уровнях.
На уровне поверхности, разрабатывается визуальное представление логического порядка элементов, образующих компоновку приложения. Например, занимаясь информационным дизайном, задаем группировку и организацию информационных элементов страницы, а занимаясь визуальным дизайном, определяем, как эта организация будет представлена визуально [12].
2.2 Основные принципы веб-дизайна
Современный веб-дизайн базируется на нескольких основных принципах:
– акцентирование;
– контраст;
– балансировка;
– выравнивание;
– повторения;
– удобство восприятия.
Чем больше внимания уделяется этим принципам, тем более удачным в итоге может получится дизайн. Всегда следует помнить об основах, однако простое следование принципам не гарантирует успеха. Данные принципы нельзя назвать единственно верными для создания успешного дизайна, но они являются основными ориентирами для достижения достойного результата [10].
2.2.1 Акцентирование
Акцентирование – это подчеркивание особой важности или значимости какого-либо элемента. Во многом оно тесно связано с понятием иерархии. Чтобы соблюсти в процессе создания приложения принцип акцентирования, необходимо проанализировать содержимое приложения и выяснить, какая иерархия элементов имеет место в его содержимом.
Чтобы легче было определить, на чем нужно сделать акцент – следует представить перечень элементов, которые требуются на веб-странице. Затем необходимо определить порядок важности этих элементов. В итоге, визуальная иерархия веб-страницы будет отражать важность тех или иных элементов.
Соблюдение данного принципа помогает избежать акцентирования на всем сразу, что может привести к случайной иерархии. При попытке сделать акцент на всем сразу эффект акцентирования пропадает, поэтому необходимо заранее решать, какие именно элементы будут иметь приоритет в визуальном плане [10].
2.2.2 Контрастирование
Контрастирование – это визуальная дифференциация двух и более элементов. Элементы с высокой степенью контрастирования выглядят четкими и обособленными, в то время, как элементы с низкой степенью контрастирования кажутся сливающимися и имеют тенденцию смешиваться в единую массу. Существует множество характеристик элементов дизайна, которыми можно манипулировать с целью достижения необходимой степени контрастирования элементов, включая цвет, размер, местоположение, а также тип и толщину, если дело касается шрифта.
Если элементы дизайна будут контрастировать между собой, это придаст визуальное разнообразие приложению и позволит избежать заурядности в его внешнем виде. Контрастирование также позволяет привлекать внимание, обеспечивая акцент на определенных элементах.
Между основными принципами дизайна имеется взаимосвязь, которая проявляется в том, что контрастирование затрагивает акцентирование, удобство восприятия и прочие принципы дизайна. Самое большое влияние контрастирование оказывает на визуальную иерархию веб-страницы, поскольку оно часто используется для обеспечения желаемого акцента на конкретных элементах.
Таким образом, оно помогает быстро привлекать внимание к ключевым элементам, например, к содержимому, элементам, позволяющим выполнять определенные действия, или к тексту, дающему понять, в чем заключается назначение приложения. Необходимо также принимать в расчет цели, преследуемые приложение, чтобы намеренно привлекать внимание пользователя к соответствующим элементам посредством продуманного контрастирования [10].
2.2.3 Балансировка
Принцип балансировки крутится вокруг идеи о том, как распределены элементы в дизайне и как они соотносятся с общим распределением визуальной нагрузки в рамках веб-страницы. От этого зависит то, насколько уравновешенным окажется дизайн в визуальном плане. Группирование элементов в дизайне создает визуальную нагрузку.
Обычно эта нагрузка уравновешивается путем использования равнозначной нагрузки, находящейся на противоположной чаше «весов», благодаря чему достигается баланс в дизайне. Если не сделать этого, то результатом будет ощущение неуравновешенности дизайна, хотя это не означает, что дизайн обязательно будет плохим. Однако, хорошо сбалансированный дизайн создает тонкое ощущение уравновешенности и, как правило, оказывается более привлекательным.
Баланс бывает двух видов: симметричный и асимметричный. Симметричный баланс в дизайне достигается, когда левая и правая половины дизайна относительно той или иной оси являются как бы зеркальными копиями друг друга и несут идентичную визуальную нагрузку. Как правила, это характерно для приложений, где логотип и верхнее меню визуально располагаются по центру.
Асимметричный баланс достигается, когда визуальная нагрузка в рамках веб-страницы равномерно распределяется по той или иной оси, однако, отдельные элементы двух составляющих дизайна не являются зеркально одинаковыми.
Балансировка является одним из тонких аспектов дизайна, к которому большинство приходит инстинктивно [10].
2.2.4 Выравнивание
Выравнивание достигается путем упорядочивания элементов таким образом, чтобы они максимально близко подступали к естественным линиям или границам, которые они образуют. Это позволяет унифицировать элементы. Данный процесс часто называют работой с сеткой. Невыровненные элементы могут выбиваться из общей группы, что способно разрушить гармоничное расположение элементов относительно друг друга. К примерам выровненных элементов можно отнести расположенные по одной линии заголовки двух столбцов, либо левые края элементов, находящихся друг над другом, выровненные относительно друг друга.
Эти примеры довольно очевидны, однако на веб-страницах возможны и намного более замысловатые выравнивания, которые позволяют добиться унифицированного и привлекательного дизайна [10].
Выравнивание элементов интерфейса может оказывается достаточно сложным процессом. Однако проблема заключается не только в самой процедуре, но также и в том, что эти детали очень легко упустить из виду. Поэтому знание того, что необходимо соблюдать принцип выравнивания, является немаловажным для веб-разработчика при реализации дизайна в коде.
2.2.5 Повторение
Повторение предполагает неоднократное использование в дизайне одних и тех же элементов разными способами. Дизайн, который содержит повторения, становится унифицированным. Повторение может выражаться во множестве форм, включая использование того же цвета, очертаний, линий, шрифтов, изображений и общего подхода к стилизации.
Зачастую соблюдение данного принципа оказывается неизбежным, поскольку если дизайн не включает в себя повторяющихся элементов, то это обычно свидетельствует о том, что он лишен логической связанности. Повторение несет в себе такое огромное преимущество, как предсказуемость. Пользователь ожидает увидеть уже знакомые ему вещи, если в ключевых элементах дизайна прослеживаются согласованность и постоянство.
Иногда бывает, что приложение теряет свою визуальную связанность из-за того, что на каждой его странице дизайнер использует совершенно разные подходы к оформлению, вместо того, чтобы выработать какую-то одну методику и брать ее за основу [10].
2.2.6 Удобство восприятия
Восприятие главным образом зависит от того, на чем дизайнер сделал акцент и в какой мере он обеспечил контрастирование элементов между собой. Фактически удобство восприятия всецело будет зависеть от того, как дизайнер скомпоновал все элементы страницы.
Для обеспечения удобства восприятия, необходимо помнить о естественном порядке вещей. Согласно исследованиям, люди склонны осматривать те или иные вещи в предсказуемой манере. Например, обычно человек осматривает содержимое слева направо и сверху вниз. Именно поэтому, если приложение навязывает обратный порядок, то это может отталкивать тех, кто привык следовать определенным правилам.
![](https://s.studizba.com/z.php?f=/templates/si/i/noavatar.png&w=100&h=100&t=1"){kind=avatar}
