Web анимация, canvas анимация
Доброго дня.
1. Механика.
Весь блок будет содержать в себе следующую информацию.
Большой куб находится по центру, переливается золотистым цветом.
Вокруг этого куба находится 8 маленьких кубов. У каждого маленького куба будет свой цвет, свой заголовок и свое краткое описание.
Концепция будет примерно следующей: 
При наведении на малый куб, он переливается золотистым цветом, нужно чтобы как-то большой куб анимированно повлиял на малый куб, нужно создать впечатление, что центральный большой куб влияет на малый куб (вспышка, золотистая пыль,...).
ИЛИ
При наведении на Малый Куб, он поглощается Большим Кубом (влетает в Большой Куб), Большой Куб перестраивает Малые Кубы внутри себя (из которых состоит) , при этом от Большого Куба могут расходиться вокруг золотистые волны из золотистой пыли (словно он влияет на всё вокруг) и из него вылетает Малый Куб на своё место, но уже с золотым цветом на место того куба, на который навели. (Показывает то, что Большой Куб повлиял на Малый Куб)
Примеры как выглядит Большой Куб:
2. Угол куба + должна быть прозрачность, чтобы видно было грани Малых Кубов внутри Большого Куба, такая:
3. Большой Куб, цвет: Солнечно-золотистый, переливается золотистым. (Как эффект волны)
-
Для вашего проекта есть 2 варианта реализации.
1) css/js анимации
2) WebGL + shaders
-
WebGL базируется на отживающем свой срок OpenGL, на смену им Vulkan пришел уже. Саму анимацию и в canvas 2D можно сделать, но вот с запуском функций напрямую проблема есть - кубы на плоскости будут форму шестиугольников иметь, а не прямоугольников и сами по себе не будут элементами DOM, на которые обработчики событий можно повесить. Задачу можно, конечно, решить, но тут не столько с кодом js, сколько с математикой повозиться придется...
-
Могу на чистых html/css/js сделать.
С анимацией, и интерактивностью (переливы, подсветка, мигания при наведеним, кликабельность).
Пример скину в личку (у вас закрыты прив. сообщ.) -
Актуальные фриланс-проекты в категории Веб-программирование
Настроить отправку данных из popup-форм WordPress-сайта на Make webhookНужно настроить отправку данных из форм сайта на WordPress на готовый Make webhook. Формы на сайте открываются в popup/modal окне. После успешной отправки формы данные должны уходить POST-запросом на webhook Make в JSON-формате. Webhook и полное ТЗ передадим выбранному… CMS, Веб-программирование ∙ 36 минут назад ∙ 28 ставок |
Проблема с онлайн оплатой liqpay
1000 UAH
Всем привет, у меня проблема с оплатой liqpay, клиент платит, а заказ не появляется, использовал стандартный модуль, потом купил модуль на opencartforum Liqpay API Opencart - онлайн оплата для Opencart 3, и пробовал настроить с разработчиком модуля, оказалось, проблема не на… Веб-программирование ∙ 50 минут назад ∙ 17 ставок |
Техническая поддержка веб-платформы (Python/Django)Есть работающий веб-проект, нужно поддерживать и постепенно приводить в порядок, без переписывания с нуля. Стек проекта: Backend: Python, Django, Django Rest Framework Frontend: Next.js База данных: PostgreSQL Инфраструктура: AWS (EC2), Nginx Есть интеграции с внешними API… Python, Веб-программирование ∙ 12 часов 44 минуты назад ∙ 47 ставок |
Посадка HTML в WordPressТЗ: перенос HTML в WordPress https://bikeinbali.com/new Сделать кастомную WordPress classic theme на базе готовых HTML-макетов.Не использовать: Elementor WPBakery тяжёлые page builder themes Единые элементыСделать глобальные: header.php ( Header/footer должны быть… Веб-программирование, Создание сайта под ключ ∙ 17 часов 25 минут назад ∙ 72 ставки |
Доработка сайта на Ocstore 3
700 UAH
Ocstore 3 Шаблон Upstore Поправить некоторые моменты https://docs.google.com/document/d/1-TmTo3lh_ElFjPMQCGs2sVCsVSzq-V-Z/edit?usp=sharing&ouid=105344407605205919725&rtpof=true&sd=true Ожидаю ваши предложения PHP, Веб-программирование ∙ 18 часов 21 минута назад ∙ 58 ставок |
Киев