
German: 
Ich heiße Lucas und bin Entwickler
für Google Web Designer.
In diesem Video zeige ich Ihnen,
wie Sie mit Bewegungspfaden
Objekte animieren, die sich an
Kurven entlangbewegen.
Wenn Sie bisher in Google Web Designer
ein Objekt bewegen wollten,
war dies nur entlang einer
geraden Linie möglich, so wie hier.
Jetzt können Sie Objekte
auch entlang von Kurven animieren.
Dazu verschieben Sie einfach
einen beliebigen Punkt auf der Linie.
Die Kurve, die sich ergibt,
wird als Bewegungspfad bezeichnet.
Sie können die Form des Bewegungspfads verändern.
Verschieben Sie dazu einen beliebigen
Punkt an der Innenseite der Kurve
oder einen der Endpunkte.
Sie können das Objekt auch
auf den Bewegungspfad ausrichten,
während es sich bewegt,
und zwar im Eigenschaftenbereich.
Klicken Sie im Bereich "Bewegungspfad"
einfach die Option "Auf den Pfad ausrichten" an.
Das sieht dann so aus.
Und hier ist die fertige Animation.
Wenn Sie den Bewegungspfad
genauer steuern möchten,
verwenden Sie das Bewegungspfad-Tool.

Polish: 
Mam na imię Lucas.
Pracuję w zespole
Google Web Designera.
W tym filmie pokażę,
jak wykorzystać ścieżki animacji
do animowania obiektów
wzdłuż krzywych.
Do tej pory Google Web Designer
pozwalał animować obiekt
tylko wzdłuż linii prostej.
Teraz można tworzyć krzywe.
Wystarczy chwycić i przeciągnąć
dowolny punkt na linii.
Powstała krzywa
to ścieżka animacji.
Aby zmienić jej kształt,
przesuń dowolny punkt krzywej
lub jej punkty końcowe.
Obiekt może też
obracać się do ścieżki.
W inspektorze właściwości
przejdź do sekcji Ścieżka animacji
i zaznacz pole Kieruj do ścieżki.
Będzie to wyglądało tak.
A oto efekt końcowy.
Kształt ścieżki animacji można zmienić
narzędziem Ścieżka animacji.

Japanese: 
Google Web Designerのエンジニア
ルーカスです
Google Web Designerのエンジニア
ルーカスです
本日はモーションパスを使った
曲線移動のアニメーションです
本日はモーションパスを使った
曲線移動のアニメーションです
オブジェクトを
アニメーションで移動させる場合
オブジェクトを
アニメーションで移動させる場合
これまでは直線移動のみでしたが
線をドラッグするだけで
曲線に沿って移動できるようになりました
線をドラッグするだけで
曲線に沿って移動できるようになりました
この線を「モーションパス」と言います
モーションパスの形を変えるには
曲線上のいずれかの点をドラッグします
モーションパスの形を変えるには
曲線上のいずれかの点をドラッグします
モーションパスの形を変えるには
曲線上のいずれかの点をドラッグします
オブジェクトの向きを曲線に合わせるには
プロパティインスペクタの
オブジェクトの向きを曲線に合わせるには
プロパティインスペクタの
[モーションパス]で
[パスに合わせる]をオンにします
このように向きが変わります
アニメーションにするとこんな感じです
パスの形を柔軟に変えるには
モーションパスツールを使います
パスの形を柔軟に変えるには
モーションパスツールを使います

Korean: 
안녕하세요, Lucas입니다
저는 Google Web Designer의
엔지니어입니다
이 동영상에서는 모션 경로를 사용하여
개체가 곡선을 따라 이동하도록
애니메이션을 적용하는
방법을 알아보겠습니다
이전에는
Google Web Designer에서
개체 위치에 애니메이션을
적용하려는 경우
이렇게 직선을 따라서만
이동할 수 있었습니다
이제 개체가 곡선을 따라
이동하도록 할 수 있습니다
직선에서 원하는 지점을 잡아
드래그하기만 하면 됩니다
이렇게 만든 곡선을
모션 경로라고 합니다
모션 경로의 모양을 수정할 수 있는데
곡선상의 원하는 지점이나
양 끝점 중 하나를
이동하기만 하면 됩니다
또한 이동할 때 개체가
모션 경로 방향을 향하도록
할 수도 있습니다
속성 검사기로 이동한 다음
모션 경로 섹션에서
경로 방향 따름을 선택합니다
그러면 경로 방향을 향하게 되고
최종 애니메이션은 이렇게 표시됩니다
모션 경로의 모양을
더 세부적으로 제어하려는 경우
모션 경로 도구를
사용할 수 있습니다

Chinese: 
我叫 Lucas
我是 Google Web Designer 的工程師
我叫 Lucas
我是 Google Web Designer 的工程師
這次我要示範
如何運用動態路徑
讓物件沿曲線移動
以前我們用 Google Web Designer
製作讓物件移動的動畫
只能像這樣延著直線移動
現在則可以沿著曲線移動
只要按住線上任何一點
然後拖曳即可
這樣做出來的曲線
就叫做動態路徑
動態路徑的形狀可以調整
只要移動曲線上任何一點
或移動任一端點即可
你還可以讓物件在移動時
朝向動態路徑的方向
先前往屬性檢查器
然後在動態路徑部分
勾選 [朝向路徑方向]
完成以後就會像這樣
最後的動畫則是這樣
如果想進一步調整動態路徑的形狀
可以使用動態路徑工具

Italian: 
Mi chiamo Lucas e sono un ingegnere
di Google Web Designer.
In questo video mostrerò come
animare oggetti lungo curve
usando i percorsi di animazione.
In precedenza, per animare
la posizione di un oggetto
in Google Web Designer
si poteva far spostare l'oggetto soltanto
lungo una linea retta, in questo modo.
Ora puoi farlo spostare lungo una curva
semplicemente trascinando
un punto qualsiasi della linea.
La curva ottenuta si chiama
percorso di animazione.
Puoi modificare la forma
del percorso di animazione
spostando un punto qualsiasi
nella parte interna della curva
o spostando uno dei punti finali.
Puoi anche far spostare l'oggetto in modo
che segua il percorso di animazione.
A tale scopo, vai alla sezione
Percorso animazione del pannello Proprietà
e seleziona Orientamento in base
al percorso di animazione.
Ecco il risultato.
E questa è l'animazione finale.
Per definire ancora meglio
la forma del percorso di animazione
puoi usare lo strumento Percorso animazione.

English: 
LUCAS: My name is
Lucas and I'm an engineer
on Google Web Designer.
In this video, I'll show how
to animate objects along curves
using motion paths.
Previously in
Google Web Designer,
if you wanted to animate
an object's position,
it could only travel along
a straight line, like this.
Now you can have it
move along a curve
by simply grabbing any point
on that line and dragging it.
We call the resulting
curve the motion path.
You can edit the shape
of the motion path
by moving any point on
the curve's interior
or by moving either
of the endpoints.
You can also have the object
face along the motion path
as it travels by going to
the Property Inspector,
and then the motion path
section checking orient to path.
So here's what that looks like.
And here is the final animation.
To get more control over the
shape of the motion path,
you can use the
motion path tool.

Chinese: 
我叫Lucas
是Google Web Designer团队的工程师
在本视频中，我将演示如何使用动画路径
制作使对象沿着曲线移动的动画
以前使用Google Web Designer时
如果想制作让对象移动的动画
对象只能沿着直线移动，就像这样
现在，只需按住直线上的任意一点并拖动
就可以让对象沿着曲线移动了
我们将产生的曲线叫做动画路径
您可以修改动画路径的形状
方法是移动曲线上的任意点
包括端点
您还可以转到“属性检查器”
然后在“动画路径”部分中勾选“路径方向”
让对象在移动时朝着动画路径的方向
就像这样移动
这是最终的动画效果
要进一步控制动画路径的形状
您可以使用动画路径工具

Spanish: 
Me llamo Lucas
y soy ingeniero
de Google Web Designer.
Voy a explicar
cómo animar objetos en curvas
con rutas de movimiento.
Antes, en Google Web Designer
un objeto solo podía moverse
en línea recta. De esta manera.
Ahora, puede moverse trazando curvas.
Solo tienes que arrastrar
cualquier punto de la línea.
La curva resultante
es la ruta de movimiento.
Puedes editar
la forma de esa ruta
moviendo cualquier punto
del interior de la curva
o cualquiera de los dos extremos.
También puedes orientar
el objeto a la ruta de movimiento
mientras se desplaza.
Ve al inspector de propiedades
y, en Ruta de movimiento,
marca Orientar hacia la ruta.
Este es el movimiento.
Y esta, la animación final.
Para controlar mejor
la forma de la ruta de movimiento
usa la herramienta Ruta de movimiento.

French: 
Je m'appelle Lucas.
Je suis ingénieur
pour Google Web Designer.
Dans cette vidéo, je vais expliquer
comment animer des objets le long de courbes
grâce aux trajectoires d'animation.
Auparavant,
dans Google Web Designer,
si vous vouliez animer
la position d'un objet,
ce dernier pouvait uniquement
suivre une ligne droite, comme ceci.
Désormais, vous pouvez
lui faire suivre une courbe
en cliquant sur un point de la ligne
et en le faisant glisser.
La courbe ainsi créée est appelée
"trajectoire d'animation".
Pour modifier la forme
de la trajectoire d'animation,
déplacez un point de la courbe
ou l'une de ses extrémités.
Pour que l'orientation de l'objet
suive la courbe,
dans la section
"Trajectoire d'animation" des propriétés,
cochez
"Orienter dans le sens de la trajectoire".
Voilà le résultat.
Et voilà l'animation finale.
Pour mieux contrôler
la forme de la trajectoire d'animation,
utilisez l'outil Motion Path.

Russian: 
Меня зовут Лукас.
Я специалист по Google Web Designer.
В этом видео я покажу,
как анимировать объекты по кривым
с помощью путей перемещения.
Раньше в Google Web Designer
анимированные объекты могли перемещаться
только по прямой, вот так.
Теперь можно изменить траекторию на кривую,
перетащив любую точку на прямой.
Такая кривая называется путем перемещения.
Форму пути можно изменить,
передвинув любую внутреннюю
или конечную точку кривой.
Можно сделать так, чтобы объект учитывал
рельеф пути: на панели свойств
в разделе "Путь перемещения"
отметьте "Ориентироваться на путь".
Вот так.
Просмотрим результат.
Чтобы задать кривую более точно,
используйте инструмент "Путь перемещения".

English: 
LUCAS: My name is
Lucas, and I'm an engineer
on Google Web Designer.
In this video, I'll show how
to animate objects along curves
using motion paths.
Previously in
Google Web Designer,
if you wanted to animate
an object's position,
it could only travel along
a straight line, like this.
Now you can have it
move along a curve
by simply grabbing any point
on that line and dragging it.
We call the resulting
curve the motion path.
You can edit the shape
of the motion path
by moving any point on
the curve's interior
or by moving either
of the endpoints.
You can also have the object
face along the motion path
as it travels by going to
the Property Inspector,
and then the motion path
section checking orient to path.
So here's what that looks like.
And here is the final animation.
To get more control over the
shape of the motion path,
you can use the
motion path tool.

Thai: 
ผมชื่อลูคัส
และผมเป็นวิศวกรของ
Google Web Designer
วันนี้ผมจะมาสาธิตวิธีทำให้
วัตถุเคลื่อนไหวไปตามเส้นโค้ง
โดยใช้เส้นทางการเคลื่อนไหว
ที่ผ่านมา
ใน Google Web Designer
ถ้าจะทำให้วัตถุเคลื่อนที่ไปมา
วัตถุจะเดินทางได้เป็นเส้นตรงเท่านั้น
แบบนี้นะครับ
ตอนนี้เราทำให้มัน
เคลื่อนไปตามเส้นโค้งได้แล้ว
แค่คลิกตรงจุดไหนก็ได้บนเส้น
แล้วลากไป
เราเรียกเส้นโค้งที่ได้ว่า
"เส้นทางการเคลื่อนไหว"
คุณแก้ไขรูปร่างของเส้นทางการเคลื่อนไหวได้
เพียงคลิกแล้วลากจุดไหนก็ได้บนเส้นโค้ง
หรือจะลากจุดสิ้นสุดจากฝั่งไหนก็ได้
และคุณยังสามารถทำให้วัตถุเปลี่ยนการวางแนว
ให้รับกับเส้นทางการเคลื่อนไหว
โดยไปที่เครื่องมือตรวจสอบคุณสมบัติ
ในส่วน "เส้นทางการเคลื่อนไหว"
ให้เลือก "วางแนวตามเส้นทาง"
ก็จะออกมาเป็นแบบนี้
และนี่คือภาพเคลื่อนไหวที่ทำเสร็จแล้ว
สำหรับตัวเลือกอื่นๆ ในการควบคุม
รูปร่างของเส้นทางการเคลื่อนไหว
ให้ใช้เครื่องมือเส้นทางการเคลื่อนไหว

Turkish: 
LUCAS: Benim adım Lucas
ve Google Web Designer'da
mühendisim.
Bu videoda, nesnelerin hareket
yolları kullanılarak eğriler boyunca
nasıl hareket ettirileceğini anlatacağım.
Google Web Designer'da daha önce,
bir nesnenin konumunu
değiştirmek istediğinizde
sadece bunun gibi düz bir
çizgi üzerinde gidebiliyordu.
Artık nesneyi bir eğri
boyunca hareket ettirebilirsiniz.
Bunun için çizgi üzerindeki bir noktayı
tıklayıp sürüklemeniz yeterli.
Ortaya çıkan bu eğriye
hareket yolu diyoruz.
Hareket yolunun şeklini
düzenlemek için
eğrinin iç kısmından bir noktayı
veya uç noktalardan birini
taşıyabilirsiniz.
Ayrıca hareket sırasında nesnenin
yönünü hareket yoluna göre
ayarlayabilirsiniz. Bunun için
Özellik Denetçisi'ne ve sonra
hareket yolu bölümüne gidip "yönü yola
göre ayarla" seçeneğini işaretleyin.
Hareket bu şekilde görünür.
Bu da animasyonun son hali.
Hareket yolunun şeklini
daha iyi kontrol edebilmek
için hareket yolu
aracını kullanabilirsiniz.

Dutch: 
Mijn naam is Lucas en ik ben engineer
voor Google Web Designer.
In deze video laat ik zien hoe
u objecten animeert langs curves
met behulp van bewegingspaden.
Het was eerst zo in Google Web Designer
dat als u de positie
van een object wilde animeren,
het alleen langs een rechte lijn
kon worden bewogen, zoals dit.
Nu kunt u het ook langs een curve bewegen
door een punt op de lijn
vast te pakken en te verslepen.
De curve die dan ontstaat,
noemen we het bewegingspad.
U kunt de vorm van
het bewegingspad bewerken
door een punt ergens in
het middenstuk van de curve te verplaatsen
of door een van de eindpunten te verplaatsen.
U kunt instellen dat het object
wijst in de richting van het bewegingspad
waarover het beweegt door
naar het deelvenster Eigenschappen te gaan
en vervolgens 'Oriënteren op pad'
aan te vinken in het gedeelte 'Bewegingspad'.
Dat ziet er zo uit.
En dit is de uiteindelijke animatie.
Voor nog meer controle over
de vorm van het bewegingspad
kunt u het gereedschap
Bewegingspad gebruiken.

Portuguese: 
Meu nome é Lucas e sou engenheiro
no Google Web Designer.
Neste vídeo, veremos
como animar objetos em curvas
com a demarcação de animação.
Antes, se você quisesse animar
a posição de um objeto
no Google Web Designer,
o percurso só poderia ser feito em linha reta.
Agora, você pode mover
essa posição ao longo de uma curva
segurando e arrastando um ponto da linha.
Chamamos a curva gerada
de demarcação de animação.
É possível editar a forma
da demarcação de animação
deslocando um ponto no interior da curva
ou movendo um dos pontos de extremidade.
Também é possível fazer com que
a posição do objeto acompanhe a direção
da demarcação durante o percurso.
Acesse o Inspetor de propriedades
e, na seção "Demarcação de animação",
marque "Orientar para o caminho".
Isso deve funcionar desta forma.
E esta é a animação final.
Para controlar melhor a forma
da demarcação de animação,
use a ferramenta correspondente.

Chinese: 
使用這項工具
不但可以直接調整曲線
還可以移動切線控制點
變更工具模式以後
你也可以像這樣插入控制點
或是像這樣刪除控制點
根據預設
移動一端的切線控制點
另一端的控制點也會跟著移動
讓曲線保持平滑
我們也可以取消預設模式
讓曲線有稜角
如果使用 Linux 或 Windows 電腦
可以按住 Alt 鍵再調整
使用 Mac 電腦則是按住 Control 鍵
在控制點上連按兩下
也可以做出類似的效果
在控制點上連按兩下
也可以做出類似的效果
這會讓切線控制線的長度縮為 0
再連按兩下就可以讓控制線恢復原狀
最後，如果你想
建立循環動態路徑
請按住端點
然後把端點拖曳到起始點
或反過來操作
這樣兩個點就會銜接在一起
變成平滑的循環動態路徑

Dutch: 
Met dit gereedschap kan niet alleen
de curve zelf worden bewogen,
maar kunt u ook
de raaklijnen verplaatsen.
En door de gereedschapsmodus
te wijzigen, kunt u
zo
controlepunten invoegen.
En u kunt controlepunten
zo verwijderen.
Als u een controlepunt
van de raaklijn aanpast,
verplaatst het tegenoverliggende
controlepunt standaard mee, zodat
de curve vloeiend blijft.
Als u niet wilt dat dit gebeurt en u
een hoek wilt maken in de curve,
houdt u de Alt-toets ingedrukt
als u met Linux of Windows
werkt, of de Control-toets
als u met een Mac werkt.
U bereikt een vergelijkbaar effect
als u dubbelklikt op een
controlepunt.
Hierdoor krijgen de uiteinden
van de raaklijn een lengte van nul.
Als u opnieuw dubbelklikt,
worden de uiteinden weer zichtbaar.
Tot slot kunt u een bewegingspad
maken dat een kring vormt.
Pak het eindpunt beet en
sleep het richting het beginpunt,
of andersom,
en ze vallen samen.
Nu is het bewegingspad een
ononderbroken kring geworden.

German: 
Damit können Sie die Kurve
nicht nur direkt verschieben,
sondern auch die Tangenten steuern.
Und wenn Sie den Modus des Tools ändern,
können Sie Steuerungspunkte einfügen
– in etwa so.
Oder Sie können Steuerungspunkte so löschen.
Wenn Sie das Ende einer Tangente verschieben,
wird das gegenüberliegende Ende angepasst,
damit die Kurve natürlich verläuft.
Wenn Sie das nicht möchten
und der Kurve eine Ecke hinzufügen wollen,
halten Sie unter Linux oder Windows
die Alt-Taste gedrückt.
Auf einem Mac hingegen die Ctrl-Taste.
Einen ähnlichen Effekt erzielen Sie,
wenn Sie auf einen
Steuerungspunkt klicken.
Dadurch wird die Tangente auf "null" gesetzt.
Wenn Sie noch einmal doppelt klicken,
wird sie wieder verlängert.
Wenn Sie eine
Bewegungsschleife erstellen möchten,
ziehen Sie einfach den Endpunkt
zum Startpunkt hinüber
oder umgekehrt.
Die Punkte werden verbunden,
sodass Sie eine nahtlose
Schleife des Bewegungspfads erhalten.

French: 
Il vous permet
de déplacer la courbe directement,
ainsi que les poignées des tangentes.
Changez le mode de l'outil pour
insérer des points de contrôle, comme ceci,
ainsi que pour en supprimer, comme ceci.
Par défaut, si vous déplacez
une poignée de la tangente,
la poignée opposée bouge aussi
pour que la courbe reste fluide.
Pour éviter cela
et ajouter un angle à la courbe,
maintenez la touche Alt enfoncée
sur Linux et Windows
ou la touche Ctrl sur Mac.
Obtenez un effet similaire
en double-cliquant sur un point de contrôle.
 
La longueur des poignées de la tangente
est ainsi réduite à zéro.
Double-cliquez de nouveau
pour redévelopper les poignées.
Pour créer une trajectoire d'animation
en forme de boucle,
cliquez sur l'extrémité, puis
faites-la glisser jusqu'au point de départ
ou vice versa.
Les deux points s'ancrent alors.
Voici une trajectoire d'animation
fluide en forme de boucle.

English: 
With this tool, in addition
to moving the curve directly,
you can also move
tangent controls.
And by changing
the tool mode, you
can insert control
points, like this.
And you can delete
control points, like this.
By default, when you
move a tangent control,
the opposite control
also moves to preserve
the smoothness of the curve.
If you don't want
this behaviour, and you
want to add a
corner to the curve,
then you can hold
down the Alt key,
if you are on Linux or
Windows or the Control
key, if you are on Mac.
You can get a similar effect
by double-clicking on a control
point.
That will shrink the tangent
handles down to zero length.
You can then double-click
again to re-extend the handles.
Finally, if you want to
create a looping motion path,
you can simply grab the endpoint
and drag it towards the start,
or vice versa.
And they will snap together.
So here is a smoothly
looping motion path.

English: 
With this tool, in addition
to moving the curve directly,
you can also move
tangent controls.
And by changing
the tool mode, you
can insert control
points, like this.
And you can delete
control points, like this.
By default, when you
move a tangent control,
the opposite control
also moves to preserve
the smoothness of the curve.
If you don't want
this behavior, and you
want to add a
corner to the curve,
then you can hold
down the Alt key,
if you are on Linux or
Windows, or the Control
key, if you are on Mac.
You can get a similar effect
by double-clicking on a control
point.
That will shrink the tangent
handles down to zero length.
You can then double-click
again to re-extend the handles.
Finally, if you want to
create a looping motion path,
you can simply grab the endpoint
and drag it towards the start,
or vice versa.
And they will snap together.
So here is a smoothly
looping motion path.

Spanish: 
Además de desplazar la curva
puedes mover los controles de tangentes.
Si cambias el modo de la herramienta
podrás insertar puntos de control
y eliminarlos.
De forma predeterminada,
al mover un control de tangente
también se mueve el control opuesto
para que la curva sea uniforme.
Si prefieres añadir
una esquina a la curva
mantén pulsada la tecla Alt
en Linux o Windows
o la tecla Control en Mac.
Obtén un efecto similar
haciendo doble clic
en un punto de control.
Los puntos de dirección de la tangente
bajarán hasta la longitud cero
y volverán a subir
al hacer doble clic de nuevo.
Si quieres una ruta circular,
arrastra uno de los extremos
hacia el otro.
Así se unirán ambos puntos
formando una
ruta de movimiento circular.

Turkish: 
Bu araçla, eğri üzrerindeki bir
noktayı tutup taşımanın yanı sıra,
teğet kontrollerini de hareket
ettirebilirsiniz.
Araç modunu değiştirerek
bunun gibi kontrol noktaları
ekleyebilir
ve bu şekilde de silebilirsiniz.
Bir teğet kontrolünü taşıdığınızda,
varsayılan olarak karşıdaki
kontrol de hareket ederek
eğrinin şeklini korur.
Bunun yerine eğriye bir köşe
eklemek istiyorsanız,
Linux veya Windows'da
Alt tuşunu,
Mac'te ise Control tuşunu
basılı tutabilirsiniz.
Bir kontrol noktasını çift
tıkladığınızda da benzer bir efekt
elde edebilirsiniz.
Bu işlem, teğet tutamaçlarını
sıfır uzunluğa kadar küçültür.
Ardından tekrar çift tıklayıp tutamaçları
yeniden büyütebilirsiniz.
Son olarak, döngü halinde bir hareket
yolu oluşturmak istiyorsanız,
bitiş noktasını tutup başlangıç
noktasına sürüklemeniz veya
tersini yapmanız yeterli.
İki nokta birleşir.
İşte düzgün bir döngü
halindeki hareket yolu.

Russian: 
Он позволяет регулировать как саму кривую,
так и отдельные управляющие маркеры.
Изменяя режим инструмента,
вы можете добавлять контрольные точки
и удалять их.
По умолчанию, когда вы
перемещаете управляющий маркер,
противоположный элемент тоже перемещается,
сохраняя плавность кривой.
Если это не нужно,
например вы хотите добавить угол,
перемещайте элемент управления,
удерживая клавишу ALT на Linux и Windows
или Control на Mac.
Кроме того, можно дважды нажать
на контрольную точку –
управляющие маркеры будут свернуты.
Чтобы развернуть их,
дважды нажмите на контрольную точку.
И наконец, чтобы создать
замкнутый путь перемещения,
перетащите конечную точку в начало,
или наоборот.
Кривая соединится.
Получился плавный замкнутый путь перемещения.

Thai: 
นอกจากจะย้ายเส้นโค้งได้โดยตรงแล้ว
คุณยังย้ายตัวควบคุมเส้นสัมผัสได้ด้วย
พอเปลี่ยนโหมดเครื่องมือ
คุณก็แทรกจุดควบคุมได้
แบบนี้ครับ
หรือจะลบจุดควบคุมออกก็ได้
แบบนี้เลย
โดยค่าเริ่มต้น
เมื่อคุณลากตัวควบคุมเส้นสัมผัส
ตัวควบคุมอีกฝั่งจะขยับตามไปด้วย
เพื่อรักษาความลื่นไหลของเส้นโค้ง
ถ้าคุณไม่ต้องการให้เป็นแบบนี้
และต้องการเพิ่มมุมให้เส้นโค้ง
ให้กดแป้น Alt ค้างไว้
ถ้าใช้ Linux หรือ Windows
หรือกดแป้น Control
ถ้าคุณใช้ Mac
หรือจะดับเบิลคลิกที่จุดควบคุม
เพื่อให้ได้ผลลัพธ์เดียวกันก็ได้
ซึ่งจะทำให้แฮนเดิลของเส้นสัมผัสหดลง
และมีความยาวเป็น 0
ดับเบิลคลิกอีกทีเพื่อให้แฮนเดิล
ขยายออกมาใหม่
และสุดท้าย ถ้าอยากสร้าง
เส้นทางการเคลื่อนไหวแบบวนซ้ำ
ให้ลากจุดสิ้นสุดไปที่จุดเริ่มต้น
หรือลากจุดเริ่มต้นไปที่จุดสิ้นสุด
แล้วเส้นก็จะบรรจบกัน
ก็จะเป็นเส้นทางการเคลื่อนไหวแบบวนซ้ำ
ที่ราบรื่นแบบนี้

Japanese: 
曲線を直接ドラッグするだけでなく
接線を使って制御できます
曲線を直接ドラッグするだけでなく
接線を使って制御できます
ツールモードを変えると
制御点を挿入できます
ツールモードを変えると
制御点を挿入できます
制御点でパスを削除することもできます
こんな感じですね
接線のコントロールを動かすと
反対側も動いて
曲線が自然な形に保たれます
反対側も動いて
曲線が自然な形に保たれます
バランスをとらずに
角度を急にしたい場合は
バランスをとらずに
角度を急にしたい場合は
Altキーを押しながら
接線をドラッグします
Altキーを押しながら
接線をドラッグします
MacならControlキーですね
制御点をダブルクリックすると
接線のハンドルの長さが0になります
制御点をダブルクリックすると
接線のハンドルの長さが0になります
制御点をダブルクリックすると
接線のハンドルの長さが0になります
元に戻すには
再びダブルクリックします
モーションパスをループ状にしたい場合は
終点を開始点までドラッグすると
モーションパスをループ状にしたい場合は
終点を開始点までドラッグすると
線がつながってループになります
線がつながってループになります
滑らかなループ状の
モーションパスになりました

Korean: 
이 도구를 사용하면 곡선을
직접 움직일 수 있을 뿐만 아니라
접선 컨트롤도 움직일 수 있습니다
또한 도구 모드를 변경하여
이렇게 제어점을 삽입하거나
삭제할 수도 있습니다
기본적으로 접선 컨트롤을 움직이면
곡선의 완만한 느낌이 유지되도록
반대편 접선 컨트롤도
함께 움직입니다
이러한 동작을 원하지 않고
곡선에 모서리를 주고 싶으면
Linux 또는 Windows 사용자의 경우
Alt 키를, Mac 사용자의 경우
control 키를 누른 상태에서
드래그하면 됩니다
제어점을 더블클릭하여
비슷한 효과를 얻을 수도
있습니다
그러면 접선 핸들 길이가
0으로 축소됩니다
제어점을 다시 더블클릭하면
핸들이 원래 길이로 다시 연장됩니다
마지막으로 시작과 끝이 연결된
닫힌 모션 경로를 만들고 싶은 경우
끝점을 잡아 시작점으로 드래그하거나
반대로 시작점을 잡아 끝점으로
드래그하면 됩니다
그러면 두 점이 연결되고
매끄럽게 닫혀 있는
모션 경로가 만들어집니다

Polish: 
Pozwala ono przesuwać krzywą bezpośrednio
lub za pomocą stycznych.
Jeśli zmienisz tryb narzędzia,
możesz wstawić punkty sterujące.
Możesz je też usunąć.
Domyślnie, jeśli przesuniesz
jeden koniec stycznej,
drugi koniec też się przesunie,
by krzywa była płynna.
Jeśli nie jest Ci to potrzebne
i chcesz dodać narożnik,
przytrzymaj Alt
w systemach Linux lub Windows
albo Control na Macu.
Możesz też kliknąć dwa razy punkt sterujący.
Możesz też kliknąć dwa razy punkt sterujący.
Uchwyty stycznej znikną.
Dwukrotne kliknięcie wyświetli je ponownie.
Ścieżka animacji może mieć kształt pętli.
Wystarczy chwycić punkt końcowy
i przeciągnąć go na początek
lub odwrotnie.
Punkty połączą się.
Tak wygląda płynna
ścieżka animacji w postaci pętli.

Italian: 
Questo strumento ti consente non solo
di spostare direttamente la curva
ma anche di spostare
i controlli della tangente.
E cambiando la modalità dello strumento
puoi inserire punti di controllo come questo.
Puoi anche eliminare
i punti di controllo... così.
Per impostazione predefinita, quando
sposti un controllo della tangente
si sposta anche quello opposto per mantenere
l'uniformità della curva.
Se non desideri usare questo comportamento
e vuoi aggiungere un angolo alla curva
puoi tenere premuto il tasto ALT
su Linux o Windows oppure il tasto CTRL
su Mac.
Puoi ottenere un effetto simile
facendo doppio clic
su un punto di controllo.
La lunghezza dei punti di manipolazione
della tangente viene ridotta a zero.
Dopo puoi fare ancora doppio clic per
estendere di nuovo i punti di manipolazione.
Infine, se vuoi creare un percorso
di animazione a ripetizione continua
puoi trascinare il punto finale
verso quello iniziale
o viceversa.
I punti verranno uniti.
Ecco un percorso di animazione
uniforme a ripetizione.

Chinese: 
借助这个工具，除了直接移动曲线外
您还可以移动切线控制点
此外，通过更改工具模式
您可以插入控制点，就像这样
您还可以删除控制点，就像这样
默认情况下，当您移动一个切线控制点时
另一端的控制点也会移动
以确保曲线平滑自然
如果您不希望出现这样的变动
并想让曲线上出现直线角
则可以在Linux或Windows上
按住Alt键
或者在Mac上按住Control键，然后再进行移动
双击控制点
也可实现类似效果
这会让切线控制柄的长度缩短为零
再次双击可以让控制柄恢复原状
最后，如果您想要生成循环动画路径
则只需按住路径终点并朝着起点拖动即可
反过来也是可以的
它们会衔接在一起
这就生成了一个流畅的循环动画路径

Portuguese: 
Ela permite mover a curva
e os controles de tangente diretamente.
Ao trocar o modo da ferramenta,
é possível inserir pontos de controle.
E você também pode excluir esses pontos.
Por padrão,
ao deslocar um controle de tangente,
o controle oposto
também é movido para preservar
a suavidade da curva.
Caso você não queira que isso aconteça
e pretenda adicionar um canto à curva,
mantenha a tecla Alt pressionada
no Linux ou no Windows
ou use a tecla Control no Mac.
O mesmo ocorre quando você clica duas vezes
em um ponto de controle.
Isso reduzirá a alça da tangente
para um tamanho igual a zero.
Depois, clique duas vezes
para expandir as alças novamente.
Por fim, se quiser criar
uma demarcação de animação em loop,
segure e arraste o
ponto de extremidade em direção ao início,
ou vice-versa.
Eles se ajustarão automaticamente.
Este é um exemplo de uma perfeita
demarcação de animação em loop.

English: 
To control the timing
of the animation,
you can use the timeline.
And to demonstrate
this, I'm going
to go back to a simpler
version of this path.
That's just the bump.
So well, we adjust
these tangents
so that creates a
little hill like this.
OK.
Great.
So right now, the timeline has
the second key at two seconds.
So if I play the animation, it
takes two seconds to complete.
I can slow down the animation
by moving that key out to, say,
three seconds.
And now the object travels
along the same curve,
but at a slower speed.
You can also add
acceleration and deceleration
by changing the easing
function between the keys.
So I will pick an
easing function here
that causes the object to
gradually come to a stop
at the end of the path.
You can get more complicated
effects by using multiple keys.

Chinese: 
如果想控制動畫的時間
可以使用時間軸
為了示範這個功能
我先把動態路徑
還原成比較簡單的版本
用山丘形路徑說明
我要調整一下切線
畫出小山丘一樣的路徑
好了
很好
現在時間軸的第二個鍵
在兩秒的位置
所以動畫的播放時間也是兩秒
如果我把第二個鍵往後移到三秒
就可以放慢動畫
現在物件還是沿著同樣的曲線移動
但是移動得比較慢
如果想讓物件加速或減速移動
你可以調整兩個鍵之間的
加/減速功能
我在這裡選擇減速功能
讓物件在路徑末端慢慢停止
讓物件在路徑末端慢慢停止
如果多用幾個鍵
就可以做出更複雜的效果

Japanese: 
タイミングはタイムラインで制御します
タイミングはタイムラインで制御します
実際にご覧に入れるために
最初のシンプルなパスに戻しましょう
実際にご覧に入れるために
最初のシンプルなパスに戻しましょう
実際にご覧に入れるために
最初のシンプルなパスに戻しましょう
接線を調整して
丘のような形にします
接線を調整して
丘のような形にします
これでいいでしょう
これでいいでしょう
2番目のキーが2秒の所にあるので
アニメーションは2秒かけて再生されます
2番目のキーが2秒の所にあるので
アニメーションは2秒かけて再生されます
キーをたとえば
3秒の所に移動すると
キーをたとえば
3秒の所に移動すると
オブジェクトが同じ曲線上を
ゆっくり移動します
オブジェクトが同じ曲線上を
ゆっくり移動します
加速や減速を表現するには
イージング機能を使用します
加速や減速を表現するには
イージング機能を使用します
このイージングを選ぶと
オブジェクトは終点に近づくにつれ
少しずつ減速して停止します
オブジェクトは終点に近づくにつれ
少しずつ減速して停止します
複数のキーを使って
少し複雑にしましょう

Spanish: 
Para controlar
el tiempo de la animación
usa la cronología.
Veamos una versión más sencilla
de esta ruta como ejemplo.
Esto es el bulto.
Ajustaremos estas tangentes
para crear una pequeña cuesta.
Listo.
Genial.
El segundo fotograma
está en 2 segundos.
Si reproduzco la animación,
tarda 2 segundos en completarse.
Puedo ralentizarla
colocando el fotograma
en 3 segundos.
Ahora el objeto
se mueve por la misma curva
pero más despacio.
También puedes añadir
aceleración y desaceleración
cambiando la función
del menú Mover entre los fotogramas.
Selecciono una función de movimiento
que hace que el objeto
se detenga poco a poco
al final de la ruta.
Puedes combinar varios fotogramas
para obtener efectos más complicados.

Russian: 
Временем анимации можно управлять
на временной шкале.
Чтобы показать это,
я верну простой путь перемещения
с небольшим изгибом.
Переместим управляющие маркеры,
чтобы создать небольшой подъем.
 
Отлично!
Сейчас второй ключевой кадр
расположен на второй секунде временной шкалы.
Анимация выполняется две секунды.
Чтобы замедлить анимацию,
можно переместить ключевой кадр,
например, на третью секунду.
Теперь объект проходит ту же кривую
с меньшей скоростью.
Можно также добавить ускорение или замедление,
изменив динамику между ключевыми кадрами.
Я выбираю вариант,
при котором объект
постепенно останавливается
в конце пути.
Чтобы усложнить анимацию,
можно добавить ещё кадры.

French: 
Pour contrôler
la chronologie d'une animation,
servez-vous de la timeline.
Pour cet exemple,
je vais revenir à une trajectoire plus simple
en forme de bosse.
Il suffit d'ajuster ces tangentes
pour créer une petite colline, comme ceci.
Bien.
Parfait.
Sur la timeline, la deuxième image clé
se trouve actuellement à 2 secondes.
Cela signifie
que l'animation dure 2 secondes.
Pour la ralentir,
je définis par exemple cette image clé
sur 3 secondes.
L'objet se déplace alors
le long de la même courbe,
mais plus lentement.
Pour accélérer et ralentir les mouvements,
modifiez le lissage de vitesse
entre deux images clés.
Par exemple, avec ce lissage de vitesse,
l'objet ralentit progressivement
avant de s'arrêter
au bout de la trajectoire.
Pour produire des effets plus complexes,
utilisez plusieurs images clés.

Dutch: 
Voor het bepalen van de timing van de animatie
kunt u de tijdlijn gebruiken.
Ik laat dit zien met
een eenvoudigere versie van dit pad,
gewoon een hobbel.
We passen deze raaklijnen aan,
zodat er een heuvel ontstaat.
OK.
Mooi.
Momenteel heeft de tijdlijn
een tweede sleutelframe op twee seconden.
Als ik de animatie afspeel,
duurt deze twee seconden.
Ik kan de animatie vertragen door
dat sleutelframe te verplaatsen naar bijvoorbeeld
drie seconden.
Het object volgt nu dezelfde curve,
maar dan langzamer.
U kunt de animatie bovendien
laten versnellen of vertragen
door de easingfunctie
aan te passen tussen de sleutelframes.
Dus ik stel hier een easing in
die ervoor zorgt dat het object
langzaam tot stilstand komt
aan het eind van het pad.
U kunt complexere effecten bereiken
door nog meer sleutelframes te gebruiken.

Korean: 
애니메이션의 타이밍을 제어하려는 경우
타임라인을 사용할 수 있습니다
이를 보여드리기 위해
단순한 버전의 모션 경로로
돌아가겠습니다
조금 뛰어나온 부분만 남기겠습니다
접선을 조정하여
이렇게 작은 언덕을 만들겠습니다
좋습니다
잘 만들어졌네요
지금은 타임라인에서 2초에
두 번째 키가 있습니다
따라서 애니메이션을 재생하면
완료하는 데 2초가 걸립니다
이 키를 바깥 쪽, 가령 3초로 위치로
이동하면 애니메이션 재생 속도를
늦출 수 있습니다
이제 개체가 같은 곡선을 따라 움직이지만
속도는 훨씬 느립니다
또한 가속 및 감속 효과를
추가할 수도 있는데
키 간의 easing 함수를 변경하면 됩니다
여기서 easing 함수를 선택하면
경로 끝 부분에서
개체가 천천히 멈추게 됩니다
여러 개의 키를 사용하여
더 복잡한 효과를 얻을 수 있습니다

Turkish: 
Animasyonun zamanlamasını
kontrol etmek için
zaman çizelgesini kullanabilirsiniz.
Bunu göstermek için
bu yolun daha basit
bir sürümüne geçeceğim.
Bu sadece küçük bir
çıkıp inme hareketi.
Bu teğetleri ayarlıyoruz
ve şöyle küçük bir tepe oluşturuyoruz.
Oldu.
Harika.
Şu an, zaman çizelgesinin ikinci
saniyesinde ikinci bir anahtar var.
Animasyonu oynattığımda
tamamlanması iki saniye sürüyor.
Bu anahtarı ileri taşıyarak
animasyonu yavaşlatabilirim.
Mesela üç saniyeye getirebilirim.
Şimdi nesne yine aynı
eğri boyunca gidiyor,
ama hızı daha yavaş.
Buraya ayrıca hızlanma ve yavaşlama
efektleri de ekleyebilirsiniz.
Bunu yapmak için anahtarlar arasındaki
yumuşatma işlevini değiştirirsiniz.
Nesnenin, yolun sonunda
yavaşlayarak durmasını sağlayacak
bir yavaşlatma seçiyorum.
Birden fazla anahtar kullanarak daha
karmaşık efektler de elde edebilirsiniz.

German: 
Das Timing einer Animation lässt sich
mithilfe der Zeitachse steuern.
Um Ihnen dies zu zeigen, kehre ich
zur einfachen Version des Bewegungspfads zurück.
Der "Hügel" eignet sich gut.
Ich passe einfach die Tangenten hier an
und erstelle wieder diesen kleinen Hügel.
Perfekt.
Sieht gut aus.
Momentan liegt der zweite Key
auf der Zeitachse bei zwei Sekunden.
Die Animation wird also
in zwei Sekunden abgespielt.
Wenn ich die Animation verlangsamen
möchte, verschiebe ich den Key
auf drei Sekunden.
Jetzt bewegt sich das Objekt
entlang derselben Kurve,
allerdings langsamer.
Sie können das Objekt auch
beschleunigen oder verlangsamen.
Dazu verändern Sie einfach die
Easing-Funktion zwischen den Keys.
Ich suche also hier eine Easing-Funktion aus,
durch die das Objekt am Ende des Pfads
langsam zum Stehen kommt.
Wenn Sie mehrere Keys verwenden,
erzielen Sie komplexere Effekte.

English: 
To control the timing
of the animation,
you can use the timeline.
And to demonstrate
this, I'm going
to go back to a simpler
version of this path.
That's just the bump.
So well, we adjust
these tangents
so that creates a
little hill like this.
OK.
Great.
So right now, the timeline has
the second key at two seconds.
So if I play the animation, it
takes two seconds to complete.
I can slow down the animation
by moving that key out to, say,
three seconds.
And now the object travels
along the same curve,
but at a slower speed.
You can also add
acceleration and deceleration
by changing the easing
function between the keys.
So I will pick an
easing function here
that causes the object to
gradually come to a stop
at the end of the path.
You can get more complicated
effects by using multiple keys.

Chinese: 
要控制动画效果的时间
您可以使用时间轴
为了演示如何使用时间轴
我将把此路径恢复为一个较为简单的版本
也就是只有一个突出部的版本
让我们来调整这些切线
制作出这样一个像小山一样的路径
好了
不错
现在，时间轴的第二键在2秒处
因此，如果我播放动画，两秒就能放完
我可以将第二键移远一点
比如移到3秒处
这样动画效果就会变慢
现在对象沿着同一条曲线前进
但速度变慢了
您还可以通过更改键之间的加/减速功能
来进行加速和减速
我会在这里选择“中速渐慢”功能
让对象在路径尽头
慢慢停下来
您还可以使用多个键实现更复杂的效果

Thai: 
เราจะควบคุมระยะเวลาของภาพเคลื่อนไหว
ด้วยการใช้ไทม์ไลน์
ผมจะสาธิตให้คุณดู
แต่ขอเปลี่ยนกลับเป็นเส้นทาง
ที่ไม่ค่อยซับซ้อนก่อนนะครับ
สักครู่นะครับ
เอาล่ะ เราจะ
ปรับเส้นสัมผัสพวกนี้
และสร้างเป็นทางขึ้นเขาเล็กๆ แบบนี้
ได้แล้วครับ
โอเค
ตอนนี้ไทม์ไลน์มีคีย์ที่ 2
อยู่ที่ 2 วินาที
ถ้าผมเล่นภาพเคลื่อนไหว
ก็ใช้เวลา 2 วินาทีจึงจะเล่นจบ
ผมทำให้เคลื่อนไหวช้าลงได้
โดยลากคีย์ออกไปอีก
เป็น 3 วินาที
ทีนี้วัตถุก็เคลื่อนไปตามเส้นโค้งเดิม
แต่เคลื่อนช้าลง
คุณจะเพิ่มหรือลดความเร็วอีกก็ได้
เพียงเปลี่ยนฟังก์ชันการค่อยๆ เปลี่ยน
ระหว่างแต่ละคีย์
ผมจะเลือกฟังก์ชันการค่อยๆ เปลี่ยนนี้
ที่ทำให้วัตถุค่อยๆ หยุด
เมื่อถึงจุดสิ้นสุด
คุณสามารถสร้างเอฟเฟกต์ที่ซับซ้อนขึ้น
โดยใช้คีย์หลายคีย์ได้

Italian: 
Per regolare la durata dell'animazione
si può usare la sequenza temporale.
Per fare una dimostrazione
userò una versione più semplice
di questo percorso cioè
solo un piccolo dosso.
Dunque, regoliamo queste tangenti
in modo da creare una collinetta... così.
OK.
Perfetto.
Ora il secondo fotogramma chiave nella
sequenza temporale è a due secondi.
Quindi per completare l'animazione
ci vogliono due secondi.
Posso rallentare l'animazione spostando
ad esempio il fotogramma chiave
fino a tre secondi.
Ora l'oggetto si sposta lungo la stessa curva
ma più lentamente.
È anche possibile aggiungere
accelerazione e decelerazione
cambiando l'easing tra i fotogrammi chiave.
Sceglierò qui una funzione di easing
che rallenta gradualmente
l'oggetto fino a fermarlo
alla fine del percorso.
È possibile creare effetti più complessi
usando diversi fotogrammi chiave.

Polish: 
Do zmiany czasu animacji
służy oś czasu.
Aby to pokazać,
wrócę do prostszej wersji ścieżki,
czyli górki.
Przesunę te styczne,
by utworzyć małą górkę.
Gotowe.
Świetnie.
Teraz druga klatka kluczowa
przypada na drugą sekundę.
Animacja trwa dwie sekundy.
Mogę zwolnić jej tempo,
przesuwając klatkę
do trzeciej sekundy.
Obiekt porusza się
po tej samej krzywej,
ale wolniej.
Efekt przyspieszenia lub zwolnienia
można uzyskać,
zmieniając wygładzanie.
Wybieram funkcję wygładzania,
która stopniowo zwalnia ruch obiektu,
aż do zatrzymania na końcu ścieżki.
Im więcej klatek, tym bardziej złożony efekt.

Portuguese: 
Para controlar o tempo da animação,
use o cronograma.
Para mostrar isso,
usarei uma versão mais simples desse caminho.
Vamos usar apenas um monte.
Então, ajustamos as tangentes
para criar um pequeno monte.
Ok.
Ótimo.
Neste momento, o cronograma tem
o segundo frame-chave em dois segundos.
Se eu reproduzir a animação,
ela será concluída em dois segundos.
É possível reduzir a velocidade
da animação mudando o frame-chave
para três segundos.
Agora, o objeto percorre a mesma curva,
mas em uma velocidade mais baixa.
Você também pode adicionar
aceleração e desaceleração
alterando a função de efeito
de easing entre os frames-chave.
Escolherei uma função de easing
que provoca a parada gradual do objeto
ao final do caminho.
É possível criar efeitos mais complexos
usando vários frames-chave.

Portuguese: 
Por exemplo,
adicionarei um segundo frame-chave aqui
e moverei um pouco o objeto.
Depois, farei ajustes
para que o caminho seja mais suave.
Por fim, mudarei
a função de efeito de easing inicial
para que o carro acelere e se mova.
Com essas alterações,
agora podemos ver
o carro acelerar sobre o monte
e realizar o percurso
a uma velocidade constante.
As demarcações de animação
funcionam usando a translação x e y.
Por isso, se você editar essa translação,
a demarcação de animação
também será alterada.
Por exemplo, se alterar
o x para um valor diferente,
verei que tenho o frame-chave no cronograma
e um novo ponto de controle
na demarcação de animação.
Se eu editar o y ou
acessar a ferramenta Seleção
e trocar o objeto de lugar,
o ponto de controle será movido.
No entanto, os outros
canais de transformação,
como translação, rotação e escala,
podem ser animados independentemente

English: 
So for example, I will
add in a second key here,
and I will move the
object out a little bit.
And then adjust the
path so it's smooth.
And then finally, I will change
the initial easing function
so the car accelerates
from a standstill.
So with these changes
we now see that the car
accelerates over the hill,
and then travels at
a constant speed.
Motion paths animate
using x and y translation.
So if you edit x
and y translation,
you edit the motion path.
For example, if I go here and I
change x to a different value,
I will see that I get both
a key in the timeline,
and a new control point
on the motion path.
If I then edit, say, y, or I
even go into the Selection tool
and I directly move the object,
that control point now moves.
All the other transform
channels, however, you
see translation,
rotation and scale,
those all can be
animated independently

Korean: 
예를 들어 여기에
두 번째 키를 추가하고
개체를 오른쪽으로
더 움직여 보겠습니다
그런 다음 경로를 조정하여
매끄럽게 만듭니다
마지막으로,
차가 정지 상태에서 가속하도록
추가한 easing 함수를 변경하겠습니다
이러한 변경사항이 모두 적용되면
차가 언덕에서 가속한 다음
일정한 속도로 이동하는 것을
확인할 수 있습니다
모션 경로는 x 및 y 변환을
사용하여 애니메이션을 적용합니다
따라서 x 및 y 변환을 수정하면
모션 경로가 수정됩니다
예를 들어 여기에서
x를 다른 값으로 변경하면
타임라인의 키와 모션 경로의 제어점이
변경되는 것을 확인할 수 있습니다
또한 y를 수정하거나
선택 도구로 이동해
개체를 직접 이동하면
제어점도 이동됩니다
하지만 다른 모든 변형 채널 즉,
변환, 회전 및 크기 조절은
모두 모션 경로와는 별도로

Italian: 
Aggiungo ad esempio un
secondo fotogramma chiave qui
e sposto l'oggetto un po' più in là.
Poi regolo il percorso per renderlo uniforme.
Infine cambio la funzione di easing iniziale
per far accelerare l'auto
da un punto di arresto.
Con questi cambiamenti
ora l'auto accelera sulla collina
per poi proseguire a velocità costante.
Per creare i percorsi di animazione
si usa la traslazione di x e y.
Modificando la traslazione di x e y
si modifica il percorso di animazione.
Ad esempio, se vado qui
e imposto un valore diverso per x
vengono creati un fotogramma chiave
nella sequenza temporale
e un nuovo punto di controllo
sul percorso di animazione.
Se poi modifico il valore y
o attivo lo strumento Selezione
e sposto direttamente l'oggetto,
il punto di controllo si sposta.
Tutti gli altri canali di trasformazione
come quelli che vedi qui,
traslazione, rotazione e scala
possono essere animati in modo separato

Spanish: 
Añadiré otro fotograma aquí
y apartaré un poco el objeto.
Ajustaré la ruta
para que sea uniforme
y cambiaré la función
de movimiento inicial
para que el coche acelere.
Ahora el coche
acelera al subir la cuesta
y después viaja
a velocidad constante.
Para animar rutas de movimiento
se usa la traslación X-Y.
Si editas la traslación X-Y
editas la ruta de movimiento.
Si aquí cambio X por otro valor
tendré un fotograma en la cronología
y otro punto de control
en la ruta de movimiento.
Si después edito Y
o voy a la herramienta Selección
y muevo el objeto directamente,
ese punto de control se moverá.
Todos los demás
canales de transformación
como traslación, rotación y escala
pueden animarse independientemente

Japanese: 
たとえば2番目のキーをここに移動し
オブジェクトをこっちに移動します
パスを調整して滑らかにし
最後にイージングを変更して
オブジェクトを加速させます
最後にイージングを変更して
オブジェクトを加速させます
これで車が丘を越えて加速したあと
一定の速度で走るようになりました
これで車が丘を越えて加速したあと
一定の速度で走るようになりました
これで車が丘を越えて加速したあと
一定の速度で走るようになりました
モーションパスはXY座標で表されるため
XY値で調整することもできます
モーションパスはXY座標で表されるため
XY値で調整することもできます
モーションパスはXY座標で表されるため
XY値で調整することもできます
たとえばプロパティで
X値を変えると
タイムラインのキーと
パスの制御点の両方が変わります
タイムラインのキーと
パスの制御点の両方が変わります
Y値を変更するか 選択ツールで
オブジェクトを動かすと制御点も移動します
Y値を変更するか 選択ツールで
オブジェクトを動かすと制御点も移動します
なお 平行移動、回転、
スケーリングのアニメーションは
なお 平行移動、回転、
スケーリングのアニメーションは
モーションパスとは別に行われます

English: 
So for example, I will
add in a second key here,
and I will move the
object out a little bit.
And then adjust the
path so it's smooth.
And then finally, I will change
the initial easing function
so the car accelerates
from a standstill.
So with these changes
we now see that the car
accelerates over the hill,
and then travels at
a constant speed.
Motion paths animate
using x and y translation.
So if you edit x
and y translation,
you edit the motion path.
For example, if I go here and I
change x to a different value,
I will see that I get both
a key in the timeline,
and a new control point
on the motion path.
If I then edit, say, y, or I
even go into the Selection tool
and I directly move the object,
that control point now moves.
All the other transform
channels, however, you
see translation,
rotation, and scale,
those all can be
animated independently

German: 
Ich kann hier beispielsweise
einen zweiten Key einfügen
und das Objekt ein wenig verschieben.
Dann passe ich noch den Verlauf des Pfads an.
Und schließlich ändere ich
die Easing-Funktion am Anfang,
sodass das Auto
aus dem Stillstand beschleunigt.
Durch diese Änderungen
beschleunigt das Auto zuerst über den Hügel
und bewegt sich dann gleichbleibend schnell.
Bewegungspfade werden mithilfe
der X- und Y-Verschiebung animiert.
Wenn ich also die Verschiebungen bearbeite,
ändere ich den Bewegungspfad.
Wenn ich beispielsweise hier
den Wert für X ändere,
sehe ich einen Key in der Zeitachse
und einen neuen Steuerungspunkt
im Bewegungspfad.
Wenn ich dann den Wert für Y
bearbeite oder im Auswahltool
das Objekt direkt verschiebe,
dann bewegt sich der Steuerungspunkt.
Die übrigen Bearbeitungsmodi wie
Z-Verschiebung, Rotation und Skalierung
können unabhängig vom Bewegungspfad

Thai: 
เช่น ผมจะเพิ่มคีย์ที่ 2 ตรงนี้
ย้ายวัตถุให้เคลื่อนที่ออกไปหน่อย
จากนั้นปรับเส้นทาง
ให้ลงจากเขาได้ราบรื่นขึ้น
สุดท้าย ผมจะเปลี่ยนฟังก์ชัน
การค่อยๆ เปลี่ยนในตอนแรก
เพื่อให้รถเร่งความเร็วขึ้น
หลังจากที่เปลี่ยนค่าต่างๆ แล้ว
จะเห็นว่ารถเร่งความเร็วระหว่างขึ้นเขา
จากนั้นเคลื่อนด้วยความเร็วแบบคงที่
เส้นทางการเคลื่อนไหวทำให้วัตถุเคลื่อนไหว
ด้วยการเปลี่ยนตำแหน่ง X และ Y
ถ้าคุณแก้ไขการเปลี่ยนตำแหน่ง X และ Y
คุณก็เปลี่ยนเส้นทางการเคลื่อนไหวไปด้วย
เช่น ถ้าผมเปลี่ยนค่า X ตรงนี้
จะเห็นว่าผมได้ทั้งคีย์ในไทม์ไลน์
และจุดควบคุมใหม่บนเส้นทางการเคลื่อนไหว
สมมติผมเปลี่ยน Y
หรือไปที่เครื่องมือการเลือก
และย้ายวัตถุเอง
จุดควบคุมก็จะเปลี่ยนตามไปด้วย
แต่ช่องทางการเปลี่ยนรูปแบบอื่นๆ ทั้งหมด
อย่างเช่น การเปลี่ยนตำแหน่ง
การหมุน และสัดส่วน
คุณสามารถทำให้เคลื่อนไหวได้เอง

Polish: 
Na przykład dodam tutaj drugą klatkę,
przesunę obiekt trochę do przodu,
wyrównam ścieżkę
i zmienię funkcję wygładzania,
by z początku samochód przyspieszał.
Po wprowadzeniu tych zmian
samochód przyspiesza na górce,
a potem ma stałą szybkość.
Ścieżki animacji stosują
przesunięcie względem osi x i y.
Jeśli zmienisz przesunięcie,
zmienisz kształt ścieżki.
Jeśli ustawię tutaj inną wartość x,
na osi czasu pojawi się klatka,
a na ścieżce animacji – punkt sterujący.
Jeśli zmienię wartość y
lub przeniosę obiekt
Narzędziem do zaznaczania,
punkt sterujący też zmieni położenie.
W przypadku pozostałych przekształceń,
czyli przesunięcia, obrotu i skali,
animacja jest niezależna

Turkish: 
Örneğin, şuraya ikinci bir anahtar ekliyorum
ve nesneyi biraz kenara çekip
yolu düzgün olacak şekilde ayarlıyorum.
Son olarak, duran arabanın
hızlanarak hareket etmesi için
başlangıç yumuşatma işlevini
değiştiriyorum.
Bu değişikliklerden sonra,
şimdi arabanın tepe üzerinde hızlanıp
ardından sabit bir hızla gittiğini görüyoruz.
Hareket yolları, x ve y dönüşümünü
kullanarak animasyon oluşturur.
Dolayısıyla x ve y hareketini
düzenlerseniz,
hareket yolunu düzenlemiş olursunuz.
Örneğin, burada x için
farklı bir değer belirtirsem,
hem zaman çizelgesinde bir anahtarım
hem de hareket yolunda
yeni bir kontrol noktam olur.
Ardından, örneğin y'yi düzenlersem
veya Seçim aracına gidip
doğrudan nesneyi taşırsam, ilgili
kontrol noktası da artık hareket eder.
Bununla birlikte, diğer tüm
dönüşüm kanalları,
-- burada gördüğünüz hareket,
dönüş ve ölçek gibi --
hareket yolu üzerinde
bağımsız olarak

Dutch: 
Ik kan hier bijvoorbeeld
een tweede sleutelframe toevoegen.
Ik verplaats het object iets naar buiten.
Vervolgens maak ik het pad soepel.
Tot slot verander ik
de easing in het begin,
zodat de auto versnelt uit stilstand.
Met deze wijzigingen
ziet u dat de auto versnelt over de heuvel
en dan met een constante snelheid doorrijdt.
Bewegingspaden worden geanimeerd
met de transformatie van x en y,
dus als we de transformatie
van x en y aanpassen,
wordt het bewegingspad aangepast.
Als ik hier bijvoorbeeld
x een andere waarde geef,
verschijnt er niet alleen
een sleutelframe op de tijdlijn,
maar ook een nieuw controlepunt
op het bewegingspad.
Als ik dan bijvoorbeeld y bewerk
of als ik het selectiegereedschap gebruik
om het object te verplaatsen,
beweegt dat controlepunt.
Alle andere transformatiekanalen,
z-transformatie,
rotatie en schaal,
kunnen onafhankelijk van het bewegingspad

Chinese: 
舉例來說
我在這裡新增一個鍵
然後把物件移出去一點
接著調整路徑
讓路徑變平緩
最後，調整之前的加/減速功能
讓這輛車從靜止開始加速
經過這些調整後
可以看到這輛車
會在越過山丘時逐漸加速
然後繼續以相同的速度移動
動態路徑是由 X 和 Y 軸的平移來建立動畫
所以只要調整 X 和 Y 軸平移
就可以調整動態路徑
舉例來說
如果我在這裡變更 X 值
時間軸上就會多出一個鍵
動態路徑上也會多出一個控制點
如果我調整 Y 值
或切換到「選取範圍」工具
然後直接移動物件
控制點也會跟著移動
所有其他的變形方式
例如平移、旋轉、縮放
都可以個別調整

Chinese: 
比如，我在这里再添加一个键
再将对象稍微移远一点
然后调整路径，让它平缓一些
最后，我会更改最初的加/减速功能
以便汽车能够从静止状态加速
进行上述更改后
我们现在可以看到汽车加速翻过小山
然后匀速前进
动画路径使用x轴和y轴平移来实现动画效果
因此，如果您修改x轴和y轴平移的值
就会修改动画路径
比如，如果我转到这里将x轴改成其他值
则会看到时间轴上多了一个键
在动画路径上多了一个新的控制点
如果我再修改，比如修改y轴的值
甚至切换到选择工具
然后直接移动对象，控制点也会跟着移动
不过，您会发现
所有其他变形途径
比如平移、旋转和缩放

Russian: 
Например, я добавлю здесь второй кадр,
перемещу объект немного дальше,
сделаю путь более плавным
и изменю динамику так,
чтобы машина ускорялась в начале.
Посмотрим, что получилось.
Машина разгоняется во время спуска,
а затем движется с постоянной скоростью.
Перемещение по путям – это
преобразование по осям X и Y.
Изменяя преобразование по осям Х и Y,
вы изменяете путь перемещения.
Например, если задать другое
значение преобразования по оси Х,
сдвигается ключевой кадр на временной шкале
и контрольная точка на пути перемещения.
Теперь, если изменить значение
по оси Y или переместить объект с помощью
инструмента выделения,
контрольная точка тоже сдвинется.
Другие каналы преобразования –
преобразование, вращение и масштаб –
можно независимо анимировать

French: 
Par exemple,
j'ajoute une deuxième image clé ici
et place l'objet un peu en retrait.
J'ajuste ensuite la trajectoire
de façon qu'elle reste fluide.
Enfin, je modifie le lissage de vitesse
pour que la voiture accélère
à un certain point.
Avec ces modifications,
la voiture accélère
en franchissant la colline
avant de reprendre une vitesse constante.
L'animation des trajectoires
dépend des valeurs de translation X et Y.
Ainsi, si vous les modifiez,
vous modifiez
la trajectoire d'animation elle-même.
Par exemple, si je change la valeur X ici,
j'obtiens une image clé dans la timeline
et un nouveau point de contrôle
sur la trajectoire d'animation.
Ensuite, si je modifie la valeur Y
ou si j'accède à l'outil de sélection
et déplace directement l'objet,
ce point de contrôle bouge aussi.
Tous les autres outils de transformation,
à savoir,
la translation, la rotation et l'échelle,
peuvent être animés indépendamment

Japanese: 
モーションパスとは別に行われます
それをお見せするために
再びパスの形を戻し
それをお見せするために
再びパスの形を戻し
丘を越えて走る車が
だんだん小さくなるようにしましょう
まずアニメーションの最後に移動し
選択ツールで車を縮小します
まずアニメーションの最後に移動し
選択ツールで車を縮小します
まずアニメーションの最後に移動し
選択ツールで車を縮小します
アニメーション全体を通じ
少しずつ縮小したいので
アニメーション全体を通じ
少しずつ縮小したいので
中間のスケーリングキーを削除します
これで再生してみましょう
パス上の移動は前と同じですが
車が少しずつ小さくなります
パス上の移動は前と同じですが
車が少しずつ小さくなります
最後に モーションパスの
仕組みを簡単に説明します
最後に モーションパスの
仕組みを簡単に説明します
GWDでは 他のアニメーションと同様
モーションパスもCSSで作成しています
GWDでは 他のアニメーションと同様
モーションパスもCSSで作成しています
ただしCSSでは正確に表現できないため
ただしCSSでは正確に表現できないため
サブピクセル精度への近似で
モーションパスを最適化し

Polish: 
od ścieżki animacji.
Weźmy taki przykład.
Przywrócę poprzedni kształt ścieżki.
Przypuśćmy, że po zjechaniu z górki
samochód ma się zmniejszyć.
Aby uzyskać taki efekt,
mogę przejść na koniec animacji
i zmniejszyć samochód
Narzędziem do zaznaczania.
Aby animacja obejmowała
cały zakres czasowy,
usunę środkową klatkę skalowania.
Gdy teraz odtworzę animację,
będzie taka sama jak wcześniej,
ale tym razem po zjechaniu z górki
samochód się zmniejszy.
Na koniec kilka słów
o przedstawianiu ścieżek animacji.
Google Web Designer tworzy animacje
i ścieżki animacji
w całości z kodu CSS.
Style CSS nie przedstawiają
dokładnie ścieżek animacji.
Style CSS nie przedstawiają
dokładnie ścieżek animacji.
Zamiast tego optymalizujemy ścieżkę

English: 
of the motion path.
So to illustrate
that, let's say,
if I go back to the
original path shape
that I want the car to shrink in
size as it goes over the hill.
What I can do is,
I can go to the end
of the animation.
Then with the Selection tool,
I can shrink the car down
to make the
animation happen over
the entire extent
of the time range.
I'm just going to remove
the middle Scaling key.
And now if I go back and
I play the animation,
I see that it's
the same as before.
But this time, the car shrinks
as it moves over the hill.
I'd like to conclude by
saying a little bit about how
we represent motion
paths internally.
Like all other animation
generated by Google Web
Designer, motion paths are
entirely constructed using CSS.
Now, CSS cannot be used to
exactly represent a motion
path.
So instead, we have an
optimization process

Russian: 
на пути перемещения.
Чтобы это продемонстрировать,
вернемся к исходному пути.
Сделаем так, чтобы машина
уменьшалась во время спуска.
Переходим
в конец анимации
и уменьшаем машину
с помощью инструмента выделения.
Чтобы анимация выполнялась
в течение всего времени,
удаляем промежуточный
кадр с масштабированием.
Смотрим анимацию.
Она такая же, как раньше,
но машина уменьшается во время спуска.
И наконец, я немного расскажу
о программной стороне
путей перемещения.
Как и вся анимация в Google Web Designer,
пути перемещения создаются с помощью CSS.
Однако сам по себе CSS не приспособлен
для этой задачи.
Поэтому мы написали оптимизатор, который

Portuguese: 
da demarcação de animação.
Para mostrar isso, digamos que
eu volte à forma do caminho original
em que o carro
ficará menor ao descer o monte.
Eu posso
ir até o final da animação.
Depois, posso reduzir o tamanho
do carro com a ferramenta Seleção
para que a animação aconteça
ao longo de todo o período.
Removerei o frame-chave
Dimensionamento do meio.
Agora, se eu voltar e reproduzir a animação,
verei que ela é como a anterior.
Porém, desta vez, o carro
ficará menor ao se movimentar pelo monte.
Para concluir, gostaria de explicar como
representamos internamente
a demarcação de animação.
Como todas as animações
geradas pelo Google Web Designer,
as demarcações de animação
são inteiramente criadas usando CSS.
Neste momento, não é possível usar
CSS para representar de modo preciso
uma demarcação de animação.
Por isso, como alternativa,
oferecemos um processo de otimização

German: 
animiert werden.
Das kann ich Ihnen gern zeigen.
Dazu gehe ich zurück zum
ursprünglichen Verlauf des Pfads.
Ich möchte, dass das Auto schrumpft,
wenn es über den Hügel fährt.
Das erreiche ich so:
Ich gehe zum Ende der Animation.
Dann verkleinere ich das Auto
mithilfe des Auswahltools.
Damit die Animation
über die gesamte verfügbare
Dauer abgespielt wird,
entferne ich einfach
den mittleren Skalierungs-Key.
Wenn ich die Animation jetzt abspiele,
erhalte ich das gleiche Ergebnis wie vorher.
Allerdings schrumpft das Auto jetzt
bei der Fahrt über den Hügel.
Zum Schluss möchte ich noch zeigen,
wie wir Bewegungspfade intern nutzen.
Wie alle mit Google Web Designer
entwickelte Animationen
werden auch Bewegungspfade mit CSS erstellt.
Damit lassen sich Bewegungspfade
allerdings nicht genau
nachbilden.
Es handelt sich eher um einen
Optimierungsprozess,

Chinese: 
都可以在不影响动画路径的前提下
呈现相应的动画效果
为了方便演示
假设我要把路径恢复为原始形状
并且希望汽车在翻过这座小山后变小
那么，我可以采取的操作是
转到动画的终点
然后借助选择工具把汽车变小
为了让该动画效果
在整个时间范围内呈现
我只需移除中间的“缩放”键
现在，如果我回到起点并播放动画
就会看到和之前基本一样的移动
但这一次，汽车在翻过小山后会变小
在结束之前，我想再稍微介绍一下
我们在内部是如何表示动画路径的
与Google Web Designer
生成的所有其他动画一样
动画路径是完全使用CSS构建的
目前，CSS无法用于精确表示动画路径
 
因此，我们采用了一种优化流程

Spanish: 
de la ruta de movimiento.
Para verlo
volvamos a la forma original de la ruta.
Si quiero reducir el tamaño del coche
mientras sube la cuesta
voy al final de la animación
y lo hago con la herramienta Selección
para que la animación
ocurra durante
todo el intervalo de tiempo.
Quito el fotograma de escala del medio
y, si retrocedo
y reproduzco la animación
veo que es igual que antes
pero el tamaño del coche
se reduce al subir la cuesta.
Para terminar, veamos cómo
representamos internamente
las rutas de movimiento.
Como las demás animaciones
generadas en Google Web Designer
las rutas de movimiento
se construyen solo con CSS.
Pero las CSS no pueden representar
exactamente una ruta de movimiento.
Por ello, tenemos
un proceso de optimización

Korean: 
애니메이션을 적용할 수 있습니다
이러한 과정을 보여드리기 위해
원래의 경로 모양으로 돌아가
언덕 위로 올라갈 때 차의 크기가
축소되도록 만들어 보겠습니다
이제 애니메이션
끝으로 이동합니다
그런 다음 선택 도구를 사용하면
전체 재생 시간에 걸쳐
차 크기가 축소되도록
애니메이션을 적용할 수 있습니다
중간의 크기 조절 키를 제거하고
다시 돌아가 애니메이션을 재생하면
이전과 동일하게 움직이지만
이번에는 언덕을 올라가는 차의 크기가
축소되는 것을 볼 수 있습니다
마지막으로
Google 팀 내에서 모션 경로를
어떻게 만드는지에 대해
말씀해 드리겠습니다
Google Web Designer에서
생성된 다른 모든 애니메이션과
마찬가지로, 모션 경로는 전적으로
CSS를 사용하여 만들어집니다
하지만 CSS는 모션 경로를
정확히 표현하기 위한 용도로는
사용할 수 없습니다
Google에서는 대안으로
최적화 과정을 마련해 두었습니다

French: 
de la trajectoire d'animation.
Par exemple,
je récupère la forme d'origine
de la trajectoire
et j'aimerais réduire la taille de la voiture
lorsqu'elle franchit la colline.
Pour ce faire,
je vais au bout de l'animation,
puis je réduis la taille de la voiture
à l'aide de l'outil de sélection.
Pour que l'animation s'étende
sur toute la durée,
supprimez l'image clé de mise à l'échelle
au milieu de l'animation.
À présent, si je relance l'animation,
je vois qu'elle n'a pas changé,
mais cette fois,
la taille de la voiture diminue
en franchissant la colline.
Pour terminer, j'aimerais vous parler
de la conception interne
des trajectoires d'animation.
Comme toutes les autres animations
générées par Google Web Designer,
les trajectoires d'animation sont
entièrement composées de code CSS.
Toutefois, le code CSS ne permet pas
de les représenter avec exactitude.
 
C'est pourquoi nous disposons
d'un processus d'optimisation

Thai: 
โดยไม่ยึดติดกับเส้นทางการเคลื่อนไหว
ผมจะสาธิตให้คุณเห็น
ถ้ากลับไปใช้รูปร่างเส้นทางเดิม
ที่ผมจะให้รถมีขนาดเล็กลง
เมื่อลงจากเขา
ก็ทำได้โดย
ไปที่จุดสิ้นสุดของภาพเคลื่อนไหว
ใช้เครื่องมือการเลือก
และลดขนาดของรถ
เพื่อให้การเคลื่อนไหว
เกิดขึ้นตลอดทั้งช่วงเวลา
ผมจะลบคีย์การปรับขนาดตรงกลาง
ทีนี้ พอผมเล่นภาพเคลื่อนไหวใหม่
รถก็จะเคลื่อนที่เหมือนเดิม
แต่คราวนี้จะลดขนาดลง
เมื่อข้ามเขาลูกนี้
ผมจะขอจบการสาธิตด้วยการพูดถึง
วิธีที่เราแสดงถึง
เส้นทางการเคลื่อนไหวในโปรแกรม
เช่นเดียวกับภาพเคลื่อนไหวทั้งหมด
ที่สร้างใน Google Web Designer
เส้นทางการเคลื่อนไหวนั้น
สร้างขึ้นมาโดยใช้ CSS ทั้งหมด
ทีนี้ CSS จะใช้แสดงถึง
เส้นทางการเคลื่อนไหวที่แท้จริงไม่ได้
เราจึงมีกระบวนการเพิ่มประสิทธิภาพ

Italian: 
dal percorso di animazione.
Per mostrartelo
torno alla forma originale del percorso
su cui desidero ridurre le dimensioni
dell'auto mentre si sposta sulla collina.
Ciò che posso fare è
andare alla fine dell'animazione.
Poi posso rimpicciolire l'auto
con lo strumento Selezione.
Per far durare l'animazione
per l'intero intervallo di tempo
rimuoverò soltanto il fotogramma chiave
centrale di ridimensionamento.
Ora se torno indietro
e riproduco l'animazione
vedo che è sempre uguale
ma questa volta l'auto si rimpicciolisce
mentre si sposta sulla collina.
Vorrei concludere parlando un po'
della rappresentazione interna
dei percorsi di animazione.
Come tutte le altre animazioni
generate in Google Web Designer
i percorsi di animazione vengono
interamente realizzati usando CSS.
Non è possibile usare CSS
per rappresentare esattamente
un percorso di animazione.
Quindi usiamo una procedura di ottimizzazione

Dutch: 
worden geanimeerd.
Ter illustratie:
terwijl ik terugga naar
de oorspronkelijke vorm van het pad,
stel dat de auto kleiner moet worden
wanneer deze over de heuvel rijdt.
Wat ik kan doen,
is naar het eind van de animatie gaan
en met het selectiegereedschap de auto verkleinen.
Als we de animatie willen uitspreiden over
de gehele duur,
haal ik het middelste
schaalsleutelframe weg.
Als ik nu de animatie afspeel,
is deze hetzelfde als eerst,
alleen wordt de auto kleiner
wanneer deze de heuvel over rijdt.
Ik wil graag afsluiten
door kort uit te leggen hoe
bewegingspaden intern werken.
Net als andere animaties
die worden gemaakt met Google Web
Designer, worden bewegingspaden
geheel gemaakt met CSS.
CSS kan geen
exacte weerspiegeling zijn van
een bewegingspad.
In plaats daarvan
is er een optimalisatieproces

English: 
of the motion path.
So to illustrate
that, let's say,
if I go back to the
original path shape
that I want the car to shrink in
size as it goes over the hill.
What I can do is,
I can go to the end
of the animation.
Then with the Selection tool,
I can shrink the car down
to make the
animation happen over
the entire extent
of the time range.
I'm just going to remove
the middle Scaling key.
And now if I go back and
I play the animation,
I see that it's
the same as before.
But this time, the car shrinks
as it moves over the hill.
I'd like to conclude by
saying a little bit about how
we represent motion
paths internally.
Like all other animation
generated by Google Web
Designer, motion paths are
entirely constructed using CSS.
Now, CSS cannot be used to
exactly represent a motion
path.
So instead, we have an
optimisation process

Chinese: 
用來建立動態路徑動畫
為了方便說明
我先還原成原始的路徑形狀
這次要讓車子在越過山丘後
變得越來越小
要做到這一點
可以前往動畫末端
然後使用「選取範圍」工具
把車子縮小
為了從這裡開始顯示縮小的過程
為了從這裡開始顯示縮小的過程
我把中間的「縮放」鍵移除
現在再次播放動畫
可以看到基本上和之前一樣
但這次車子會在越過山丘後
逐漸縮小
最後我想要稍微說明一下
動態路徑的內部表示機制
Google Web Designer 的動態路徑
和其他動畫一樣
是完全運用 CSS 建構出來的
CSS 無法精確表示動態路徑
CSS 無法精確表示動態路徑
所以我們使用最佳化程序

Turkish: 
hareket ettirilebilir.
Bunu göstermek için
örneğin,
ilk baştaki yol şekline geri dönelim.
Arabanın tepe üzerinden geçip giderken
küçülmesini istiyorum.
Bunu şöyle yapabilirim:
Animasyonun sonuna gidip,
Seçim aracını kullanarak
arabanın boyutunu küçültebilir
ve bunu yaparken animasyonun
tüm zaman aralığını
kapsamasını sağlayabilirim.
Ortadaki Ölçekleme
anahtarını kaldırıyorum.
Şimdi geri dönüp
animasyonu oynatıyorum.
Öncekiyle aynı olduğunu görüyorum.
Ancak bu sefer araba tepe üzerinden
geçip giderken küçülüyor.
Son olarak, hareket yollarını
oluşturmak için kullandığımız
teknik hakkında bir şeyler
söylemek istiyorum.
Google Web Designer'ın
oluşturduğu diğer tüm
animasyonlar gibi, hareket yolları da
tamamen CSS ile yapılır.
Ancak CSS bir hareket yolunu
tam olarak ifade etmek için
kullanılamıyor.
Bu nedenle, optimizasyon
işleminden yararlanırız.

English: 
that approximates the motion
path to subpixel accuracy,
while minimizing
the amount of CSS
that we generate to minimize
the storage footprint.
So in the Property
Inspector, you
can see the tolerances that
we use for the optimization.
We always stay within half a
pixel of the ideal position
and within 1 degree
of the ideal angle.
Now at author time,
to keep interactivity,
when we run the
optimizer, we use
settings that cause
it to finish quickly,
but perhaps using more CSS
than is strictly necessary.
If you want to squeeze
out some space,
then you can rerun the
solver with settings
that take a bit
longer to complete,
but that usually improves
the amount of CSS that's
generated, by clicking this
button labeled Optimized Curve.
So right now, the estimated
compressed size is 346 bytes.
And if I click this button,
then it goes down to 300 bytes.
That's all I had to
say about motion paths.
Thank you for watching.

Spanish: 
que da a la ruta de movimiento
una precisión parecida a los subpíxeles
y minimiza la cantidad de CSS
que generamos
para reducir el espacio de almacenamiento.
En el inspector de propiedades
vemos las tolerancias
que usamos para la optimización.
No nos alejamos nunca
más de medio píxel de la posición ideal
ni más de 1 grado del ángulo ideal.
Para conservar la interactividad
al crear la animación
y ejecutar el optimizador
usamos ajustes que hacen
que termine rápidamente.
Pero quizá usamos
más CSS de lo necesario.
Para ahorrar espacio
puedes volver a ejecutar
la herramienta con ajustes
un poco más lentos.
Esto suele mejorar
la cantidad de CSS generadas.
Haz clic en Optimizar curva.
El tamaño comprimido estimado
es de 346 bytes.
Si hago clic en el botón,
se reduce a 300 bytes.
Esto es todo por ahora.
Gracias por tu atención.

English: 
that approximates the motion
path to subpixel accuracy,
while minimising
the amount of CSS
that we generate to minimise
the storage footprint.
So in the Property
Inspector, you
can see the tolerances that
we use for the optimisation.
We always stay within half a
pixel of the ideal position
and within 1 degree
of the ideal angle.
Now at author time,
to keep interactivity,
when we run the
optimiser, we use
settings that cause
it to finish quickly,
but perhaps using more CSS
than is strictly necessary.
If you want to squeeze
out some space,
then you can rerun the
solver with settings
that take a bit
longer to complete,
but that usually improves
the amount of CSS that's
generated, by clicking this
button labeled optimised Curve.
So right now, the estimated
compressed size is 346 bytes.
And if I click this button,
then it goes down to 300 bytes.
That's all I had to
say about motion paths.
Thank you for watching.

Chinese: 
尽可能以子像素精度来表示动画路径
同时尽可能减小生成的CSS
以最大限度地节省存储空间
因此，您可以在“属性检查器”中
看到我们用于进行优化的各种公差
我们始终保持在理想位置的半个像素以内
在理想角度的1度以内
您制作动画时，为了保证出色的互动
我们会在运行优化程序时
使用能让程序迅速完成的设置
但这样一来，所用的CSS的大小就
有可能超出严格要求的大小
如果您想要挤出一些空间
可以点击这个标记为“优化曲线”的按钮
重新运行优化程序
虽然这样花费的时间稍长
但相应的设置通常能缩小所生成的CSS
现在估计压缩后大小是346字节
如果点击这个按钮，则还能再缩小到300字节
以上就是有关动画路径的介绍
谢谢观看！

French: 
qui produit
la trajectoire d'animation au sous-pixel près,
tout en réduisant
la quantité de code CSS,
ce qui limite la taille des fichiers.
Dans les propriétés, vous pouvez voir
les valeurs de tolérance
utilisées pour l'optimisation.
La trajectoire se trouve toujours au
maximum à 0,5 pixel de la position idéale
et à 1 degré maximum de l'angle idéal.
Afin de préserver l'interactivité
de notre exemple,
je vais définir des paramètres
qui favoriseront une optimisation rapide,
mais qui requerront peut-être
plus de code CSS que nécessaire.
Pour réduire la taille de l'animation,
exécutez à nouveau l'optimiseur
avec des paramètres
dont l'application prend
un peu plus de temps,
mais qui, en général,
limitent la quantité de code CSS générée.
Pour ce faire,
cliquez sur "Optimiser la courbe".
Actuellement, la taille compressée
est estimée à 346 octets.
Si je clique sur ce bouton,
elle est réduite à 300 octets.
Ainsi se termine la vidéo
consacrée aux trajectoires d'animation.
Merci de votre attention.

Dutch: 
dat het bewegingspad benadert
met een nauwkeurigheid van subpixels,
terwijl zo min mogelijk CSS wordt gebruikt,
zodat de bestandsgrootte
zo klein mogelijk blijft.
In het deelvenster Eigenschappen kunt u
zien welke toleranties
we voor de optimalisatie gebruiken.
We blijven altijd binnen
een halve pixel van de ideale positie
en binnen één graad van de ideale hoek.
Voor het behoud van interactiviteit
wanneer we optimalisatie
uitvoeren, gebruiken we
instellingen die ervoor zorgen
dat het snel klaar is,
maar waarbij misschien iets meer CSS
wordt gebruikt dan strikt noodzakelijk is.
Als u een beetje ruimte wilt besparen,
kunt u instellingen gebruiken
die er wat langer over doen,
maar waarvoor doorgaans
minder CSS wordt gegenereerd.
Hiervoor klikt u op
de knop 'Curve optimaliseren'.
De geschatte gecomprimeerde
grootte is nu 346 bytes.
Als ik op deze knop klik,
daalt de grootte naar 300 bytes.
Dat was wat ik
te vertellen had over bewegingspaden.
Bedankt voor het kijken.

Polish: 
i przedstawiamy w przybliżeniu
z dokładnością do subpiksela.
Zmniejsza to ilość kodu CSS
i zajmowanej pamięci.
W inspektorze właściwości
widać tolerancje
stosowane do optymalizacji.
Odchylenie od idealnej pozycji
nie przekracza pół piksela,
a od idealnego kąta – jednego stopnia.
Ustawienia optymalizatora
zapewniają szybkość
podczas pracy nad animacją,
ale kod CSS może
być większy, niż to konieczne.
Jeśli chcesz zaoszczędzić miejsce,
możesz powtórzyć
optymalizację z ustawieniami,
które trochę ją wydłużą,
ale zmniejszą ilość
generowanego kodu CSS.
Wystarczy kliknąć
Optymalizuj krzywą.
Teraz szacunkowy rozmiar
skompresowanego pliku to 346 bajtów.
Po kliknięciu tego przycisku
zmniejszy się do 300 bajtów.
To wszystko o ścieżkach animacji.
Dziękuję za uwagę.

Italian: 
che approssima la precisione
dei percorsi di animazione ai sottopixel
e riduce al minimo la quantità di codice CSS
generata per ridurre il più possibile
il footprint di archiviazione.
Nel pannello Proprietà
puoi vedere le tolleranze che
usiamo per l'ottimizzazione.
Rimaniamo sempre entro metà
di un pixel della posizione ideale
ed entro 1 grado dell'angolo ideale.
Per mantenere l'interattività
in fase di creazione
quando eseguiamo
lo strumento di ottimizzazione
usiamo impostazioni che consentono
di terminare rapidamente l'operazione
ma magari usando più CSS di quanto
ne sia strettamente necessario.
Se vuoi ottimizzare lo spazio
puoi eseguire di nuovo
il risolutore con impostazioni
che richiedono più tempo per il completamento
ma che in genere
migliorano la quantità di CSS
generata facendo clic su questo
pulsante Ottimizza curva.
Al momento, le dimensioni compresse
stimate sono pari a 346 byte.
Se faccio clic su questo pulsante
si riducono a 300 byte.
È tutto sui percorsi di animazione.
Grazie per l'attenzione.

German: 
der sich dem Bewegungspfad
auf Subpixel-Genauigkeit annähert.
Damit wird die Menge an CSS,
die generiert werden muss,
verringert, und somit auch
der benötigte Speicherplatz.
Im Eigenschaftenbereich sehen Sie
die Toleranzbereiche für die Optimierung.
Wir sind nie mehr als ein halbes
Pixel von der Idealposition entfernt
und nie mehr als ein Grad vom Idealwinkel.
Bei der Erstellungszeit
erhalten wir die Interaktivität,
mithilfe des Optimierungstools,
das wir so einstellen,
dass der Vorgang schnell abgeschlossen wird.
Dabei wird allerding mehr CSS genutzt,
als unbedingt notwendig.
Wenn Sie Speicherplatz sparen möchten,
können Sie
den Auflöser noch einmal
mit Einstellungen ausführen,
die den Vorgang etwas verlangsamen,
aber weniger CSS generieren.
Dazu klicken Sie auf die
Schaltfläche "Kurve optimieren".
Hier sehen Sie, dass die geschätzte
komprimierte Größe zurzeit 346 Byte beträgt.
Wenn ich auf diese Schaltfläche klicke,
verringert sie sich auf 300 Byte.
So viel zum Thema Bewegungspfade.
Vielen Dank für Ihre Aufmerksamkeit.

Turkish: 
Optimizasyonla, hareket yolu alt piksel
düzeyinde doğruluğa yaklaştırılırken,
oluşturduğumuz CSS'nin boyutunu
küçülterek
daha az alan harcanmasını sağlarız.
Özellik Denetçisi'nde
optimizasyon için kullandığımız
toleransları görebilirsiniz.
Her zaman ideal konumun yarım
piksel içinde
ve ideal açının da 1 derece içinde kalırız.
Düzenleme sırasında etkileşimi
korumak için
optimize ediciyi çalıştırdığımızda,
hızlı bir şeklide bitmesini
sağlayan ayarları kullanıyoruz.
Bunu yaparken belki de gereğinden
fazla CSS kullanıyoruz.
Sıkıştırma yaparak alandan
kazanmak isterseniz
çözücüyü, daha uzun sürede
tamamlamasına neden olacak
ayarlarla tekrar çalıştırabilirsiniz.
Bunu yapmak için,
Eğriyi Optimize Et düğmesini
tıklayarak, oluşturulan CSS'nin
miktarını azaltabilirsiniz.
Şu anda tahmini sıkıştırılmış
boyut 346 bayt.
Bu düğmeyi tıkladığımda
boyut 300 bayta düşüyor.
Hareket yolları hakkında
anlatacaklarım bu kadar.
İzlediğiniz için teşekkürler.

Russian: 
аппроксимирует путь перемещения
с субпиксельной точностью,
а также уменьшает объем CSS,
чтобы сэкономить место.
На панели свойств
можно настроить допустимое
отклонение для оптимизации.
По умолчанию это
0,5 пикс. для положения
и 1 градус для угла.
Чтобы не замедлять работу,
автоматическая оптимизация выполняется
с максимальной скоростью,
но при этом объем CSS
чуть больше необходимого.
Чтобы сэкономить больше места,
можно выполнить оптимизацию с настройками,
которые будут дольше обрабатываться,
но обеспечат минимальный объем CSS.
Для этого нажмем кнопку
"Оптимизировать кривую".
Сейчас ориентировочный
размер сжатого кода – 346 байтов.
Нажмем эту кнопку,
и он сократится до 300 байтов.
Вот и все, что я хотел рассказать
о путях перемещения.
Спасибо за внимание.

Thai: 
ที่ประมาณเส้นทางการเคลื่อนไหว
ให้มีความแม่นยำระดับพิกเซลย่อย
และลดปริมาณ CSS
ที่เราสร้างไปพร้อมๆ กัน
เพื่อไม่ให้เปลืองพื้นที่จัดเก็บ
ดังนั้น ในเครื่องมือตรวจสอบคุณสมบัติ
คุณจะเห็นความคลาดเคลื่อนที่เราใช้
สำหรับการเพิ่มประสิทธิภาพ
เราจะรักษาตัวเลขไม่ให้เกิน 0.5 พิกเซล
จากตำแหน่งที่เหมาะสม
และไม่เกิน 1 องศาจากมุมที่เหมาะสม
ในขณะที่สร้าง
เราจะรักษาความสามารถในการโต้ตอบ
ระหว่างที่เรียกใช้
เครื่องมือเพิ่มประสิทธิภาพ
ด้วยการใช้การตั้งค่า
ที่ทำให้การสร้างเสร็จเร็ว
แต่ก็อาจทำให้ต้องใช้ CSS
มากกว่าที่จำเป็น
ถ้าคุณอยากประหยัดพื้นที่
คุณสามารถเรียกใช้ตัวแก้ปัญหาอีกครั้ง
โดยใช้การตั้งค่า
ที่ทำให้การสร้างใช้เวลานานขึ้น
แต่มักช่วยลดปริมาณ CSS ที่สร้าง
เพียงคลิกปุ่ม
"เพิ่มประสิทธิภาพเส้นโค้ง"
ตอนนี้ขนาดไฟล์ที่บีบอัด
จะอยู่ที่ประมาณ 346 ไบต์
แต่พอคลิกปุ่มนี้
ก็จะลดลงเหลือ 300 ไบต์
เรื่องเส้นทางการเคลื่อนไหว
ก็จบเพียงเท่านี้ครับ
ขอขอบคุณที่รับชมครับ

Portuguese: 
que aproxima a demarcação de animação
da precisão do subpixel.
A quantidade de CSS que geramos
é minimizada para liberar
espaço de armazenamento.
No Inspetor de propriedades, é possível ver
as tolerâncias usadas para essa otimização.
Sempre nos mantemos
até meio pixel da posição ideal
e 1° do ângulo ideal.
Para manter a interatividade
no momento da criação
ao executar o otimizador, usamos
as configurações que provocam
a finalização rápida dele,
porém usando mais CSS do que o necessário.
Se quiser criar espaço,
você poderá executar o recurso
novamente com configurações
que levam mais tempo para serem concluídas.
Isso normalmente diminui
o volume gerado de CSS
ao clicar no botão "Curva otimizada".
Agora, o tamanho
compactado estimado é de 346 bytes.
Ao clicar nesse botão,
ele é reduzido para 300 bytes.
Isso é tudo sobre as demarcações de animação.
Agradecemos a atenção.

Korean: 
이를 통해 하위 픽셀 수준 정확도로
모션 경로 근사치를
계산하는 동시에,
생성되는 CSS의 양을 줄여서
저장 공간 사용량을
최소화할 수 있습니다
속성 검사기에서는 최적화에 사용하는
허용 범위를 확인할 수 있습니다
허용 범위는 항상
이상적인 위치에서 0.5픽셀 이내,
이상적인 각도에서 1도 이내를
벗어나지 않습니다
이제 작성 단계에서는
애니메이션을 유지하면서
최적화 도구를 실행하고,
애니메이션이 빠르게
완료되는 설정을 사용합니다
하지만 더 많은 CSS를 꼭
사용해야 할 수도 있습니다
공간을 어느 정도 더 확보하려면
완료하는 데 더 오래 걸리는 설정으로
도구를 다시 한 번 실행할 수 있습니다
그러면 보통 생성되는
CSS 수가 줄어드는데
이는 최적화된 곡선이라는 라벨이
지정된 버튼을 클릭하면 됩니다
현재 예상 압축 크기는 346바이트입니다
이 버튼을 클릭하면
크기가 300바이트로 줄어듭니다
이것으로 모션 경로에 대한
설명을 마치겠습니다
시청해 주셔서 감사합니다

Japanese: 
サブピクセル精度への近似で
モーションパスを最適化し
CSSの生成を最小限に抑えて
ストレージを節約しています
CSSの生成を最小限に抑えて
ストレージを節約しています
プロパティを見ると
最適化の許容誤差がわかります
プロパティを見ると
最適化の許容誤差がわかります
理想の位置から0.5ピクセル以内
理想の角度から1度以内となっています
理想の位置から0.5ピクセル以内
理想の角度から1度以内となっています
オーサリング時の最適化は
速く完了するよう緩めに設定してあり
オーサリング時の最適化は
速く完了するよう緩めに設定してあり
オーサリング時の最適化は
速く完了するよう緩めに設定してあり
CSSは必要最小限よりは
少し多めに生成されます
スペースを空けたい時は
少し時間がかかる設定で最適化し直します
スペースを空けたい時は
少し時間がかかる設定で最適化し直します
スペースを空けたい時は
少し時間がかかる設定で最適化し直します
[曲線を最適化]をクリックすると
生成されるCSSの量が減ります
[曲線を最適化]をクリックすると
生成されるCSSの量が減ります
現在の圧縮済みサイズは
346バイトですが
このボタンをクリックすると
300バイトまで減りました
モーションパスについては以上です
ありがとうございました

Chinese: 
讓動態路徑儘可能
達到子像素級精度
同時最大程度地
減少產生的 CSS 代碼量
將儲存佔用空間降到最小
因此屬性檢查器中
會顯示最佳化程度的容錯值
理想位置的容錯值
是控制在半個像素內
理想角度則是控制在 1 度內
在編輯期間
為了保持互動性
我們在執行最佳化工具時
會透過設定快速完成整個程序
但這樣一來 CSS 用量
可能會超出必要範圍
如果想要騰出一些空間
你可以設定重新執行解算器
這個程序可能會比較久
但通常可以減少產生的 CSS 代碼量
只要點選 [最佳化曲線] 按鈕即可
現在的估計壓縮大小是 346 個位元組
如果我點選這個按鈕
就會降到 300 位元組
動態路徑的介紹
就到此告一段落
感謝收看
