Information

Founded
Location
Россия
Website
ruvds.com
Employees
11–30 employees
Registered

Habr blog

Pull to refresh
Comments 23
Ту часть, где объяснение периодов для дошкольников, вообще не надо было переводить. Остальное укладывается в одну строчку: «Шарики должны двигаться под синусоиде».

Шарики должны двигаться под синусоиде, каждый со своим сдвигом по фазе!

Возможно у меня напрочь отсутствует тригонометрический вкус, но анимация на первой гифке мне кажется более приятной (естественной), чем на последней.
По моему — все одинаково плохо, фпс настолько низкий, что все неприятно дёргается. И я не понимаю, почему его нельзя было сделать больше.
Чтобы GIF-ка на КДПВ с 15 мегабайт до 50 разрослась?
За такие гифки на КДПВ надо вообще в рид онли переводить…
UFO landed and left these words here
Она же вроде-как в HTML, надо было просто ссылку на демо дать.
ну вот розовый на первой гифке вообще в магазин ушел по своим делам, а черные вполне вместе.
Абсолютно согласен.
Графики-графики и вот… вы разницы не заметите, но она есть! (сурок в тему)

Мне кажется, что если рассматривать такую категорию как "приятность", то уже стОит говорить о такой штуке как easing. Ну и fps побольше, как же без него....

Было бы интересно посмотреть на наложенные друг на друга анимации.
Из пушки по воробьям. Для таких анимаций есть CSS c transition-timing-function.
Нельзя вот так взять и на 10 страницах с рисунками и анимацией описать вот это все. Это завуалированное оскорбление фронтендщиков, не иначе. </шутка>
Я с java-скриптами знаком очень поверхностно. В них вот такая бесконечная рекурсия — нормальное явление? Стек вызовов не разрастется до неприличия если вкладка с такой анимацией останется открытой весь день?
AFAIK коллстек очищается при вызове setTimeout. Если точнее, любые асинхронные вызовы создают свой коллстек.

Нет там никакой рекурсии. requestAnimationFrame() просто ставит функцию в очередь на выполнение на следующем кадре анимации. Здесь функция animate() в самом конце просто ставит в очередь саму себя и таким образом постоянно запускается снова. Стек вызовов не растёт, в нём всегда один вызов (функции animate()).

Спасибо, после прочтения описания этой функции все стало понятно :)
Главный фейл этих анимаций – дискретность каждого кадра, отсутствие размытия движения (motion blur). Ну и первый принцип анимации от Диснея squash & stretch не помешал бы!
Дистиллированный перфекционизм. Тратить такие усилия на столь незначительные моменты можно только когда всё остальное — идеально.
Небольшая опечатка в коде, в Svg id=«cCentre»
а в скрипте cCenter = document.getElementById('cCenter')
Only those users with full accounts are able to leave comments. Log in, please.