Tiling and ア ニ メ ー シ ョ ン animations with file objects
CLIP animation (.clip) files can be read as file objects as they are
File objects can be tiled
By combining this, you can create a tile that animates
The CLIP file that read the file object
And read it as a file object
Create more complex animation tilings
If you make it complicated, there will be no time to render
Since the explanation here will also be difficult
Making it easy to do
On the way, there is also "Bug 👻" and its "Avoidance" (ver.1.9.7)
Rotate cherry blossoms
Create a "new illustration"
File name "sakura400" Unit "px" Width "400" Height "400" Resolution "1200" Basic expression color "Color"
Select "Grid" from the View menu
Select "Grid Ruler Settings" from the View menu
Set "Grid Ruler Origin" to "Center"
With the ellipse sub tool of the shape tool
Snap to the grid and draw a (200x200px) "circle" in the center of the canvas
Draw cherry blossoms so as not to protrude from this circle
Because drawing is troublesome, I'll use the tone net
(1200dpi)
Select "Tone" from "New Layer" in the layer menu
Set the tone number to “5”, density “34”, type “Sakura (medium)”, angle “0” (this is the result of trial)
Set the sub tool to "Layer Move"
Set the movement target to "tone" in the tool property palette
Drag the sakura tone to the center of the circle on the canvas
Before you forget, move the target of "Move layer" back to "Layer"
Select "Rasterize" from the layer menu
The tone layer has been converted to a raster layer
I do not need a layer mask so I will throw it away
Creates a selection and deletes all but the central "cherry blossom"
Also hide the "circle"
"Cherry blossoms" look off center,
You can confirm that it is the center by displaying "circle"
If you confirm, you can discard the "circle"
Make "image material layer" to rotate "cherry blossom" in the center
Choose "Select All" from the selection menu
Choose "Convert Layer" from the Layer menu
Name it "sakura" and type "image material layer" and click "OK"
"Deselect" in the selection menu
Select "Timeline" from the window menu
Click the "New Timeline" icon on the timeline
Set the frame rate to "24" and the playback time to "12 + 0" (second + frame)
Make the sub tool an "object tool"
Keyframe operations use many object tools
Click the "Enable layer keyframes" icon on the timeline
Press the "Keyframe interpolation" icon on the timeline and select "Keyframe to create: Constant velocity"
Make sure the first frame is selected and click on the "Add keyframe" icon
A keyframe is added to the first frame of the timeline
Click the "last" icon next to the two play buttons on the timeline
The last frame of the timeline is selected
Set “Rotation Angle” in the Tool Property Palette to “720”
(This is the "cherry blossom" turns right twice in 12 seconds)
Select the last keyframe on the timeline
Move a keyframe one frame to the right outside the timeline display
(This operation cannot be undone except undo)
Save "sakura400"
"Sakura blossom" rotates slowly when playing the animation
It's not really interesting because it's not handwritten
Move cherry blossoms
Create a new "New Illustration"
File name "sakura1600" Unit "px" Width "400" Height "400" Resolution "72" Basic expression color "Color"
Select "Grid" from the View menu
Select "Grid Ruler Settings" from the View menu
Set "Grid Ruler Origin" to "Center"
Select "Create file object" from "Import" in the file menu.
Load the previously saved (sakura400.clip)
Select "Object tool" of sub tool
Check the tool property palette
Uncheck "Draw Paper" in "Render Settings"
Check "Tiling"
Show timeline
Click "New Timeline" in the timeline
"OK" with the frame rate "24" and the playback time "12 + 0" (second + frame) as set earlier
Copy "sakura400" in the layer palette
Name each layer "sakura400A" "sakura400B"
Move "sakura400A" to the upper left Move "sakura400B" to the lower right
Hide "sakura400B" in the layer palette
You can leave it displayed, but it may get in the way
Select "sakura400A"
Click `` Enable keyframes for layer '' in the timeline
Select "Keyframe to create: Smooth" for "Keyframe interpolation" on the timeline.
Make sure the first frame is selected and click "Add keyframe"
Select the frame one second later (25th frame) and click "Add key frame"
Keyframes are added to each frame of the timeline
Select (13 frames per second) in the timeline
Move "sakura400A" layer down (300px)
(2 seconds 13 frames) and select "Add key frame"
(3 seconds 01 frames)
Move "sakura400A" layer down (300px)
(4 seconds 01 frames) and select "Add key frame"
(4 seconds, 13 frames)
Move "sakura400A" layer to the right (300px)
(5 seconds 13 frames) and select "Add key frame"
(6 seconds 01 frames)
Move "sakura400A" layer to the right (300px)
There is no illustration
(7 seconds 01 frames) and "Add key frame"
Select (7 seconds 13 frames) and move the layer down (300px)
(8 seconds 13 frames) and select "Add key frame"
Select (9 seconds 01 frame) and move the layer down (300px)
(10 seconds 01 frames) and "Add key frame"
(10 seconds, 13 frames) and move the layer to the right (300px)
(11 seconds 13 frames) and select "Add key frame"
Finally
(11 seconds 24 frames) and move the layer to the right → (300px)
Select the key frame (11 seconds 24 frames) and move it to the right outside the display
Display "sakura400B" while displaying "sakura400A" and select
Select the first frame
Enable layer keyframes
"Add a key frame" at (0 second 01 frame) and (1 second 01 frame)
There is no illustration
(13 frames per second) and move the layer up (300px)
(2 seconds 13 frames) and select "Add key frame"
Select (3 seconds 01 frame) and move the layer up (300px)
(4 seconds 01 frames) and select "Add key frame"
Select (4 seconds 13 frames) and move the layer ← left (300px)
(5 seconds 13 frames) and select "Add key frame"
Select (6 seconds 01 frame) and move the layer ← left (300px)
(7 seconds 01 frames) and "Add key frame"
Select (7 seconds 13 frames) and move the layer up (300px)
(8 seconds 13 frames) and select "Add key frame"
Select (9 seconds 01 frame) and move the layer up (300px)
(10 seconds 01 frames) and "Add key frame"
Select (10 seconds 13 frames) and move the layer to the left (300px)
(11 seconds 13 frames) and select "Add key frame"
Finally
(11 seconds 24 frames) and move the layer ← left (300px)
Select the key frame (11 seconds 24 frames) and move it to the right outside the display
This concludes the work on keyframing
Next, change the canvas size to (1600 x 1600px)
There is a "defect"
Try the bug first
Select "Change Canvas Size" from the Edit menu
"OK" the reference point at "center (■)" width "1600" height "1600"
There is no problem if you keep 400px
The reason we increased it to 1600px
This is because it becomes easier to handle when you load it as a tiling, deform it and spread it
Write this out as an animation (including bugs)
Some animations are not exported correctly
to correct
"Cancel (ctrl + z) (command + z)" of the edit menu returns to the canvas size before change
Again, select "Change Canvas Size" from the Edit menu
Change the reference point to "upper left (■)"
OK with width "1600" and height "1600"
Save "sakura1600"
Export animation
The animation tiling material is ready
If you delete "sakura400"
Be careful not to delete "sakura1600" because it will not be played
Use as tiling material
I will create a new illustration again
File name "sakura" Unit "px" Width "1600" Height "900" Resolution "72" Basic expression color "Color"
When creating animation, let's set "resolution" to (72) as much as possible
Select "Create file object" from "Import" in the file menu
Load the saved (sakura1600.clip)
Check the tool property palette
Click "Render Settings" and uncheck "Draw Paper"
Set "Transformation method" to "Free transformation" (others are also acceptable)
Check "Tiling"
Drag the control points at the four corners of the loaded "sakura1600" and transform them freely
Infinite tiling is completed
(There is no problem even if you use other deformation methods!)
Because it is a precious cherry, I made the cherry-colored "solid paint layer" clip
Show timeline
Create a "new timeline"
"OK" with the frame rate "24" and the playback time "12 + 0"
Animate with "Play" as it is
"Cherry blossom march"
The animation pattern is ready
You can play by placing the character and changing the color of the flower
Because the capacity of animated GIFs would be enormous, it could not be made into a complicated picture
The rendering time is just too scary
The "interpolation method" of file object deformation was set to "high accuracy (average of color)".
And back to "soft contours (bilinear method)"
It was also surprising that the writing stopped
Reduce export size, decrease frame rate,
I wrote many times in tests
Adjusting the rendering may have been more difficult than expected
At first I applied gradation to the cherry blossoms and placed 3D under the cherry blossoms,
All rejected due to excessive GIF capacity
in conclusion
Sometimes doing complex things with object files
Playback may be messed up or export may not work
I wanted a little more professional software
I love CLIP!
Comment