что такое дизайн системы визуальной навигации
Городской дизайн: 4 лекции о создании схем навигации в метро и не только
Был недавно в Прожекторе, где собрались дизайнеры (руководители проектов) которые занимались улучшением навигации в метро (и не только в метро) в Москве и Киеве.
Из Москвы на эту сессию лекций приехал Алексей Радченко, который руководил разработкой системы единой транспортной навигации для Москвы (и в метро тоже) в 2014 году.
В лекциях пойдет речь о том:
— что такое навигация?
— какой она должна быть?
— как ее сделать удобной и понятной для людей и как ее постоянно улучшать?
— как взаимодействовать со всякими «железобетонными» по образу мысли госорганами, которые отвечают за навигацию?
— примеры дизайна навигации из других городов
— ребята из «Агентов змин» рассказали о том как они создавали схемы навигации для киевского метро
— как работают студии (не Лебедева), которые специализируются на разработке и дизайне навигационных схем для городов?
и о многом другом касательно дизайна городской среды в плане навигации. Лекция сверстана со слайдами, чтобы можно было сразу наглядно видеть примеры того, о чем говорит докладчик.
Лекции будут интересны всем, кто интересуется дизайном вообще, городским дизайном и дизайном навигационных схем в частности. Также лекции будут интересны менеджерам проектов, так как все, что связанно с проектами городского дизайна требует большего искусства в управлении, чем в обычных бизнес-проектах. Чего только стоит постоянная работа с госорганами и утверждение всех проектов в этих ведомствах.
Лекция о создании единой транспортной навигации в Москве в 2014 году
Ребята из Агентов змин рассказали о том, как они создавали схемы для Киевского метро. Особенно интересно то, как ребята исследовали вопрос: как собирали информацию, как работали «в поле», как составляли принципиальную схему ТПР (точек принятия решений) и т.д.
Лекция Юрия Грановского о разработке сценариев для систем навигации, на примере редизайна схем киевского метро. Особенно интересной была схема, которую они разработали для ключевых станций киевского метро. Например, стоит человек перед переходом и сколько у него есть вариантов действия: 3? 4? 10? И особенно мне понравилось что, оказывается, не только мне казалось что переходы между Крещатиком и Майданом Незалежности непонятны никому, особенно приезжему, а тот, кто давно там не был, каждый раз мучительно вспоминает — а в какой же переход пещеру нырять (и самое главное из этой пещеры потом не выйдешь)? И количество тех, кто ошиблись переходом очень велико, не один я такой оказывается!
Особенно мне понравилась эта схема точек ТПР — не ожидал что их может быть так много. 
Игорь Скляревский в связке с предыдущей лекцией рассказал о том, как они исследовали вопрос, потому как сидеть в кабинете и разрабатывать дизайн для метро хорошо, но будет лучше если это сделать своими ногами, т.е. своими ногами (телом) измерить расстояние/время перехода со станции на станцию и т.д. Сногсшибательным открытием для меня было то, что те тетечки, которые дежурят на таких узловых станциях отвечают до, кажись, 500 вопросов в день от пассажиров подземки «Как проехать туда-то?», хотя вроде бы и схемы есть (информация) — но они не работают. Для исследований ребята прикинулись такими «потеряшками» чтобы узнать, что нужно человеку, который хочет комфортно пользоваться киевским метрополитеном. Затем они надели на себя жилетки с буквой «и» и были такими волонтерами, которые помогали таким «потеряшкам» найти дорогу, и, соответственно, фиксировали все запросы — очень интересная статистика!
Вторая лекция Алексея Радченко о картах и промдизайне для городского дизайна. Пару слов о картах, о том, почему электронные карты для офлайн-навигации не годятся, о том какие они должны быть, потом очень большая и интересная часть о том, из каких материалов делаются указатели/таблички/табло и т.д. о том, какие носители для каких целей используются — от носителя зависит его использование, немаловажный момент — цена этих носителей для города, взаимозаменяемость. Все это с примерами, не только из Киева/Москвы, но и других городов.
Что такое дизайн системы визуальной навигации
Зачастую здания учебных заведений занимают несколько этажей с разными лестницами, многочисленными переходами и коридорами. Ориентироваться в них новому человеку, будь то вновь принятый сотрудник, гость, родитель или ученик (студент) очень непросто. Комфортность первых посещений напрямую зависит от возможности самостоятельно разобраться и найти нужное помещение, аудиторию.
Система внутренней навигации — это комплекс указателей, табличек, интерактивных дисплеев и других элементов, облегчающих свободное ориентирование. Визуальная навигация– система визуально-графических знаков и решений, призванная решать задачи обеспечения ориентации, регулирования поведения человека в конкретных предметно-пространственных ситуациях. Грамотно спроектированная внутренняя навигация помещений структурирует пространство и позволяет человеку ощущать себя физически и психологически комфортно. Помимо этого профессионально спроектированная внутренняя навигация органично вливается в интерьер, делая его уникальным, современным, единым стилем связывая в одно целое помещения отдельных блоков.
Система и цели навигации
Система навигации делится на внешнюю и внутреннюю навигацию. Для уличной навигации изготовляют адресные таблички, указатели, флаги и стеллы. Они служат для идентификации школы, обозначения входов, мест парковки и подъезда обслуживающего транспорта. Дорожная навигация предполагает использование дорожных знаков и указателей.
Система внутренней навигации помогает воспитанникам, гостям и сотрудникам ориентироваться внутри здания. Она состоит из навигационных элементов, таких как различные знаки, идентификаторы зон, подвесные и настенные таблички, стенды и указатели и помогает воспитанникам, сотрудникам и посетителям ориентироваться в учреждении. Чтобы внутренняя навигация была эффективной она должна разрабатываться исключительно под определенный объект.
Таблички у входа и в переходах между зданиями образовательного учреждения содержат максимум информации и предназначены для посетителей, впервые оказавшихся на территории учреждения. Обычно они указывают на местонахождение кабинетов или необходимое направление.
Навигационные элементы делятся на указатели, которые работают на большом расстоянии и вблизи. От этого зависит размер текста и самой конструкции. Указатели ближнего радиуса действия могут быть набраны небольшим шрифтом, чтобы человек смог прочесть надписи, подойдя к ним. Указатели дальнего действия набираются крупным шрифтом, и их видно издалека. Также существуют комбинированные указатели, заголовок которых находится в зоне дальнего действия, а подробная информация набрана мелко.
На каждом этаже нет необходимости представлять все школьные помещения. Здесь достаточно указать диапазон порядковых номеров учебных кабинетов и направление к нескольким местам массового притяжения. Настенные таблички подсказывают посетителям школы, где располагаются те или иные кабинеты. На таких табличках размещается много текста, набранного некрупно, поэтому эти элементы предназначены для чтения с близкого расстояния и их нужно вешать на линии глаз читающего.
Место размещения навигационных элементов
Навигационные указатели размещают в так называемых местах принятия решений — ключевых точках, в которых посетителю необходимо определиться, в каком направлении двигаться дальше. Список мест принятия решений включает:
• холл;
• лестницы;
• вход на этаж;
• развилки в коридорах;
• переходы в разные блоки (крылья) здания.
В этих местах размещение навигационных элементов обязательно.
Основные типы визуальных навигационных изделий и продукции
Элементы навигации являются не только носителями информации, но и выполняют роль своеобразной рекламы. Ведь грамотно выполненные и правильно размещенные указатели внутри помещения могут существенно улучшить мнение посетителей, учеников или студентов. Для визуальной навигации изготовляют:
1. Информационные таблички.
a. Настенные вывески и таблички. Самый простой и распространенный способ размещения информации. Они могут быть выполнены из различных материалов, таких как пластик, металл, стекло. Одним из вариантов настенной навигации является нанесение навигационного дизайна непосредственно на стену, обычно с помощью краски или пленки.
b. Подвесные конструкции (мобайлы). Могут быть как плоскими, так и объемными, с подсветкой и без нее.
2. Планы этажей обычно выполняют настенными, но могут размещаться и на отдельно стоящих напольных конструкциях (стеллах). На них обычно размещают информацию, которая содержит в себе много деталей, и в связи с этим, требует внимательного изучения со стороны посетителя.
3. Указатели эвакуационных выходов на фотолюминесцентной основе, должны быть в каждом учреждении. В соответствии с законом все аварийные выходы оснащаются надлежащим знаком, а сами указатели должны размещаться там, где поворачивает коридор и по всему пути эвакуации.
4. Напольные наклейки и стикеры для навигации служат в качестве указателей направления движения.
5. Адресные указатели. Обеспечат хорошую видимость в пасмурную погоду при изготовлении на светоотражающих материалах.
6. Дорожные указатели и таблички. Изготовление уличных указателей для навигации поможет родителям, да и самим реальным или потенциальным учащимся безошибочно и легко найти дорогу к учреждению. Они устанавливаются возле проезжей части, что позволяет информировать участников дорожного движения, автомобилистов и пешеходов о существовании образовательного заведения и о месте его нахождения. Указатели рекомендуется устанавливать на небольшом удалении от учреждения. Это позволит целевой аудитории в ближайшее время рассмотреть вопрос об обучении именно в этом учреждении.
Требования к материалам.
Отличия дизайнерских решений
Дизайн навигационных табличек и место их расположения напрямую зависит от функционального назначения учреждения.
Так для навигации в детских садах изготавливают яркие, но простые таблички, указатели, понятные даже самым маленьким посетителям. Их располагают в зоне, доступной детскому взгляду – на стенах, дверях, возможно даже на полу. При изготовлении напольной навигации для дошкольного учреждения отдают предпочтение ярким, нестандартным изображениям, указывающим направление движения.
Вывеска для детского сада должна соответствовать ряду требований, среди которых не последнее место занимает эстетическое восприятие конструкции и долговечность. Этот элемент украшения фасада должен долгое время выдерживать испытания атмосферными факторами, сохраняя надолго эстетически привлекательный вид и быть безопасным для окружающих. Конструкция должна иметь следующие характеристики:
• износостойкость;
• красочность;
• стойкость к коррозии;
• безопасность.
Навигация в здании школ, центров образования позволяет сформировать пространство, в котором будет удобно и приятно учиться и работать. Навигационные элементы: подвесные и настенные таблички и указатели — помогают ученикам, сотрудникам и гостям ориентироваться в школьном пространстве. Особенно важны такие элементы для только поступивших учеников, занятия которых проходят в разных кабинетах на разных этажах, а также для родителей и других гостей, приглашенных на собрание или праздничное представление. Для того, чтобы навигационные элементы эффективно работали и украшали школу, центр образования необходимо изготовлять их в едином стиле и придерживаться определенных правил при их размещении.
При изготовлении навигации для колледжей и техникумов, университетов и институтов можно использовать логотип учреждения или подчеркнуть его особенность или направленность.
Преимущества системы визуальной навигации
В жизни человек всегда стремится создать вокруг себя зону комфорта, избежать неудобств. Профессиональное изготовление и установка системы визуальной навигации в дошкольном или школьном учреждении, центре образования или ВУЗе обеспечит:
1. Функциональный, запоминающийся и эстетически привлекательный дизайн.
2. Использование высококачественных, прочных, надежных и безопасных материалов, которые обеспечат продолжительный срок службы.
3. Возможность использования разнообразных цветов, гармонично вписанных в экстерьер или интерьер.
4. Быстрое и высококачественное изготовление элементов навигационной системы (идентификаторов зон, табличек, указателей, стендов, знаков, панелей с информацией) на новейшем оборудовании.
5. Возможность акцентирования внимания на особенностях работы учреждения.
6. Комфортность посетителя.
Грамотно продуманная навигация поможет посетителю чувствовать себя уверенно и комфортно, экономит его время, дает понять, что в этом учреждении заботятся именно о нем.
Заказав и установив навигацию в образовательном учреждении, вы заботитесь не только об учащихся и посетителях, но и о его имидже и престиже.
Топ-10 вариантов дизайна веб-навигации
Навигация – важнейший аспект любого сайта. Сможет ли пользователь найти актуальную для себя информацию и захочет ли он вернуться – зависит от эффективности вашей веб-навигации.
Навигация ничем не регламентирована: ее можно сделать прозрачной и интуитивной или многоуровневой и нестандартной.
Как сделать навигацию на сайте максимально эффективной и какой дизайн подойдет именно вам?
У компании веб-разработки Umbrella IT есть ответы на все ваши вопросы.
Но обо всем по порядку.
ЧТО ТАКОЕ НАВИГАЦИЯ?
Навигация сайта или веб-навигация – это система программных и визуальных средств, которые помогают пользователю ориентироваться на сайте и находить нужную информацию.
ПЛАНИРОВАНИЕ НАВИГАЦИИ
Максимально эффективная веб-навигация держится на 3 китах:
ТРЕНДЫ В ДИЗАЙНЕ ВЕБ-НАВИГАЦИИ
Дизайн веб-навигации необычайно вариативен, однако некоторые его элементы завоевали большую популярность, чем другие. Umbrella IT отобрала 10 примеров наиболее удачных дизайнов веб-навигации, которые работают как индивидуально, так и в сочетании друг с другом. Каждый из них имеет свои достоинства и недостатки, и какой из них лучший – решать только Вам.
1. ГОРИЗОНТАЛЬНАЯ НАВИГАЦИЯ
Горизонтальная навигация – классический дизайн, соединивший удобство с функциональностью.
2. ВЕРТИКАЛЬНАЯ НАВИГАЦИЯ
Выезжающее меню или слайд-меню – один из способов сохранить полный функционал и экранное пространство. Меню скрыто за левой границей экрана и появляется по клику или касанию.
Лендинг – это одностраничный сайт с длинной или бесконечной прокруткой, оптимизированный под определенные цели.
5. ФИКСИРОВАННОЕ МЕНЮ
Фиксированная или “липкая” навигация статично закрепляет панель меню в конкретной части страницы, предоставляя пользователю постоянный доступ к опциям меню.
Гамбургер-меню – навигационное меню, изначально разработанное для смартфонов, но все чаще появляющееся на экранах ноутбуков. Представляет собой иконку, скрывающую широкий диапазон опций и категорий. Свое название меню получило из-за сходства иконки с гамбургером – три горизонтальных полоски меню символизируют три слоя знаменитого сэндвича.
7. АДАПТИВНАЯ НАВИГАЦИЯ
Адаптивная навигация – вариативный дизайн, автоматически подстраивающийся под различную ширину экрана и мобильные платформы.
Мега-меню – обширная навигационная панель, всплывающая при наведении курсора или нажатии. Мега-меню не просто структурирует контент по группам и колонкам в текстовом формате, но и активно использует различные визуальные средства.
9. РАСШИРЕННЫЙ ФУТЕР
10. ПОЛНОЭКРАННАЯ НАВИГАЦИЯ
В отличие от всех представленных здесь вариантов дизайна, полноэкранная навигация не ставит перед собой задачу экономии экранного пространства. Напротив, полноэкранная навигация использует интро-страницу на все 100 процентов, сочетая текст с графикой.
Рациональное использование анимированных элементов как основных или дополнительных средств навигации позволяет разнообразить консервативный дизайн и привлечь внимание пользователей.
На этапе выбора и разработки дизайна веб-навигации трудно предугадать, какой именно вариант окажется выигрышным. Успех каждого конкретного случая зависит от ряда факторов: от бизнес-назначения, целей и задач сайта, природы контента, целевой аудитории и Ваших личных предпочтений.
Дизайн систем визуальной навигации
Компания «Дизайн Досье» реализовала целый ряд проектов по созданию систем визуальной навигации различной сложности. Заказывая разработку концепции навигации у нас, вы получите полный пакет услуг и специалистов высшей категории. В зависимости от потребностей клиентов мы разрабатываем комплексную концептуальную навигацию, дизайнерские проекты отдельных указателей.
Что такое «дизайн систем визуальной навигации»?
Представьте, вы заходите в крупный торговый центр или в бизнес-центр, в котором до этого не были. Куда идти? Как найти интересующий вас павильон или офис? Распространенное заблуждение, о том, что достаточно разработать дизайн указателей или табличек, развесить их по стенам приводит к массовому неудобству и недовольству посетителей.
От грамотного построения наружной или интерьерной систем визуальной навигации зависит удобство для посетителей находить необходимые услуги, комфортность получения информации, и, как результат, лояльность и общественное мнение. Среда, в которую попадает потребитель – это неотъемлемая визуальная составляющего общего образа бренда. Креативные и одновременно понятные решения навигационных систем становятся эффективным средством воздействия на аудиторию, укрепляют имидж бренда, увеличивают его запоминаемость.
Разработка концепции дизайна наружной или интерьерной навигации – это одно из важнейших условий для понятной, грамотной организации пространства.
Навигационная система должна гармонично дополнять интерьер. Системы визуальной навигации – это язык, на котором локация/ помещение передает посетителям необходимую для ориентации в пространстве информацию. Визуальная навигация должна создавать у посетителя ощущение комфорта, удобства и гостеприимства.
Средовой дизайн – это сложный процесс, в котором принимают участие не только дизайнеры, но и маркетологи, архитекторы, инженеры. Опыт и знания специалистов компании «Дизайн Досье» в технологиях производства конструкций различной сложности позволяют нам предлагать удобные и работающие решения с учетом производственных ограничений и специфики пространства.
Только всесторонний и глубокий анализ, подробная проработка уникальной системы навигации и ориентирования с привязкой к местности или интерьеру — именно такое решение вопроса навигации требуется на сегодняшний день.
Какие задачи входят в процесс разработки дизайн проекта навигации?
Мы индивидуально подходим к каждому новому проекту, учитываем результаты исследований и анализа объекта. Это позволяет нам исключить ошибки при разработке дизайна типов и размеров указателей, при нахождении цветового решения и общей стилистики систем навигации. Мы учитываем новые технологии и возможность их использования на конкретном объекте.
Мы имеем собственное производство, что позволяет сокращать расходы и выполнять заказы в жесткие сроки. На этапе реализации у нас работают профессиональные монтажники, которые выполнят любые самые сложные работы, учитывая архитектуру объекта.
IT1209: Пользовательские взаимодействия
Дизайн навигации кажется простым делом: нужно всего то расставить на каждой странице ссылки, чтобы пользователь смог ориентироваться на сайте. Однако если заглянуть чуть глубже, трудности навигационного дизайна станут очевидными. Дизайн навигации на любом сайте должен одновременно решать три задачи:
При ориентировании в физическом пространстве человек может в определенной степени полагаться на внутреннее ощущение направления. (Конечно, есть и такие люди, которые всегда чувствуют себя потерянными.) Однако механизмы нашего мозга, помогающие найти дорогу в физическом мире, совершенно бесполезны при поиске пути в информационном пространстве.
Вот почему жизненно важно, чтобы каждая страница веб-сайта четко доводила до сведения пользователей, в каком месте сайта они находятся и куда могут попасть. Вопрос о том, в какой степени пользователи могут ориентироваться в информационных пространствах, по сей день вызывает споры. Некоторые специалисты рьяно отстаивают ту точку зрения, что при посещении веб-сайтов пользователи строят в уме небольшие карты, как при посещении супермаркета или библиотеки; другие же утверждают, что пользователи практически целиком полагаются на навигационные подсказки перед собой, как если бы любой шаг, сделанный ими на сайте, моментально стирался из их памяти.
Мы до сих пор не знаем, как (и в какой мере) пользователи представляют в уме структуру веб-сайта. Пока мы это не выясним, лучше всего предполагать, что пользователи ничего не запоминают при переходе от одной страницы к другой. (В конце концов, если общедоступная поисковая машина вроде Google проиндексирует ваш сайт, точкой входа на сайт может оказаться любая страница.)
Большинство сайтов фактически предоставляют пользователю несколько систем навигации, причем каждая играет свою роль в ориентировании пользователя на сайте в разных обстоятельствах. На практике были выработаны несколько типов систем навигации.
Глобальная навигация обеспечивает доступ к значительной части сайта. Термин «глобальная» здесь не означает, что эта навигация обязательно появляется на каждой странице сайта – хотя это была бы неплохая идея. (Элементы навигации, присутствующие на всех страницах сайта, мы будем называть «постоянными»; следует помнить, что постоянные элементы не всегда являются глобальными.) Фактически глобальная навигация представляет собой набор точек входа, которые необходимы пользователям, чтобы переходить с одного «конца» сайта на другой. В любое место сайта, которое вам понадобится, вы сможете (так или иначе) попасть с помощью глобальной навигации.
Локальная навигация предоставляет пользователям доступ к «ближайшим» элементам архитектуры. В строго иерархической архитектуре локальная навигация может, например, обеспечить доступ к родительской странице, страницам-потомкам и страницам-соседям. Если ваша архитектура построена в соответствии с тем, как пользователи представляют себе контент сайта, локальная навигация, как правило, оказывается наиболее часто востребованной, нежели другие варианты навигации.
Дополнительная навигация обеспечивает более быстрый доступ к связанному с текущей страницей контенту, который может не быть напрямую доступным посредством глобальной или локальной навигации. Этот тип навигационной схемы обладает достоинствами фасетной классификации (он дает пользователям возможность переместить фокус своих изысканий на другие элементы контента без необходимости возврата в стартовую точку), но при этом позволяет сохранить преимущественно иерархическую архитектуру сайта.
Контекстная навигация встроена непосредственно в содержимое страницы (и поэтому иногда называется микронавигацией). Этот тип навигации (например, гиперссылка в тексте на странице) часто используется в недостаточной степени (а то и вообще неправильно). Нередко пользователи решают, что им нужен другой элемент информации, непосредственно в процессе чтения текста на странице. Почему бы не поместить соответствующую ссылку прямо в тексте, не заставляя пользователя просматривать страницу вдоль и поперек в поисках необходимого навигационного элемента (или, того хуже, бросать все и обращаться к поисковику)?
Возвращаясь к теме уровня стратегии, заметим, что чем лучше вы знаете своих пользователей и их потребности, тем эффективнее будет развернутая вами контекстная навигация. Если ваши пользователи не будут получать от контекстной навигации очевидную поддержку при работе над своими задачами и для достижения своих целей (например, ваш текст напичкан таким количеством гиперссылок, что пользователи просто не в состоянии понять, какие относятся к их потребностям), они будут справедливо воспринимать ее как мусор.
Сервисная навигация предоставляет доступ к элементам, которые не нужны пользователю повседневно, но которые принято предоставлять ради его удобства. Например, в реальном мире на дверях магазина обычно указаны часы его работы. Для большинства покупателей львиную долю времени эта информация не имеет ценности: стоя рядом, любой может легко сообразить, открыт ли сейчас магазин. Однако знание о том, что эта информация легко доступна, помогает покупателю, которому она вдруг понадобилась. Ссылки на контактную информацию, на формы обратной связи и на формулировку политики сайта являются распространенными элементами сервисной навигации.
Некоторые средства навигации не встроены в структуру страниц, а существуют сами по себе независимо от контента и функций сайта. Это инструменты выносной навигации, к которым пользователи обращаются тогда, когда запутались в предоставленных вами прочих навигационных системах или с первого взгляда пришли к выводу, что не стоит и пытаться в них разобраться.
Карта сайта – широко распространенный инструмент выносной навигации, который дает пользователю краткий одностраничный обзор всей архитектуры сайта. Карта сайта обычно имеет вид иерархического списка, состоящего из ссылок на разделы верхнего уровня, под которыми с отступом размещены ссылки на разделы второго уровня. Карты сайта редко показывают более двух уровней иерархии – более глубокая детализация пользователям обычно не нужна (если на вашем сайте это не так, значит, у вас что-то неладно с верхним уровнем архитектуры).
Индекс – это алфавитный список тем со ссылками на соответствующие страницы, аналогичный предметному указателю в конце книги. Такой инструмент наиболее эффективен для сайтов с большим количеством контента, затрагивающего широкий диапазон тем. В большинстве остальных случаев будет достаточно карты сайта и хорошо спроектированной архитектуры. Иногда разработчики создают индексы для отдельных разделов сайта, не пытаясь охватить весь контент. Этот подход может оказаться действенным, когда ваш сайт разбит на части, предназначенные для разных аудиторий с различными потребностями в информации.