В этой статье мы рассмотрим, что такое информационная и функциональная архитектура, научимся их выстраивать. Также выясним, как нам поможет в этом пользовательский сценарий.
Вот общая картина того, что делает дизайнер:
Информационная архитектура — это структура всей информации. Когда мы организуем информацию, мы делаём её проще для понимания и навигации. Это способствует выполнению задач и интуитивному доступу к содержимому.
Когда пользователь заходит в приложение или на сайт, он должен понимать, где он находится и к чему он придёт. Мы ведём пользователя к той цели, которой он хочет достичь.
Яркий пример структурирования информационной архитектуры — IKEA. В магазине всё разложено по категориям, нарисованы стрелочки. Всё четко организовано, чтобы клиент, который зашёл в магазин, понимал, где и что он может найти. Если бы магазин с такой огромной площадью не был хорошо организован, наверняка там бы все хаотично двигались, не понимая, где достать нужную вещь. Даже если человек не нашёл в начале магазина нужный товар, он понимает, что ему требуется пройти определённый путь и он найдёт эту вещь.
Ещё один пример — магазин ZooShop. На картинке ниже вы видите информационную архитектуру товаров для кошек:
А это информационная архитектура сайта «Печатня»:
Составляя информационную архитектуру, мы примерно понимаем, что будет находиться на той или иной странице. Дальше мы можем делать прототип, вайрфреймы страниц приложения или сайта и заниматься дизайном. Информационная архитектура помогает структурировать информацию.
Вот так выглядит сайт «Печатня», построенный на основе информационной архитектуры, которую вы видели выше:
Основное — услуги, информацию о компании, разделы «Клиентам», «Поставщикам», «События», «Контакты» — вынесли на главную страницу.
Ещё один пример схемы показывает, как можно представлять информацию для себя:
