Сердечко замирает: 10 сайтов, которые вызывают мурашки (и чуть-чуть — недоумение)

На связи Пиробайт. Каждую пятницу мы проводим смотры сайтов. Ребята находят классные порталы, веб-приложения и сервисы, и в течение 15 минут презентуют их команде. Традиция повышает насмотренность у всех участников, а что-то мы даже берем в работу! Сегодня приглашаем вас присоединиться к нашей практике.

Сердечко замирает: 10 сайтов, которые вызывают мурашки (и чуть-чуть — недоумение)

Показываем проекты с крутыми идеями и вау-визуализацией

ТАСС представил проект, посвященный 30-летию полета ракетоплана «‎‎Буран‎»‎. 15 ноября 1988 года он совершил свой первый и единственный полет. Нас зацепила драматичность повествования и то, как визуализировали ее авторы лонгрида.

«Изменить место посадки после входа в атмосферу было уже невозможно — у «Бурана» отсутствовали авиационные двигатели»

Проект собрал кучу наград и сейчас находится в музее космонавтики.

<p>Прекрасный сторителлинг и графическое сопровождение</p>

Прекрасный сторителлинг и графическое сопровождение

Отдельное искусство. Нам приглянулся его флюидный градиент, который реагирует на курсор, отсылает к смешению красок в полиграфии и придает сайту динамику.

Интересно при этом, что внутренние страницы сохраняют строгость за счет монохромных блоков, напоминающих ч/б печать.

<p>Советуем скроллить под эмбиентную музыку :)</p>

Советуем скроллить под эмбиентную музыку :)

Motion sickness — это креативное агентство из Новой Зеландии. Во-первых, их сайт и правда невероятно креативный (просто кликните по ссылке и наслаждайтесь)

А во-вторых, чего только стоит одна страница о сотрудниках — каждого из них можно перемещать по блоку.

<p>А кто заметил самого главное работника?) Подсказка — он хороший мальчик</p>

А кто заметил самого главное работника?) Подсказка — он хороший мальчик

Когда был построен ваш дом? Где чаще всего происходят ДТП? Чтобы ответить на эти и другие вопросы, ребята-энтузиасты из Екатеринбурга собрали и визуализировали все данные о городе в одном сервисе.

Проект открытый, его исходный код лежит на GitHub. Сам сервис находится на этапе бета-версии, и чуть позже разработчики добавят в проект новых фич. В планах — визуализировать данные обо всех городах мира.

Интересно, а сколько домов уже изношено?
Интересно, а сколько домов уже изношено?

In Pieces — это интерактивная выставка самых редких видов представителей фауны. Классной получилась и сама идея, и дизайн с анимацией полигональных фигур и нестандартным управлением.

<p>Шоукейс из 30 видов животных. Элементы, из которых состоит зверек, по скроллу модифицируются в другого — очень залипательно</p>

Шоукейс из 30 видов животных. Элементы, из которых состоит зверек, по скроллу модифицируются в другого — очень залипательно

Кстати, на Smashing Magazine есть статья о моментах создания проекта (с кодами и описаниями)

Пример того, что даже такие простые и привычные вещи как перчатки, можно представить как нечто премиальное. Сайт получился мега стильным. Оправданно забрал призовые места от Workspace Digital Awards и «Золотого сайта». А вчера выяснилось, что еще и от Рейтинга Рунета.

<p>В общем, ребята из red collar постарались</p>

В общем, ребята из red collar постарались

Искали золото, а нашли 3D

Теперь покажем работы ребят из Lusion Labs — креативной студии из Британии. Специализируется на создании графики для студий и агентств. Работают с Гуглом, Coca-Cola и другими крутыми ребятами, о которых нельзя говорить из-за NDA. У них есть 2 направления — экспериментальное и коммерческое.

Шейдеры — это набор инструкций, которые говорят компьютеру, как рассчитывать и отображать цвета/формы на экране. Они создают эффекты и текстуры, которые делают игры и фильмы «живыми»‎.

Полагаем, что это как раз и есть экспериментальное направление. Проект крут податливостью на манипуляции мышки и музыкальным погружением.

<p>А может это волны? Или вата?</p>

А может это волны? Или вата?

Эту работу мы нашли на Awwwards. Смотреть в наушниках, потому что ну ооочень музыкально и медитативно.

<p>Магия происходит не только по скроллу, но и в ушах</p>

Магия происходит не только по скроллу, но и в ушах

А может, и не волос. Мы не знаем, что это такое. Главное, что на бегунках можно оторваться: поменять фон, размер, толщину, направление, скорость. Сделать шарик вяленьким, или наоборот — мега устрашающим, как у нас:

В общем, вдохновиться можно чем угодно, даже клоком из слива
В общем, вдохновиться можно чем угодно, даже клоком из слива

Вернее не сайт, а сама задумка. Экспериментальное направление. Идея в том, что люди пытаются выжить в параллельной вселенной, используя энергию земли. 3D-модель меняет цвет, мигает, замирает, потухает — в общем, живет своей жизнью.

<p>Добро пожаловать в портал!</p>

Добро пожаловать в портал!

Понравилась подборка? Если хотите узнать, как создаются такие эффекты, напишите в комментах. Постараемся подготовить обзор сервисов и решений.

Ищите нас на нашем сайте


Или в любых соцсетях:

В телеграм-канале

Во ВКонтакте

Если у вас есть задача разработать сайт или мобильное приложение, то напишите в Телеграм, мы это обсудим: https://t.me/sashadzen

Заказать разработку сайта, веб-сервиса или мобильного приложения на нашем сайте: https://vk.cc/cuglQZ

Партнерская программа, где мы платим от 10 000 до 200 000 рублей за контакты тех, кому нужен дизайн или разработка: https://vk.cc/cuglXT

Телеграм-канал Саши Комбарова про управление агентством, проектами, людьми: https://t.me/sasha_kombarov

Телеграм-бот, который бесплатно выдает чек-листы, памятки и регламенты по управлению, маркетингу, аналитике, дизайну и разработке: https://t.me/regulations_pyro_bot

7474
39 комментариев

Упустили из подборки этот топовый сайт: https://kombarov.su

6

Не верим. Не могли мы упустить его, не могли!

2

Сайты британской студии просто ВАУ!
А вы на проектах делаете 3D?

2

Да, делаем. На 5 проектах сейчас используем 3D-анимации. Скоро все покажем 😉

1

In Pieces - выглядит залипательно. Однако не все сайты моя видеокарта осилила. На волосы посмотреть не смог)

2

Возможно, оно и к лучшему :))

1

Симулятор волос... Есть в этом что-то мерзкое. В отличии от вашей подборки!

2