Как устроена "Интерактивная витрина" Вашего сайта - подробнее о работе нового модуля.

Здравствуйте, уважаемые коллеги!
В прошлый раз мы рассказали об "Интерактивной витрине" - новом уникальном модуле, который мы создали для Вашего сайта.
Сегодня предлагаем познакомиться с ним поближе.
Это даст более полное представление о возможностях и потенциале этого инструмента и, возможно, натолкнёт на классные идеи, которые Вы захотите реализовать на своём сайте.
Прежде всего, рассмотрим, принцип работы нового модуля.
Напомним, что основная задача, для которой мы его делали, - привлечь внимание пользователей к каким-либо материалам и обеспечить наглядный, быстрый и удобный доступ к ним из одной "точки входа". При этом фактическое местоположение самих материалов не имеет значения: они могут быть разбросаны по разным страницам Вашего сайта или за его пределами - на других сайтах и сервисах в Интернете.
Чтобы лучше понять принцип работы модуля, давайте вспомним старый добрый "Рабочий стол" (тот самый, что мы видим при загрузке Windows и многих других операционных систем), который хорошо знаком любому человеку, имевшему дело с компьютером.
Множество программ, документов, изображений, видеороликов и других файлов могут быть разбросаны по разным дискам и папкам на компьютере. Но для самых актуальных и часто используемых, как правило, мы создаём на "Рабочим столе" ярлыки. И, вместо того, чтобы искать файл или программу на диске, нам достаточно щёлкнуть по ярлыку - и желаемый контент мгновенно запустится.
Из настольных компьютеров принцип "Рабочего стола" перекочевал и в мобильные устройства. И сейчас на экране Вашего смартфона или планшета Вы можете видеть всё тот же "Рабочий стол" (чуть адаптированный под мобильные технологии) со всё те ми же ярлыками. По нажатию на ярлык, как правило, открывается то или иное приложение.
Этот же самый принцип мы положили в основу нового модуля "Интерактивная витрина".
И, если посмотреть на его интерфейс, сразу можно заметить, что он чем-то напоминает "Рабочий стол" на компьютере или смартфоне.
Всё потому, что он построен из тех же самых частей.
Основная область модуля называется "экран". Это аналог "поверхности" рабочего стола.
На экране располагаются прямоугольные значки. Это - ключевые элементы модуля. Они выполняют роль ярлыков.
Как легко можно догадаться, при щелчке по такому ярлыку открывается связанный с ним контент (точь-в-точь, как это происходит на "Рабочем столе").
Причем, ярлык может открывать одну из четырёх разновидностей контента.
И вот какие:
1. Ссылка.
Подразумевается всё, что вообще возможно открыть по ссылке в сети Интернет. А это может быть практически что угодно: страница Вашего или любого другого сайта, видеоролик на youtube, статья Википедии, архив на файлообменном сервисе, профиль в соцсети - здесь нет никаких ограничений.
Отметим, что ссылка - разновидность контента, которая имеет особое значение в контексте модуля "Интерактивная витрина".
Собственно, сам модуль изначально и задумывался как инструмент для создания подборок со ссылками. Кстати, упомянутый выше "Рабочий стол" (принцип работы которого лёг в основу модуля) - это тоже не что иное, как подборка ссылок.
Использование ярлыков-ссылок поможет превратить экран "Интерактивной витрины" в удобный портал, откуда пользователь может мгновенно попасть в любое место из тех, что Вы добавили в подборку.
2. Документ.
Можно загрузить на сайт файл документа в одном из популярных форматов (Word, Excel, PowerPoint, PDF, TXT, RTF, PSD), который откроется во всплывающем окне.
3. Изображение.
Здесь всё понятно - откроется картинка, которую Вы свяжете с ярлыком.
4. HTML-страница.
Откроется веб-страница, которую Вы предварительно создадите в визуальном редакторе. Такая страница, в отличие от ссылки, не имеет собственного адреса в сети Интернет и сохраняется внутри самого модуля "Виртуальная витрина" в виде html-кода.
На одном экране Вы можете создавать любое количество ярлыков всех перечисленных видов и комбинировать их каким угодно образом.
Кроме того, есть возможность создавать ярлыки-пустышки, которые не открывают никакого контента. Это полезно в некоторых случаях: например, когда ярлык сам выступает в роли контента (то есть сам по себе несёт какой-то смысл либо выполняет декоративную функцию).
Теперь немного о том, как выглядят сами элементы (ярлыки) на экране "Интерактивной витрины".
Если мы вновь вспомним классический "Рабочий стол", то значки на нём представлены в виде графических иконок (в большинстве случаев - с надписью).
Модуль "Интерактивная витрина" располагает более широкими возможностями для оформления ярлыков.
Каждый ярлык представляет собой небольшой прямоугольник. Все такие ярлыки-прямоугольники выстраиваются на экране в аккуратную адаптивную "сетку".
Для оформления ярлыка можно использовать текстовые и графические элементы.
Так, внутри прямоугольника можно разместить две текстовые надписи - название ярлыка и краткое описание. Если нужно дать более подробный комментарий, к ярлыку можно добавить подсказку, которая будет всплывать при наведении на него курсора.
В качестве графического оформления можно либо выбрать значок из коллекции, либо загрузить любое изображение с компьютера.
Также, если ярлык связан с каким-либо контентом (т.е. не является "пустышкой"), то при наведении на него курсора отображается индикатор, указывающий, какая разновидность контента (из четырех упомянутых выше) будет открыта - ссылка, документ, изображение или html-страница.
Для выделения ярлыка, на который в данный момент наведен курсор, используются анимационные эффекты.
Перечисленные средства помогут пользователю получить исчерпывающее представление о том, что именно откроется при щелчке по ярлыку. И это выводит оформление ярлыков модуля "Интерактивная витрина" на качественно новый уровень по сравнению с "классическими" ярлыками "Рабочего стола".
Завершая описание устройства нового модуля, вновь вернёмся к экрану - той области, где располагаются ярлыки.
В ходе нашего рассказа у Вам могло сложиться впечатление, что модуль представляет собой экран, на котором расположены элементы-ярлыки. В целом, это верное представление, но не до конца.
Дело в том, что в модуле можно использовать не только один, но и несколько экранов. И на каждом таком экране можно расположить свою уникальную подборку ярлыков.
Это значительно расширяет возможности модуля и позволяет создавать сложные структурированные подборки со множеством ярлыков, распределённых по различным экранам.
Для переключения между экранами используется навигационная панель, где каждый экран может быть обозначен текстовой надписью, графической иконкой и всплывающей подсказкой. Навигационная панель расположена в верхней части экрана. Она видна только в случае, если Вы создали более одного экрана.
На этом мы завершаем описание устройства модуля "Интерактивная витрина" и предлагаем взглянуть на его работу своими глазами.
Как говорится, лучше один раз увидеть. Заходите на наш ознакомительный сайт в раздел "Модули в примерах".
В модуле "Интерактивная витрина", представленном на ознакомительном сайте, создано три экрана.
На каждом экране есть небольшие подборки элементов-ярлыков. Ярлыки оформлены с применением различных элементов (текстовых и графических) и открывают разные виды контента (ссылки, документы, изображения, html-страницы).
Таким образом, данный пример может дать Вам наглядное представление обо всех деталях, которых мы коснулись в данном описании.
Теперь Вы сами сможете создавать собственные подборки материалов с помощью модуля "Интерактивная витрина" на Вашем сайте.
Если у Вас пока нет своего сайта, Вы можете создать его прямо сейчас на сайте проекта "Каждому учителю - Профессиональный сайт".
Помимо модуля "Интерактивная витрина", о котором мы рассказали сегодня, у нас Вы найдёте десятки уникальных инструментов, созданных специально для педагогов.
Присоединяйтесь к нам сегодня и начните новый учебный год в качестве владельца современного профессионального сайта учителя!