Close Mark all as read
Notifications Announcements

Total posts
5

Views
4,409


Only Ninja and Sakura members can post here
fluffness
Fluff
fluffness
Fluff

What are add ons
They are additional features you can add to your engine. Once you add them, some new options will appear in your library, scene editor, flag tab, etc depending on the feature you add.
They exist for both free and premium visual novels, but premium visual novels has more options.

How to add them

Open your visual novel project and click on Settings tab. Scroll down and click on Add ons

In this thread I'll make tutorials for each add on feature.
fluffness
Fluff
fluffness
Fluff
1) Show spritesheet animation section in library

  • What is a spritesheet:
It's an image containing a sequence of frames that can be animated with CloudNovel engine. The engine will read from top left corner to the lower right corner, from left to right and from top to bottom in order.
  • Why use spritesheet?
Because CloudNovel engine DOES NOT support animated gifs. To make animations in CloudNovel you have to either use spritesheets, video assets (it works for premium visual novel only), or timeline animations (which is the little blue button under each page of your scenes)

TIPS: When do I use spritesheet, video assets, or timeline animation?
If your animation only contains a few frames (short or repeated animation), it's advised to use spritesheet.
If it's a longer animation, it's better to use timeline animation to reduce asset loading time (so your game will load faster). But of course, CloudNovel timeline animation is quite limited and can't make any type of animation. In case you're unable to use timeline animation, you can use video assets.


What type of assets support spritesheet?
Character assets and image assets. They work the same way.






How to use spritesheet
Let's suppose I want to use this spritesheet and make David blink.



Add it to your library and click on the asset you just added. Tick the Sprite Sheet option.



This is what you'll see.
Let's look at the value options first:
  • Width and height is the size of A SINGLE FRAME, not the whole spritesheet. Based on the size you input here, the engine will automatically cut each frame and make them play in sequence. In this tutorial, the size of each frame is 2080x2404
  • Frames is the number of frames your spritesheet contains. In my case, it's 2 frames.
  • Frame Per Second is the speed of the animation. Higher the value and faster will be the animation. You can slow down the animation by putting a number between 0 and 1 (for example 0,5)

Now let's take a look at the two options on top
  • No looping: by default, on CloudNovel, spritesheet loop. Which means that after the last frame is played, it will go back to first frame and repeat. If you tick the No looping option, it will stop after playing the last frame.
  • Add delay: by default, all frames will be displayed for the same amount of time (which is set in Frame per second). But you can decide to make one specific frame last longer than the others (you can choose only one frame)
Paused Frame: insert the number of frame you want to select (counting from top left, from left to right and from top to bottom).
Seconds Paused: make the selected frame pause for x seconds before moving to the next frame.
In this example, I'm making the first frame last 1 second more than the rest to keep the eyes opened for longer time before blinking.



This is how it turns out.




If I make Frame Per Second 2, the speed will be faster.
fluffness
Fluff
fluffness
Fluff
2) Show default optional settings for all assets
They are some particular options for character, image, sound, button, bar assets. However, for character, image, button assets, these options can be edited from scene editor too (without enabling this add on).

Characters

You can edit the Height of the character, which means that you can move it higher or lower on the screen (it won't distort the image). If you input a low value, it will be on the top of the screen. If you put a high value, it will be on the bottom on the screen.
Size allows you to zoom in or zoom out the image. If the value is above 1, it will zoom in. If it's between 0 and 1, it will zoom out. Be careful not to put 0, or it will disappear.

Scene editor version:



Images
Same options as character assets. It has a version in scene editor too.



Sounds
You can change default volume. It CANNOT be changed from scene editor, but can be changed with animation.



Buttons
Size changes the size for normal button, hovered button, hit area.
Hover Image X and Y changes the position of the hovered version of the button (which is the button when you pass the cursor on it).
Hit Area Size only changes the size of the area that can be clicked as a button. It can not coincide with the image of the button.
Hit Area X and Y Position change the position of the area that can be clicked. High X value moves to right, low value moves to left. High Y value moves up, low value moves down.

These options are in scene editor too.



Bars
Can change the way the bar is filled. This option CANNOT be changed in scene editor.
Background X and Y is the position of the background of the bar. A high X value will move it right, a low value will move it left. A high Y value will move it up, a low value will move it down.
fluffness
Fluff
fluffness
Fluff
3) Show button typography design optionsThis works for button assets and allows you to add text on your button. HTML codes WON'T work in this text. 
Main Message Preview allows you to see how your text will look like.
Font, Size, Color, Alignment are just like any text editor.
Width and Height is the limit of the area that can contain text. Which means that once the text is too long, it will go to next line and stop once reached the max height.
Character Limit limits how many characters the text can contain, so it won't go beyond a certain length.
Save Slot Message X and Y is the position of the text that will be displayed to the player once they use the save slot (only if you're using this button as a save slot button). This works in premium visual novel only.
fluffness
Fluff
fluffness
Fluff
4) Show character portrait settings
Portrait is the character headshot near the textbox. 



Library settings

Click on your character (not on the single sprite) and scroll down.
Position Height moves the portrait up or down on your screen. You need to fit it according to your textbox and there isn't a default position for this. 
Horizontal Position: high value moves the portrait right. By default it's on the lower left corner.
Image Size resizes the portrait without changing size for the sprite.


Scene editor (the add on doesn't change this part, but I'm adding this to this tutorial to make it more complete)

To make it appear, you click on the Show Portrait animation in your timeline editor (Not Show Character). To hide it, use Hide Portrait (not Hide Character). Showing character sprite doesn't automatically show portrait and showing portrait doesn't automatically show sprite.
Change Sprite animation will be reflected on both sprite and the portrait. 
Flip Portrait Left and Flip Portrait Right animations flip the portrait without flipping the sprite.