Tag Archives: rube

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

second images

Result

 

Download the latest version from the official site

http://www.estebon.mx/fable

http://www.freefable.com

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.

Untitled-1

The next image is a screenshot of the page finished in the program, at the end, this page should look like this.

Untitled

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.

Untitled3

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.

NonRetina_pagina2_0

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

http://www.estebon.mx/fable

http://www.freefable.com

Fire Ant Box2d Level Editor Introduction

Hi there, here is a very beloved piece of software in which I have been working lately. So, what exactly is Fire Ant Box2d Level Editor, FABLE for short.

Well as the name says, FABLE is a Box2D Level Editor, It gives you a GUI in which to develop Box2D environments, It is useful for building small Sketch’s as is useful for building full levels. Some of the features on the box are, the capability not only to build the physics environment, but also the ability to map the textures to each body. the tool is also capable of generating optimized texture atlas.

The develop environment currently supports a lot of user experience features as is as the Copy Paste capability, the undo redo stack, load and save files and the capability of exporting a XML file with the definition of the world and also objective C code for use in IOS projects.

As for the development tools it contains specific tools to create joints, bodies and fixtures, it contains a tool to create irregular polygons for both bodies and fixtures, it can handle all of the features of Box2D like collision levels and masks, densities, frictions, damping frequencies (for some joints like distance joints), motors, torque, angles, limits, and so on and so for.

It also contains playback controls for test the current environment and also for change the original environment state.

Another great feature is that for textures it can handle Layers, so you can distribute objects among layers, this is specially useful for levels that have more than one interaction layer or simply to handle in a better way the elements on the screen.

Here is a small screenshot of the GUI with some explanations.

image

Yes I know, the buttons are horrible, I drew them by myself Smile with tongue out.

Here you can see a bit of the functionality in this video, narrated with my melodious voice Open-mouthed smile.

FABLE Demo One

Well, that is everything for now, I’ll be publishing new entries with more small tutorials and also more new features to the program cheers and here is the link to the program.

Box2dLevelEditor Download

Also visit the new official site

http://www.estebon.mx/fable

http://www.freefable.com

And here are the FABLE file and the images just in case you want to try it by yourself.’’

http://estebon.mx/fireant/FableDemoOneData.zip

http://estebon.mx/fireant/FableDemoOneFile.ble

Let me know if it was useful to you