How to create a Custom Template

How to Create Custom Template Design for your own mobile app

Creating a custom template is an easy way to produce several apps that have similar features. If you need several menus, several home pages or want to reuse the same background image for a handful of applications, a this tutorial how to create custom template is the way to go. It saves images, text and button placement – saving time and headaches.

Creating a re-useable template in iBuildApp is a straight forward process.

    create custom template
  1. Begin by logging into iBuildApp, or creating an account if you haven’t done so yet.

  2. On the top right, beside your log in name, click on the arrow and select “My Templates

    create custom template
  3. This opens up the custom templates page. Since this is your first one, it is mostly blank. Click on the “Create Template” button on the right hand side.

    You now see a preview smartphone screen. You can begin dragging and dropping UI elements from the menu on the left hand side. Keep in mind that you can change images and text within the template when building your apps, but you cannot change the positioning of elements. Ensure that your template is built for all your apps’ needs.

    custom template

    There are several elements to choose from:

    • Buttons
    • Images
    • Labels
    • Menus
  4. We will begin by making a sample custom template. Click on the preview smartphone screen to add a background image. You can use the properties on the right side of the screen to change your background image’s settings. When you are done moving or resizing the image, click the apply button to save your changes.

    custom template design
  5. You may try the photo element next. Drag and drop the photo element from the left menu onto the preview smartphone screen. This is very similar to the background image you had just added, however your new image only covers a portion of the screen. You can use this to add a logo for your applications or decoration to the screen. Click “Apply” to save your image.

    how to create custom template
  6. Drag and drop the button element from the menu to the preview screen. Again, you can adjust the text, size and position using the properties field on the right. When you are finished, be sure to press the apply button, otherwise your settings will revert to what was displayed previously.

    custom template

    You can duplicate as many buttons as you need or drag and drop each of them from the left menu.

  7. Finally, adding a menu item adds up to 5 buttons across the bottom of the screen. You can pick from a number of clip art icons and change the text for each menu item.

    custom template
  8. When you are done press “Save” on the bottom right of your screen. Fill in the requested information and press save again.

    custom template

After saving your custom template design, you can begin creating the first app using it right away by pressing the create app button. If you built the template to share with the iBuildApp community, you can chose to publish the template on the marketplace by pressing the appropriate button.

Your custom template is ready! You can use the time you just saved to post more tips and tricks on custom template building in the comment section.