Publish your project for free and start receiving offers from freelance contractors in serveral minutes after publication!

Требуется специалист по Canvas анимации

project expired


Есть верстка на которую необходимо сделать качественную canvas анимацию.


Подробное видеоТЗ по анимации тут: https://drive.google.com/open?id=0B14mbc1tp4XmT2RTVldBVTBsdHM


Инструкция по анимации:

  • Общая анимационная тема отображена движением свободных молекул,
  • как по ссылке: http://codepen.io/VincentGarreau/pen/pnlso  по цвету на них наложен градиент есть в UI ките.
  • идеальный вариант совместить ее с интерактивным построением при прокрутке как на примере: http://brightmedia.pl/?lang=en&site=contact  (конечно, здесь сложный пример, но нам нужна только логика, просто проявлять уже установленную анимацию при прокрутке страницы )
  • Анимация загрузки страницы: http://codepen.io/Izumenko/pen/MpWyXK , только элементы должны быть соединены.
  • При такой анимации блоки должны быть минимального проявления, лучше наверне оставить их статичными.
  • Колесо категорий должно крутиться.


Вариант реализации нужной анимации от разработчика, который писал пример:

Судя по картинке, в мозге части в определенном радиусе должны становиться синими и чуть чуть приближаться к мышке.
Вполне реально сделать в канвасе. Нужно создать массив с координатами всех точек. Потом сгенерировать точки как определённые классы в этих позициях с чуть чуть рандомным размером. Дальше сделать в их классе метод который будет чекать близко ли мышка или нет. И тогда их по чуть чуть тянуть.
Тянучку сделать довольно просто.
Видел на моем канале видео про цветной хаос? Так вот на моем кодпэне про цветной хаос(https://codepen.io/Godje/pen/PbRyVw). На него есть форк, который я сам сделал. Где точечки сами тянуться обратно на свою позицию. Таким же образом можно тянуть точки с маленьким давлением, и будет казаться будто они чуть чуть двигаються в направлении мышки.
Единственные сложности которые я сейчас замечаю со своей стороны это правильно их соединить так же как и на картинке. Никак не пойму как можно сделать так. Разве что каждому дать id и потом в каждой точке дать массив с ид точек с которыми нужно присоединиться. Но это капец долго и мучительно.
https://codepen.io/Godje/pen/xgaqpO


Либо реализация так как вы это видите.


Make a proposal!

The client doesn't want to make prepayment? Offer him to make a payment via Safe to avoid possible fraud.

  1.  freelancer isn't working in the service any longer

Client
Anna Myrgorodska
Ukraine Ukraine  7   0
Project published
31 May at 16:46
33 views
Payment methods
Share