Spadająca kropla

Animacja: ruch, tempo i płynność - Grafika komputerowa w liceum i technikum (animation)

Kropla spada z **przyspieszeniem**: odległości między kolejnymi klatkami rosną (0, 8, 30, 66... px), tak jak w swobodnym spadku. Przy 12 klatkach na sekundę ruch wygląda płynnie. Porównaj z ruchem jednostajnym: ta sama kropla przesuwana co klatkę o 40 px wygląda jak winda, a nie jak kropla.

{"width":640,"height":360,"background":"#ffffff","fps":12,"frames":[{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":0.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":8.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":30.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":66.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":116.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":180.0,"w":24,"h":34}]},{"shapes":[{"type":"rect","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#a3e635","x":0,"y":300,"w":640,"h":60},{"type":"ellipse","stroke":null,"strokeWidth":0,"opacity":1,"rotation":0,"hidden":false,"group":null,"fill":"#0ea5e9","x":300.0,"y":240.0,"w":24,"h":34}]}]}

Ładowanie interaktywnego edytora... Jeśli się nie pojawi, włącz JavaScript.

Wszystkie lekcje kursu Grafika komputerowa w liceum i technikum·Zaloguj się, aby zapisać postęp na koncie.