In this tutorial we will review the basic elements and panels of FABLE as well as the basic functionality to start getting in touch with the environment.
Monthly Archives: February 2015
Building a page in FABLE
Here is a fast video of a page of my tale being created in FABLE, The video is speed up 64x. Also I show to you the texture result that comes from the publish of this exercise as well as a video containing the end result. Next post I will talk about how to make it work on ios.
Fast creation.
Textures generated
Result
Download the latest version from the official site
Fire Ant Box2d Level Editor feature texture optimizations
As many of us know, when the time comes to reduce the size of our applications the first thing that comes to our minds is textures, textures usually takes the biggest part in games or rich interactive applications.
Taking this into account, FABLE have a series of heuristics aimed to reduce the size of the textures, by resizing them, rotating them and so.
For example, lets take a look at the next group of elements for a page of my book. This elements are with the size that the artist sent to m. As you may guess, In the final version the flowers should be smaller than the cat and the window should fit the window in the background. But this is what I got, very big and highly detailed images for my page, which is cool. This image is scaled, the original size is 7023 x 8122.
The next image is a screenshot of the page finished in the program, at the end, this page should look like this.
Now comes some of the nice feature of the program, as you may remember from the last post, Automatic splitting tool, the program takes care of importing and splitting the images so that is painless for the user, so you got this result very fast. Then you are ready to test it in you ipad project so you would be likely to click on publish. this action generates the following couple of files.
There is the classes for ipad and the textures, as you may see, the texture atlas looks way different from the original thing. next we can see it more neat.
We can see that the flowers have a size that makes sense and everything seems to keep an aspect ratio. This texture was generated by the program automatically. Also we can see more optimizations. for example the program can rotate the images to a position where they reduce the amount of white space. Let’s take the example of the window, in the original image, the window was rotated in a diagonal way that makes it waste a lot of space, in this version the program gets aware of that and rotate it to stay vertical so that it saves more space. This rotating technique can save between 10 an 15% of space. BTW the size of the texture for retina display is 1024×1024. It is 57 times smaller than the first image I showed to you.
Here is a video of the page in the program
And here an example of the page running on ios simulator.
Thanks.
Download the latest version from the official site