How to create an app like My Glamm

First, we create a new layout. To do so, click on the “Create Layout” icon.

Clicking on “Create Layout” will open a popup

Clicking on “Create Layout” will open a popup. Let’s name this layout ‘My Glamm’. Click 'Create'.

Swipecart allows you to choose between pre-made layout templates or to make a layout from scratch. As we’re doing the latter, select ‘Blank Layout’ and click on ‘Create Layout’. This will take you to the layout dashboard.  Now we start creating an app like My Glamm.

For more details about creating layouts on Swipecart, click here.

Let’s go ahead and create a Blank Layout for now.

You’ll be taken to your layout dashboard with the default tab “Theme Settings”. The primary function of “Theme Settings” is to customize the app's look. It has multiple options to set branding elements for your app.

App bar Settings: Here, you can customize the app bar that remains constant wherever you go on the app. click here to know what you can do with this.

Next, customize the look of the Side Menu, Bottom Bar, Profile Page, and Input Style (welcome/sign-in page). For all these, go to the respective tabs on the left menu. A set of readymade templates are available for each. Select an option from the variants and save it to the app.

Theme Style Settings- Here, you can manage and edit the fonts, colors, and app loaders for a universal app usage experience. To know more about this, click here.

Here's a Mobile Preview with all the theme settings. 

Swipecart allows you to design the home page with simple drag-and-drop widgets.

When you go to the ‘Home’ tab on your My Glamm layout, you’ll find a home page layout in the center with a widget library to the left and the draft pages on the right.

Let’s see how we can make a mobile app quickly that looks and feels the same as the My Glamm app home page with Swipecart.

Search Bar-We start with the search bar. Select "Search" from the drop-down widget list. Drag and drop the search bar display below the box on the home screen.

Hover over the search bar and click on the "Edit Style" option. In the popup that opens, open popup, customize the search bar's styling parameters

Click here for information on the search bar widget.

Here's a mobile preview with the search bar.

Collection Slider-We displays the collection categories in a slider format at the top of the app.

Select "Collection Slider" from the widget list. Different styled widgets are displayed just below the drag-and-drop box. From here, we select a square collection slider and drag and drop it to the home screen below the search bar.

Click here for details about collection sliders on Swipecart.

You can then choose to add the collection categories via the "Add/Edit Content" option. Click here to know more about it.

Once done, customize your slider design and formatting with the "Edit Style" option later. Click here to know more about how to style widgets.

Here's a mobile preview with the collection slider.

Single Banner- You can use a Single banner whenever you’d want to showcase a promotional campaign or discount offer.

Choose a single banner from the widget library and drop it into the desired position. To know more about the single banner, Click here.

Use the Add/Edit Content option to upload your image and link. After doing so, use the Edit Style option to customize the single banner’s look.

Here's a Mobile preview with the Single Banner.

Banner Grid-Banner grids are useful promotional tools inside the app. Select a "Banner Grid" variant from the styles displayed below the widget list box. Place it inside the home screen. For more details on banner grids, click here

Use the Add/Edit Content option to upload your image and link.

After doing so, use the Edit Style option to customize the banner grid’s look.

Here's what your banner grid would look like.

Banner slider-Here, you can display multiple banners in a slider format and add links to them as necessary. You can add links to products, collections, pages, or outside URLs

For more information, please click here.

Use the Add/Edit Content option to upload your image and link.

After doing so, use the Edit Style option to customize the banner slider’s look.

Here's a mobile preview with the banner sliders.

Product Slider: To display specific products on the home screen, select "Product Slider" from the widget list. Place one among the style variants inside the home screen.

Click here for information about product sliders on Swipecart.

Add products to the slider from the product slider through the "Add/Edit Content" option. Set the styling elements for the slider through the "Edit Style" option.

Here's a Mobile preview with the product slider.

Besides this, you could add other widgets like  Collection Grid,  Collection Slider,  Product List,  Product Slider,  Search, and Timer.

Here's a video of the final app.