История и археология Донбасса
Три направления дизайна для научного портала по гранту РНФ. Структура одна и та же по ТЗ: шесть разделов, поиск, версия для слабовидящих, карусель со ссылками, библиотека с обложками. Разные — характер и главный приём движения.
Разрез
Страница устроена как стратиграфический разрез. Разделы — слои почвы с цветами по шкале Манселла, как в полевом описании.
- Морфинг
- карусель сменяет фото «раскопом»: новое изображение проступает сквозь слои; границы слоёв распрямляются при наведении
- Деталь
- рейка-глубиномер слева показывает «глубину» прокрутки в сантиметрах
- Тон
- светлый, строгий, ближе к научному изданию
Рельеф
Первый экран — живой топоплан в горизонталях. Курганная группа, городище, меловые холмы перетекают друг в друга.
- Морфинг
- изолинии рельефа плавно меняют форму при смене памятника и мягко реагируют на курсор; заголовок «проявляется» по осям вариативного шрифта
- Деталь
- каждая пятая горизонталь утолщена, по краям — сетка квадратов раскопа
- Тон
- тёмный, атмосферный, самый «выставочный»
Картотека
Шапка по образцу ИА РАН, библиотека по образцу ИИМК РАН. Всё остальное — карточки музейной картотеки с шифрами.
- Морфинг
- чертёж сосуда перетекает между культурами: ямная, катакомбная, срубная, скифы, салтово-маяцкая
- Переход
- строка экспедиции раскрывается в страницу: фото «вырастает» в шапку (View Transitions)
- Тон
- самый близкий к референсам заказчика, академический
Портал
Современный научный портал без оглядки на сайты-образцы: поиск по всему сайту, разбор материалов по эпохам, темы и размер текста.
- Поиск
- палитра по «/» или Ctrl+K: разделы, новости, экспедиции, персоналии, книги и словарь
- Новичкам
- раздел с двумя интерактивными изометрическими схемами: как идут раскопки и из чего состоит глиняный сосуд
- Тон
- спокойный, удобный, «государственно-понятный»
Полынь
Сначала телефон. Только разделы из ТЗ, собранные как приложение: нижний док, шторки, свайпы.
- Жесты
- стопка «Главное сейчас» листается пальцем, экспедиции и персоналии открываются шторкой с фотогалереей и подписями
- Деталь
- слова манифеста загораются при прокрутке, разделы собраны в бенто-сетку с подпунктами
- Тон
- сочный и дружелюбный: степная полынь и подсолнух
Редизайн
Структура сайта ИА РАН, которую заказчик взял за основу, в современной подаче и под нашим брендом.
- Движение
- GSAP: карусель со шторкой, заголовки по словам, лента эпох, которая едет при прокрутке, фото экспедиции «вылетает» в её страницу
- Деталь
- мега-меню со всеми подпунктами ТЗ, версия для слабовидящих, страница читается и без JavaScript
- Тон
- академичный: мел, сланец и красная охра
Тексты, шифры и фотографии — примеры для концепта. Фото сгенерированы и будут заменены снимками проекта. Анимации отключаются при системной настройке «уменьшить движение».