Чудо дерево : каталог книг в виде интерактивной карты

tree-brunch

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

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

Взгляд снаружи

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

wander-tree-interactive-map

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

tree-in-active-state

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

Взгляд изнутри

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

inside-admin

Это вид того же дерева, но с правами администратора. Активные регионы обозначены серыми рамками. Специальные значки в виде якоря и скрещенных стрелок (позаимствовал из awesome font) помогают нам настроить расположение и размеры объекта. При наведении в блоке подсказки есть ссылка для вызова редактора.

Немного программирования и шепотка ajax поднимают юзабилити админки drupal на новый уровень :).

Мало букафф? Читайте есчо !

Сайт для Верх-Исетского Птичьего рынка

Май 10, 2015 г.

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

Читать

Студия дерева и камня

Октябрь 1, 2010 г.

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

Читать

Монтаж Телеком

Апрель 19, 2015 г.

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

Читать

Вояж в китай..

Август 18, 2008 г.

В проекте TripIntoChina.com я принимал участие, работая в Ways LTD. Это был мой первый серьёзный проект в этой конторе и опыт работы с движком Drupal. ...

Читать
 

Комментарии к «Чудо дерево : каталог книг в виде интерактивной карты»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: