Appearance Layer Optimization
Now you have set the complete process of the game. Next, you need to optimize the appearance of the game to improve its atmosphere and player experience.
Camera Animation
In the game, an opening animation is needed to increase the sense of ceremony, and the animation when the BOSS appears is needed to increase the tension of the game. You can create a cutscene animation and create the corresponding atmosphere by placing the camera and adjusting parameters.
Opening Animation
Camera Timeline Animation
You can create a camera timeline animation conveniently and quickly by setting key frames in the timeline.
Create a Timeline
In Object Palette – Cameras in the main interface, click “+” behind Animation to create a timeline animation using the current scene.
Each timeline animation consists of two parts: Timeline panel and Properties panel.
Select a Frame
You can drag the progress bar on the timeline or precisely type the position of a key frame in the Frame window. The CliCli Editor refreshes data at a rate of 30 frames per second. Therefore, 60 frames indicate 2 seconds.
Create a Key Frame
Click to create a key frame for the selected parameter (such as Pitch in the figure below) at the location (the 60th frame in the figure below).
Select Animation to set key frames for all parameters at the same time.
Key frames are divided into absolute frames and relative frames. The absolute frame mode is recommended for beginners.
Absolute frames show the specific parameters of the camera under the current key frame. A relative frame shows the changed value of this frame relative to the initial frame. For example, if the camera pitch angle of the initial frame is 30° and rises by 10° in frame 60, then for frame 60, the value of the pitch angle in the Absolute frame is 40° and that value in the Relative frame is 10°.
Adjust Parameters
When a key frame is selected by the pointer, you can adjust camera parameters of the current key frame in the Edit Object panel.
Copy/Paste/Remove
When a key frame is selected by the pointer, right-click the mouse to perform operations on the key frame, including Copy, Paste, and Remove. When a key frame is selected by the pointer, press Delete on the keyboard to directly remove the key frame.
Use
After editing the key-frame animation, click Confirm to save it.
In Trigger Editor, select Camera - Play Camera Animation to play a key-frame animation for the player.
Specific Camera Operations
The following shows the specific operations to set Zoom-in and Rotation for cameras.
Zoom-in
The Zoom-in effect is demonstrated below.
Adjust the parameters of the Camera Animation. Set the Focus position as follow.
Set the Trigger as follow.
Rotation
The Rotation effect is demonstrated below.
Adjust the parameters of the Camera Animation. Set the Yaw position as follow.
Set the Trigger as follow.
Trigger Implementation
After setting a timeline animation, you need to present the animation through the Trigger Editor.
Triggers
Select Keyboard - SPACE pressed for Event.
The logic for writing Action is: When a player enters the game for the first time, the opening animation is played. The timer is used to control the coordination between the camera and the timeline animation and the player's mouse operation is disabled to achieve the effect of a soft pause.
Function Library
In Triggers shown in the figure above, we call the function of the camera animation. The specific content of the function is shown below. The writing logic is: The timer is used to connect different camera animations; at last, display the UI required by the player.
Boss Appearance Animation
The camera animation of the BOSS is also achieved through the timeline animation. For detailed operations, see Camera Timeline Animation. The specific effect of the BOSS camera animation differs slightly from the opening animation.
Specific Camera Operations: Zoom-out
The Zoom-out effect is demonstrated below.
Adjust the parameters of the Camera Animation. Set the Focus position as follow.
Set the Trigger as follow.
Trigger Implementation
After setting a timeline animation, you also need to present the timeline animation through the Trigger Editor. The BOSS appearance animation has only one camera timeline animation. Therefore, you can Directly write the animation in Triggers instead of creating a function to call animations.
Select the hero unit entering the corresponding region as the Event.
Then play the timeline animation through Triggers.
UI
Two parts should be added to the UI: static pictures (such as icons, for specific operations, see UI Editor) and UI feedback.
Add a UI Feedback
Firstly you need to place the required pictures in the UI Editor and deselect Visible.
Click Events and select to add a new event.
In Event Settings, select the status corresponding to the mouse. Here, we select Enter.
Click on the left of an event, the Action Setting panel will pop up. In Action Setting – Target Widget section, set the UI canvas and components corresponding to the event.
Now, the effect of the aperture when the mouse enters is achieved. Similarly, you can set the disappearance of the aperture when the mouse leaves.