How to create an app like Blinkit

First install, sign up, and activate Swipecart.

At the Swipecart dashboard, click on the Layout tab in the left menu

As we’re creating a new app from scratch, click on the ‘Create Layout’ option.

A popup would appear to name the app, let’s call the app ‘Blinkit’. Click 'Create'.

After doing so, you’ll be asked to choose a layout. Swipecart allows you to select pre-made layouts or make one from scratch. As we’re making a new app, click on ‘Blank Layout’.

This will lead you to the ‘Blinkit’ layout dashboard. Here, we start creating the app by managing the app’s theme in the Theme Settings tab.

Here, we customize the overall look and feel of the app. Let's start with the App theme settings.

App bar Settings- Here, you can manage and add features to the app bar along with another branding that remains constant wherever you are on the app. Click here to know more about App Bar Settings.

Besides this, you’ve got to choose from pre-made templates for the side menu, bottom bar, profile page, and input style.

Theme style settings- Here, you can manage and edit the app loader icon, fonts, and colors for the entire app. To understand how you could make these changes, click here.

Here’s a preview of the completed theme settings.

Once you are done with the theme settings, you can start designing your app with the help of drag-and-drop widgets on your home page. First, we need to add a single banner to our draft Blinkit app

Single banner- With this, you can attract your user’s attention towards a single item - this could be a collection, a product, or anything else.

Select ‘Single banner’ from the widget library drop-down and choose a style that matches your requirements. Drop it to the draft app home page. For more information, click here.

You can then choose to add the product, collection or page images, or link via the ‘Add/Edit Content’ option. Click here to know more about it.

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

Here is a preview of the single banner on the draft Blinkit app.

Carousel banner- Let's add a carousel banner to the home screen. These are swipeable banners that will enable you to drive conversions.

Select "Carousel Banner" from the drop-down widget list. Select one for your home screen from among the style variants below the box. Click here for more information on using carousel banners for Swipecart.

Use the Add/Edit Content option to add products to the grid.

When done, customize the widget format with the ‘Edit Style’ option.

Check out this preview with the Carousel banner on the draft Blinkit app.

Collection Grid- Next, you can set up a collection grid where you can add links to a set of images for easier navigation. Choose ‘Collection Grid’ from the widget library drop-down. Select the Collection grid style you’d want. For more details, please click here.

Use the Add/Edit Content option to add products to the grid.

Customize the widget format with the ‘Edit Style’ option.

This is how the app would look after adding the collection grid.

Now, we add another single banner as required.

Product Grid - If you want to showcase some products, this widget is ideal for you. Select a product grid from the widget library drop-down and choose a product grid style that matches your requirements.

Drag and drop it on your draft home page layout. For more information, please click here.

As always, use the Add/Edit Content option to add products to the grid.

Later, we customize the widget format with the ‘Edit Style’ option.

Finally, the draft home page of our app would look something like this.

After this, add more single banners and product grids as required.

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