how to use the mobile roadie design customizer
DESCRIPTION
Step by Step How To on the functions of the Mobile Roadie Design Customizer. For more information on how to build a mobile app, RSVP for our free weekly webinars at http://blog.mobileroadie.com/events http://blog.mobileroadie.com/eventsTRANSCRIPT
![Page 1: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/1.jpg)
Design Section: CMS
How To Use the Design Customizer
Monday, October 1, 12
![Page 2: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/2.jpg)
First step: Pick your theme.
PRO or Advanced Design customers have access to many pre-made themes. Find out more here.
Step 1
Monday, October 1, 12
![Page 3: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/3.jpg)
Choose a color theme and view it in customizer at the right.
Step 2
Monday, October 1, 12
![Page 4: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/4.jpg)
You can also tweak each individual color to fit your brand.
Step 3
Monday, October 1, 12
![Page 5: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/5.jpg)
To re-arrange the order of your sections, drag and drop them into place.
Step 4
Drag and drop
Monday, October 1, 12
![Page 6: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/6.jpg)
The first step in adding some branding into your app is to upload a Header Image.
Step 5
Monday, October 1, 12
![Page 7: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/7.jpg)
As you can see, a header image can add a lot of personality to your app to make it feel custom.
Monday, October 1, 12
![Page 8: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/8.jpg)
Scroll down the page within Home Styles to adjust footer color. Toggle it on or off, and click Save when finished.
Step 6
View changes
Monday, October 1, 12
![Page 9: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/9.jpg)
Scroll down again to add in a background image. Upload the image from your computer, and click Save.
Step 7
Size:640 x 960 pixels
Monday, October 1, 12
![Page 10: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/10.jpg)
Select from a variety of a stock buttons image, or upload your own custom button image that you design.
Step 8
Monday, October 1, 12
![Page 11: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/11.jpg)
Browse our various button types, make selections, and preview in the customizer.
Monday, October 1, 12
![Page 12: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/12.jpg)
Scroll down to customize the colors of your text, and tint the background of your buttons.
Step 9
Monday, October 1, 12
![Page 13: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/13.jpg)
Select a global icon set to sit overtop your buttons.
Step 10
Monday, October 1, 12
![Page 14: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/14.jpg)
Scroll through the many icon templates to choose from .Monday, October 1, 12
![Page 15: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/15.jpg)
Upload a canvas to go behind your buttons, icons, and background.
Step 11
Monday, October 1, 12
![Page 16: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/16.jpg)
Scroll down and view each section that you want to edit options for here. Click on the Edit icon to dive in.
Step 12
Monday, October 1, 12
![Page 17: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/17.jpg)
Rename your section, upload a custom button, or select an individual icon image in this section.
Step 13
Monday, October 1, 12
![Page 18: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/18.jpg)
Browse through individual icons to add some variety to your global icon set.
Monday, October 1, 12
![Page 19: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/19.jpg)
Select a font for your interior views.
Step 14
Monday, October 1, 12
![Page 20: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/20.jpg)
Upload a custom header bar, or view a handful of stock header images for your app.
Step 15
Monday, October 1, 12
![Page 21: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/21.jpg)
Scroll down to check out our pre-designed header bars.Monday, October 1, 12
![Page 22: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/22.jpg)
Upload a section background and select where you’d like it to go. Add different backgrounds to differentiate sections.
Step 16
Monday, October 1, 12
![Page 23: How to Use the Mobile Roadie Design Customizer](https://reader034.vdocument.in/reader034/viewer/2022052410/54851f43b4af9f640d8b4d2b/html5/thumbnails/23.jpg)
Build beautiful mobile apps with our design customizer. Upgrade to PRO to get all the advanced features.
Monday, October 1, 12