Advanced Animations Tool (using Unity)
-
- Posts: 25
- Joined: Sun Apr 10, 2016 8:40 pm
Advanced Animations Tool (using Unity)
Advanced Animations Tool
written by Dr. Jekyll
I made tool to make animating complex quads easier.
Its an editor extension for the Unity3D Editor (free)
Because its in Unity, you can do a few important animtion things like scrubbing the timeline and constructing parent-child hierarchies, as well as full undo support.
My editor Unity package here:
https://www.dropbox.com/s/tvfclq296f9yx ... ckage?dl=0
In Unity, go to "Assets > Import Package > Custom Package" and import my package, then go to "Window > TeeQuads" To open the extension
Click "Create new quads from image" and browse to your mapres, then choose where to import to in the unity project (i recommend creating a folder for each quad, because it creates a bunch of other assets)
The editor will automatically slice your mapres to create a bunch of quads.
(and add a default "Tee for scale" so you know how big your stuff will look in Teeworlds.) [The new quads might not be visible in the view, select the object in the "Hierarchy" window and press 'F' to move the viewport camera]
I recommend having 2 viewports for working on quads, one should be a "Back" ortho view (this represents the teeworlds view) and a perspective view (you need to move them towards/away from the camera) You can click the parts on these gizmos to rotate the view (click the center to switch between ortho and perspective), or Alt+left-click in the viewport to rotate freely I suggest naming all the quads for clarity.
You should move them forwards and backwards in the perspective view to determine draw order (eyes infront of body, etc).
You can sort them into a parent/child hierarchy by dragging them un and down the list ("Hierarchy" window [on the right in image, may be on the left in default layout] - really important for making complex animation, child objects 'inherit' a parents motion, without need to be animted themselves)
Naming and hierarchy changes should be done before you start animting, making changes later will result in errors (fixable - see blow)
You can also scale them to make them bigger/smaller if you need
Move / Rotate / Scale buttons are in the top right of the screen Now go to "Window > Animation" to open Unity's animation view. You can scrub the timeline back and forward to change time
Move the quads in either view to begin animating. The extension will export movement on X and Y (up, down, left and right in the "Back" view) and rotation on the Z axis, and color changes (The color swatch on the right - you may have to expand the material block to show it)
You cannot export scale changes. If you need to adjust the scale, make sure you turn off the red record button in the animation window To export to a tee map, change the TeeQuads window to "Modify Map".
Click "Load File" and browse to your map. You should set the map up beforehand with a quad layer ready to accept the new quads.
Drag the quad object (from the "Hierarchy" list on the right) into the correct layers slot, and click Save.
That's all!
Note that if you make changes in Teeworlds, you will need to reload the map in unity.
Also note that you cannot save a map if it's loaded in the Server application (sharing violation), but you can save when its open in the tee editor
The editor will not overwrite any existing envelopes in the map file, including ones it creates when you export. If you repeatedly export your animation it makes new envelopes each time. The "Clear All" envelopes button deletes all envelopes from the map, so you can export again.
For this reason I strongly recommend creating your animations into a blank map, which you can later Append into your real maps (so you dont accidently delete other envelopes). Other buttons in the editor:
Click "Re-import image" if you make changes to the source mapres image
Click "Regenerate Quads from image" to delete quads and revert to the automatic sliced layout.
Click "Make all keys linear" to change all curves in the unity animtion to linear. My exporter only sets linear curves in teeworls envelopes, because alot of the key blending you can do in Unity doesnt translate to teeworlds, and using fancy curves in unity might not apply correctly after export Click "Edit Quad Points" to open another window. In the window:
If you ever change a quads name, or alter the hierarchy after you have done some animation, the anition will break, shown in the the unity animation window with yellow text (see inset image)
To fix this, click "Fix Animation Hierarchy" to open another window
The Left column "Object Path" shows what the animator thinks are the quad object hierarchies
The middle column "Quad Object" contains references to the actual objects
The left column show how many animated properties are preset for each object (position x, y, z, rotation, color etc [dont worry about this - debug])
Green fields mean the object can be loacted by the animtor, and everything is fine
Red fields mean the object has changed. Drag the quad you changed into the slot in the middle column to show the animator where the object is now
The fields turn Yellow to show that you have modified one.
Click "Save" to update the animator
Lastly theres a feature that will import quads from a tee map into unity
Animation is not imported (its impossible to reconstruct a hierachy animation going from tee -> unity) and will not be preserved when you export back to teeworlds
This is mainly for making adjustments to static quads, eg to change point colors in a more user-friendly manner
In the "Modify Map" screen, expand the quad layer you want to import, to reveal the button
Click "Load Quads into new Object" and you will be prompted to select the image used by the quads (again, create a folder for all the assets).
A couple of final points regarding envelopes:
Each animated object creates a new envelope, if you have multiple objects that can use the same envelope, you can tell the exported to copy envelopes from other objects.
With any quad selected, on the right of the screen is a block titled "Copy Envelopes" with 4 modifyable properties.
Drag another object from the Hierachy window into "Copy Position From" or "Copy Color From" to have this quad copy that quads envelope. You can also adjust the timing offsets with the "Pos Env Offset" values (Pos TO and Color TO in the tee editor)
Unfortunatly, this doesnt actually make them update to show the copied animation inside Unity, you just have to pretend until you export.
If you have one quad as a child of another, and you dont directly animate the child (but the child moves as a result of the parent being animated), the exporter automatically assumes it should copy the parents position animation (color is not automatically copied) [Note: you need to make sure the quad pivots are aligned for rotation to look good]
[Example: The tee's hand (gif above) is a child of the pickaxe. The pickaxe is animated to go up and down, but the hand is not itself animated]
Note about the unity editor layout
When you first install Unity, it's probably going to have a different screen layout to my images. in the top right of the screen theres a button (possibly says 'Default') that lets you change the layout - '4 split' will arrange it similar to mine
Note about errors
If you have the console open, sometimes errors appear while using this editor, none of them actually seem to stop it working though, and you can just ignore them (hopefully). The only exception is the sharing violation mentioned earlier (change map in tee server app)
Apologies if this is a bit over-the-top for a 'simple' animtion tool (unity install is not small, means learning the unity interface) but since it's maybe only going to used by a few serious map artists its probably fine.
Maybe one day I'll write it directly into teeworlds, but since theres no Undo, or quad hierarchy, or scaling, or box select, or timline-scrubbing.....
Also I dont really C++
written by Dr. Jekyll
I made tool to make animating complex quads easier.
Its an editor extension for the Unity3D Editor (free)
Because its in Unity, you can do a few important animtion things like scrubbing the timeline and constructing parent-child hierarchies, as well as full undo support.
My editor Unity package here:
https://www.dropbox.com/s/tvfclq296f9yx ... ckage?dl=0
In Unity, go to "Assets > Import Package > Custom Package" and import my package, then go to "Window > TeeQuads" To open the extension
Click "Create new quads from image" and browse to your mapres, then choose where to import to in the unity project (i recommend creating a folder for each quad, because it creates a bunch of other assets)
The editor will automatically slice your mapres to create a bunch of quads.
(and add a default "Tee for scale" so you know how big your stuff will look in Teeworlds.) [The new quads might not be visible in the view, select the object in the "Hierarchy" window and press 'F' to move the viewport camera]
I recommend having 2 viewports for working on quads, one should be a "Back" ortho view (this represents the teeworlds view) and a perspective view (you need to move them towards/away from the camera) You can click the parts on these gizmos to rotate the view (click the center to switch between ortho and perspective), or Alt+left-click in the viewport to rotate freely I suggest naming all the quads for clarity.
You should move them forwards and backwards in the perspective view to determine draw order (eyes infront of body, etc).
You can sort them into a parent/child hierarchy by dragging them un and down the list ("Hierarchy" window [on the right in image, may be on the left in default layout] - really important for making complex animation, child objects 'inherit' a parents motion, without need to be animted themselves)
Naming and hierarchy changes should be done before you start animting, making changes later will result in errors (fixable - see blow)
You can also scale them to make them bigger/smaller if you need
Move / Rotate / Scale buttons are in the top right of the screen Now go to "Window > Animation" to open Unity's animation view. You can scrub the timeline back and forward to change time
Move the quads in either view to begin animating. The extension will export movement on X and Y (up, down, left and right in the "Back" view) and rotation on the Z axis, and color changes (The color swatch on the right - you may have to expand the material block to show it)
You cannot export scale changes. If you need to adjust the scale, make sure you turn off the red record button in the animation window To export to a tee map, change the TeeQuads window to "Modify Map".
Click "Load File" and browse to your map. You should set the map up beforehand with a quad layer ready to accept the new quads.
Drag the quad object (from the "Hierarchy" list on the right) into the correct layers slot, and click Save.
That's all!
Note that if you make changes in Teeworlds, you will need to reload the map in unity.
Also note that you cannot save a map if it's loaded in the Server application (sharing violation), but you can save when its open in the tee editor
The editor will not overwrite any existing envelopes in the map file, including ones it creates when you export. If you repeatedly export your animation it makes new envelopes each time. The "Clear All" envelopes button deletes all envelopes from the map, so you can export again.
For this reason I strongly recommend creating your animations into a blank map, which you can later Append into your real maps (so you dont accidently delete other envelopes). Other buttons in the editor:
Click "Re-import image" if you make changes to the source mapres image
Click "Regenerate Quads from image" to delete quads and revert to the automatic sliced layout.
Click "Make all keys linear" to change all curves in the unity animtion to linear. My exporter only sets linear curves in teeworls envelopes, because alot of the key blending you can do in Unity doesnt translate to teeworlds, and using fancy curves in unity might not apply correctly after export Click "Edit Quad Points" to open another window. In the window:
- Modify the texture placement of the quads by dragging the corner points.
- Drag the green points to move all 4 corners (these are not the same as the pivots in the tee editor, just helpers to allow moving all 4 at once)
- Hold Control while dragging a corner to Snap points
- Right-click a green point to Delete a quad (you can also just press delete while selecting one in the viewports)
- Right-click an empty space to add a new Quad
- Hold Alt and left-click to clone a quad (creates the new quad in exactly the same place)
- Toggle "Show point colors" to color points (see below)
- Toggle "Update Quad on UV change" to make the quads in the scene view change shape to match changes in this window
- Modify the Shape of the quads by dragging the corner points.
- Move quads by dragging the green points
- Hold Shift while moving the green points to adjust pivots (These are the pivots) [note: this will behave a bit wierd if you have changed the scale & hierarchy]
- Hold Shift while moving corner points to change texture placement (mimicking tee editor)
- Hold Control at the same time as Shift-dragging corners to 'snap' texture placent to 25% intervals (useful for creating tiling texture quads, not that useful for animation)
- Hold Control to Snap points
- Click and drag to box-select many points at once (can move and change texture on many points)
- When box-selecting points, you can modify the point colors using the color swatch in the top-left corner of the viewport
If you ever change a quads name, or alter the hierarchy after you have done some animation, the anition will break, shown in the the unity animation window with yellow text (see inset image)
To fix this, click "Fix Animation Hierarchy" to open another window
The Left column "Object Path" shows what the animator thinks are the quad object hierarchies
The middle column "Quad Object" contains references to the actual objects
The left column show how many animated properties are preset for each object (position x, y, z, rotation, color etc [dont worry about this - debug])
Green fields mean the object can be loacted by the animtor, and everything is fine
Red fields mean the object has changed. Drag the quad you changed into the slot in the middle column to show the animator where the object is now
The fields turn Yellow to show that you have modified one.
Click "Save" to update the animator
Lastly theres a feature that will import quads from a tee map into unity
Animation is not imported (its impossible to reconstruct a hierachy animation going from tee -> unity) and will not be preserved when you export back to teeworlds
This is mainly for making adjustments to static quads, eg to change point colors in a more user-friendly manner
In the "Modify Map" screen, expand the quad layer you want to import, to reveal the button
Click "Load Quads into new Object" and you will be prompted to select the image used by the quads (again, create a folder for all the assets).
A couple of final points regarding envelopes:
Each animated object creates a new envelope, if you have multiple objects that can use the same envelope, you can tell the exported to copy envelopes from other objects.
With any quad selected, on the right of the screen is a block titled "Copy Envelopes" with 4 modifyable properties.
Drag another object from the Hierachy window into "Copy Position From" or "Copy Color From" to have this quad copy that quads envelope. You can also adjust the timing offsets with the "Pos Env Offset" values (Pos TO and Color TO in the tee editor)
Unfortunatly, this doesnt actually make them update to show the copied animation inside Unity, you just have to pretend until you export.
If you have one quad as a child of another, and you dont directly animate the child (but the child moves as a result of the parent being animated), the exporter automatically assumes it should copy the parents position animation (color is not automatically copied) [Note: you need to make sure the quad pivots are aligned for rotation to look good]
[Example: The tee's hand (gif above) is a child of the pickaxe. The pickaxe is animated to go up and down, but the hand is not itself animated]
Note about the unity editor layout
When you first install Unity, it's probably going to have a different screen layout to my images. in the top right of the screen theres a button (possibly says 'Default') that lets you change the layout - '4 split' will arrange it similar to mine
Note about errors
If you have the console open, sometimes errors appear while using this editor, none of them actually seem to stop it working though, and you can just ignore them (hopefully). The only exception is the sharing violation mentioned earlier (change map in tee server app)
Apologies if this is a bit over-the-top for a 'simple' animtion tool (unity install is not small, means learning the unity interface) but since it's maybe only going to used by a few serious map artists its probably fine.
Maybe one day I'll write it directly into teeworlds, but since theres no Undo, or quad hierarchy, or scaling, or box select, or timline-scrubbing.....
Also I dont really C++
Last edited by Dr. Jekyll on Wed Jul 12, 2017 12:55 am, edited 1 time in total.
-
- Posts: 141
- Joined: Sat Dec 27, 2014 3:29 pm
- Player profile: http://ddnet.tw/players/Vasten100/
- Mapper profile: http://ddnet.tw/mappers/Vasten100/
- Clan: iABC
Re: Animtion Tool
Nice work, i'll try it out ![Smile :)](./images/smilies/icon_e_smile.gif)
Just a question, is it possible to export/import to after effects?
![Smile :)](./images/smilies/icon_e_smile.gif)
Just a question, is it possible to export/import to after effects?
Where's your core message?
- mokuz
- Posts: 755
- Joined: Sat Apr 30, 2016 5:34 pm
- Location: Finland
- Player profile: https://ddnet.tw/players/Mokuz/
- Mapper profile: https://ddnet.tw/mappers/Mokuz/
- Clan: Legendary
Re: Animtion Tool
Cool!
SpoilerShow
Nothing to see here uwu
mods banned my previous sig :( this is censorship freedom of speech is dead xoxox
mods banned my previous sig :( this is censorship freedom of speech is dead xoxox
- deen
- Posts: 3576
- Joined: Mon May 05, 2014 2:30 pm
- Player profile: https://ddnet.org/players/deen/
- Discord: deen#5910
Re: Animtion Tool
You're crazy, this is great. I'd still love it for a tutorial map if it doesn't kill performance.
- Kintaro*
- Posts: 43
- Joined: Tue Oct 28, 2014 8:45 pm
- Player profile: http://ddnet.tw/players/Kintaro*/
- Mapper profile: http://ddnet.tw/mappers/Kintaro/
- YouTube: user/mrtiee
Re: Animtion Tool
Tutorial Map?deen wrote:You're crazy, this is great. I'd still love it for a tutorial map if it doesn't kill performance.
@Dr. Jekyll : This is so nice! If someone told me about this i wouldnt believe it! How did you get the idea to use Unity3D Editor?
- Ryozuki
- Posts: 1748
- Joined: Tue Feb 24, 2015 7:28 am
- Location: Catalonia
- Player profile: http://ddnet.tw/players/Ryozuki/
- Mapper profile: http://ddnet.tw/mappers/Ryozuki/
- Clan: Unique
- Website: https://edgarluque.com
- Discord: Ryozuki#2188
Re: Animtion Tool
Nice tutorial ![Surprised :o](./images/smilies/icon_e_surprised.gif)
![Surprised :o](./images/smilies/icon_e_surprised.gif)
If this animations would be put together with Timakro's ddrace tutorial mod, maybe something good could come out.Kintaro* wrote:Tutorial Map?deen wrote:You're crazy, this is great. I'd still love it for a tutorial map if it doesn't kill performance.
@Dr. Jekyll : This is so nice! If someone told me about this i wouldnt believe it! How did you get the idea to use Unity3D Editor?
- deen
- Posts: 3576
- Joined: Mon May 05, 2014 2:30 pm
- Player profile: https://ddnet.org/players/deen/
- Discord: deen#5910
Re: Animtion Tool
What timakro is working on: viewtopic.php?f=3&t=3771Kintaro* wrote:Tutorial Map?
-
- Posts: 25
- Joined: Sun Apr 10, 2016 8:40 pm
Re: Animtion Tool
Better to just use some screen capture software of actual teeworldsVasten100 wrote:Nice work, i'll try it out
Just a question, is it possible to export/import to after effects?
It's my amateur game dev client of choice, so I'm well familiar with the IDEKintaro* wrote:@Dr. Jekyll : This is so nice! If someone told me about this i wouldnt believe it! How did you get the idea to use Unity3D Editor?
Id already played around a bit using it to edit tile layers early on in the 3D tileset process, and this seemed like a smart thing to branch into
Re: Animation Tool
Wow, this is amazing.
I actually thought you just used a ton of frames to make an animation and flash through them using a color envelope, which is the way I used to do it. But this is SO MUCH BETTER (im going to cry).
I actually thought you just used a ton of frames to make an animation and flash through them using a color envelope, which is the way I used to do it. But this is SO MUCH BETTER (im going to cry).
A is for Apple.
- timakro
- Posts: 414
- Joined: Mon May 05, 2014 6:05 pm
- Location: Germany
- Player profile: http://ddnet.tw/players/timakro/
- Mapper profile: http://ddnet.tw/mappers/timakro/
- Clan: unique
Re: Advanced Animations Tool (using Unity)
Incredible, nice work!
Who is online
Users browsing this forum: No registered users and 33 guests