Announcement

Collapse
No announcement yet.

How to: Creating a Doodle game in TigerCreate 2

Collapse
This is a sticky topic.
X
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • How to: Creating a Doodle game in TigerCreate 2

    How to create a Doodle game in TigerCreate 2

    Creating a doodle game in TigerCreate is fairly easy. You probably need the most time creating the image file that can be used for the doodle game.

    The Doodle game is a picture with defined outlines that the user has to colour in. They can choose from a range of different tools (a small brush, a big brush, an area filling tool and an eraser) and different colours to complete the task.


    So let's get started!

    First you have to choose a base image that you'd like to use.
    Scale or trim it to 1600 x 900 pixels for landscape and 900 x 1600 for portrait format projects. (It is possible to use portrait format pictures in landscape projects and vice versa but you will have a lot of white space around your doodle game, so we don't recommend it.) You can also use images with values larger than that, as long as the aspect ratio stays the same.

    Open a drawing program of your choice, we recommend a program that is vector based.
    Now redraw the relevant lines that you want for your doodle with a black outline. You can choose other outline colours if you want, but black just works best.
    Keep in mind that you don't add too much small areas. The user must be able to select an area with the tip of their finger when he wants to use the filling tool.

    Save your finished image, just the outlines, as a transparent PNG file. You don't want any background.
    Make sure to name in doodle.png. TigerCreate won't recognize the file for the game otherwise.


    Tibo_Image_to_Outlines.jpg


    Also your outlines should be closed, if that is not the case and you use the filling tool some areas might get coloured that aren't supposed to be. You can easily test in a program like Adobe Photoshop or Gimp etc. if the lines are closed. Just go crazy with the filling tool.

    OpenLine.jpg
    Whoops, no we don't want that!

    Adding the game to your TigerCreate 2 Project

    The doodle game is one of three games that can be opened via the scene menu. The other two are the puzzle and the memo game.


    Take your doodle.png file and drag it into the folder Games → Doodle in your TigerCreate 2 project. (If the folder Doodle inside the Games folder doesn't exist yet just create it manually.)

    The doodle game has to be added via the publishing dialogue.
    Press the Publish button and navigate to the Games tab. There you can add up to three different games.


    GameType.png

    Select Doodle out of the drop down list. After setting the game type you get another option for the doodle game you'll have to set.
    Background Order has the selectable options Above and Below. This refers to the paintable area and if it should be above or below the outlines.
    If you want the outlines above the paint then select below. Select above if you want to be able to paint over the outlines.

    If there is no image in the Doodle folder or the folder itself is not existing TigerCreate will show you a warning.


    Now you have to make sure that the user can actually access the puzzle.

    Stay in the Publish options and open the Menu Options tab. Here you can decide which menu buttons will show up later in your app.
    For the games to be visible make sure that the "Show Games Button“ is checked. The default state for this button is off.

    Before leaving the Publish options export your project once to save the settings. If you press cancel the settings will be lost.


    Doodle_Menu.jpg
    This is how the menu looks when the "Show Games Button" is checked. This is the doodle game icon. If you add more than one game the icon will look different.

    Known Issue: The following feature isn't working in the current version of TigerCreate (2.18) it will be fixed in the next version 2.19.

    You also can open the games with a button from inside your scene. For that to work you need the so called "UI Actions".

    Add a node or image to your scene that will become your button.

    Select the object open the Object Inspector and the General Properties category and check the box for "Is touchable“. Now scroll down to the Miscellaneous category and open the UI Actions drop down menu. Choose the "Open Doodle Game" UI Action.
    Keep in mind though that opening a doodle like this only works if you have set it in the Publish options before.


    UI_Actions.jpg

    And that's it. Now you can test this function either on your device or in the TigerSimulator.

    Have fun creating your own unique doodle games!


    Hint: You don't have to set the games for every export format separately, you just have to do it once. It is saved for all export formats. (You will have to export it once though after making changes, pressing cancel will not save them.)
    Keep in mind that some minigames like doodle and memo don't work for all export formats. For now iBooks and Web exports don't support them.



    Feel free to comment if you still have any questions!

    Greetings,
    Carola
    Last edited by Carola; 2018-07-12, 12:57.

  • #2
    Hi Carola, thanks for the walkthrough! I am facing an issue - if the user taps the doodle game's "save picture" or "delete picture" icons, confirmation pop-up is shown, with labels like "POPUP_PAINT_SAVE_TITLE", with body content and button labels similarly named.

    My project has two languages, could that be the source of the problem?

    How do I fix this?

    Comment


    • #3
      You can't fix it, I have to fix it. This was your project with English and Bengal, correct?
      Last edited by Carola; 2018-12-10, 09:55.

      Comment


      • #4
        Yes, the same project, with English and Bengali as the supported languages.

        Comment


        • #5
          I've just uploaded version 1.4.8 of the publishing tools, which includes your fix.

          Comment


          • #6
            Thank you very much!

            Comment

            Working...
            X