Mobile App UI Customization

Follow

doForms provides the ability to control most aspects of the mobile app user interface (UI);  including company logo, form icons, menu bar layout, background and text colors, and more.   This allows you to create your own mobile app UI that is specific to your own business applications, like the one illustrated on the right below.  Note the color changes.  Note how the “Projects” button has been replaced with an “Industry” button.  Note how the standard doForms forms icons have been replaced with custom icons and titles.  And don’t forget to add your own title graphic logo.




Mobile app UI customizations are implemented on a per account basis.  In other words, all mobile devices in your account will receive the same customization.  The customizations are received by the mobile devices after you Save the customization in your website, and following a forms Update operation by the doForms app on each mobile device.

To customize your mobile app user interface:
1. Click on the Manage tab
2. Select Account
3. Scroll down to Manage Your Mobiles
4. Click on Customize Mobile App User Interface

The page will be displayed with all the customization controls illustrated below.

Use the Header Color and Title Graphic options to “brand” the mobile app by replacing the doForms title graphic with one meaningful to your organization or project.  You may use the same or different title graphics in the website and mobile app.  But the title graphics MUST BE EXACTLY 320 pixels wide by 72 pixels tall and in a PNG file format.  Use of transparent background is recommended for best results with header background colors.

See here for more information about branding your mydoforms website.




The customization controls allow you full control over the Main Menu Bar and the drop-down menu.  You can specify which menu items will be visible in each.  You can select a menu button icon above to edit or move it.  You can also set button test color as well as colors to indicate when the buttons are selected or not selected.  Note that icon images must be EXACTLY 100 pixel wide and 100 pixels tall. File format must be PNG with a transparent background. Icon text must be equal to or less than 8 characters.

The remaining controls below set colors for various UI components.  Note that you can select standard colors from the drop-down, or select “Custom” for additional color selections to be displayed.


Be sure to press the Save button when done.

TIP:  Projects in the mobile app are ordered alpha-numerically and the first project is the  "Default Project" (i.e. the one selected when the doForms app starts).   So to set a default project, just make its name the first in the alpha-numeric ordered list.  Alternatively, you can use a special character (e.g., ">") to make a project the first in the list (and the default).  Be sure to consider ahead of time that different projects can be assigned to different mobile devices.  So different mobile devices can have different default projects.

Read more about Branding, UI Customization, Behavior, Notices and other ways to customize the doForms user experience.

Have more questions? Submit a request

Comments

  • Avatar
    Michele Sohn

    Can you change the images that are used in the help section for the mobile app? They have doforms branding on them, and we want to white label.

Powered by Zendesk