How to create an app like Sendo

Once done, sign up and activate Swipecart on your website’s backend. On the Swipecart dashboard, click on ‘Layouts’ from the left menu.

To create a new layout, click on the “Create Layout” icon.

A popup would appear asking you to name the layout. Let’s name this layout ‘Sendo’. Click ‘Create’. We can now start creating our app.

A popup would appear asking you to choose from a blank layout or several pre-made layout templates

As we’re creating an app from scratch, let’s select ‘Blank Layout’. Click on ‘Create Layout’. This will take you to the layout dashboard. We commence our app design from here.

On the dashboard, you’ll see the ‘Theme Settings’ tab by default. Here, you can customize the app’s look and set branding elements to it.

Let’s start with the ‘App Bar Settings’ on the left of our Sendo layout dashboard.

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

Next, customize the look of the side menu, bottom bar, user 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 what the draft app would look like after these settings.

Once you’re done with the theme settings, go to the ‘Home’ tab. Here, you have the app pages list to the left, the draft app to the center, and the widget library to the right.

Search Bar- No matter how many pages your app has, your app needs a search bar for easy and efficient navigation. In the widget library drop-down, select the search bar.

Drag and drop the search bar just below the App bar. Once done, adjust the way it looks with the ‘Edit Style’ option that appears upon hovering on the search bar in the draft home page layout.

For more information regarding the search bar, click here.

Here’s a preview of the search bar on a mobile layout.

On the app pages list, you’ll find an ‘Add page’ option. A popup would appear upon clicking on this. Here, name the page as required. For more information about creating a new page, Click here.

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 Round Collection grid. For more details, please click here.

Upon hovering on the dropped Collection Grid widget, you will find an 'Add/Edit Content' option. Use it to add your images and links. To know how to use this option, click here.

Once you're done with adding the required links and images, you'll find an 'Edit Style' option below Add/Edit Content. Use it to customize the Collection Grid widget. To know more about using this option, click here.

This is how the round collection grid will look on mobile.

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 what the Sendo app would look like with the single banner.

Product slider- Let's add a product slider to the home screen layout. Locate a drop-down box next to the home screen.

Select "Product Slider" from the widget list. Different variants are displayed just below the drop-down box.

Drag and drop the one you like into the home screen layout. To know more about product sliders, 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 product slider’s look.

This is how the app would look with the product slider.

Product Grid - You can showcase some of your star products using a product grid. Choose a product grid style from the widget library and drop it into your draft home page layout. For more details about this, click here.

Use the Add/Edit Content option to choose the products/ collections you’d like to showcase.

Once done, you can customize the product grid with the Edit Style option.

Just as we did here, add the respective widgets to all other pages.

Besides this, you could add widgets like a Banner Grid, Banner Slider, Collection Grid, Product List, Search, single banner, Carousel Banners, and Timer.

After you’ve added all the widgets, links, and images to your app, here’s what the draft Sendo app would look like.