webMOBI Help Center
All Categories Starting up with webMOBI Home Page Layout and Design

Home Page Layout and Design

webMOBI mobile app builder home page design

By Ngage.ai Support
November 13, 2023

To design the panels for your mobile app's homepage, you can follow these updated steps, including the specific dimensions for the middle and top/bottom panels:

1. Open the mobile app configuration panel by selecting "Branding" from the "Event Content" section.

1.png

2. Within "Branding", you will see various panels such as "Feeds", "Agenda", "Speakers", etc.

3. To customize a specific panel, click on the settings icon (which resembles a gear wheel) next to the panel name.

4. Once clicked, a module configuration window will appear, showing options like "Feeds". This is where you can choose the desired module for your homepage.

2.png

5. Based on the position of the panel on the homepage, use the following image dimensions:

  • Middle Panels: Create your images with the dimensions of 2160x1440 pixels.

  • Top/Bottom Panels: Use dimensions of 4320x1440 pixels for these panels.

  1. For guidance on creating these images, refer to the example provided in the link though the dimensions of the image should be as in the step 5 to accommodate latest iPhone screens - https://trackmco.s3.amazonaws.com/Home-page-assests-reference.zip

  2. After creating your image, upload it to the chosen module. The process may vary slightly depending on the module, but typically there will be an upload option within the module settings.

3.png

7. Save your changes to update the module.

8. The updated module and its associated image will now be visible on the homepage of your mobile app.

Remember, it's important to adhere to the recommended design, which supports a minimum of six modules. The first and last images should be full-length pictures for a visually coherent look. You can add or remove more modules as required to customize the homepage to your event's specific needs. After saving and publishing your changes, they will be reflected in the mobile app.

Was this article helpful?

Thanks for your feedback!