Detailed Explanation of Showcase Elements

The Shopney Design Editor's Showcase section is where you design and personalize your mobile app’s homepage using Shopney’s easy-to-use drag-and-drop design elements. With a few simple moves, you can create a visually appealing and engaging shopping experience.

Here’s what you can do:

The showcase has three main sections: Element Menu(1), where you select elements; App Screen Display Area(2), in which you arrange the elements; and Element Editor Menu(3), where you can customize their content.

To see all your products and collections on your Shopney dashboard to design your app, please make sure they are all included to be used with the 'Shopney' sales channel on your Shopify Dashboard.

Now, let’s dive into each one of these elements!

The Search Bar is the element that allows your customers to search for a certain keyword, tag, or product in your mobile app.

It has three different display options. You can pick one that will fit your branding and style.

The Divider can be used as a separator between two elements to increase the space and to have a better look.

It has five different fixed displays and one customizable display that allows you to set a custom visual of your choice.

With the Title element, you can set a title to any element seen below. It can also be placed under another element as a subtitle; it all depends on your design preferences!

You get 3 alignment options: Left, center, and right. You can also make it interactive by linking it to a collection. In this case, your customers will be directed to the linked collection when the Title is tapped.

Countdown Timer is a design element in which the remaining time for a certain campaign will be displayed on your homepage. You can create flash sales for a certain period like clearance or for your new drops, and display the time-span that the campaign runs in.

The Circle is the element with which you can display different products, collections, or custom content pictures in a circular image frame. It works like a carousel with many contents inside and slides from right to left.

From Content Type, choosing the Web Url option will allow you to use web pages, blogs, or other similar by adding a particular image, name, and URL. Its inner layout is also customizable.

You can adjust margins and title placements, enable or disable the tapping interaction with this element, or hide the content title.

The Gallery is similar to the circle element in how it works. However, it lets you display images in square or rectangular frames. You can display products, collections, and custom content inside. You can use an existing image of a collection/product or set a custom one for your mobile app.

The Gallery offers more customization than the Circle, including various image frame shapes and the option to display prices. Frames can be horizontal, vertical, or square and come in small, medium, or large sizes. Like the Circle, the Gallery allows layout adjustments, including margins, title placement, and tap interaction settings.

This element is similar to the Gallery element however, it has a sliding animation that places the content in the center. And just like the Circle and Gallery elements, you can display products, collections, and custom content inside. You can use an existing image of a collection-product or set a custom one for your mobile store.

The Image is the element that you can use to display collection or product images in bigger dimensions with a vertical slider layout. Your customers can navigate the items inside by scrolling. You can use an existing image of a collection-product or set a custom one for your mobile store. The Image has different display options on image frame shapes as a horizontal rectangle, vertical rectangle, and square form.

You can play with the content title position. The margins of the image are also customizable. You can give it the shape you desire. You can enable or disable the tapping interaction with this element.

You can use this element to fit any image with any dimensions without changing the ratio by clicking on the Auto display type option for any content type.

With the Video Player element, you can add promotional or commercial mp4 videos to your app’s homepage. Adding a video to your app makes its design more dynamic, captures attention instantly, and enhances the user experience with immersive visuals.

The element comes with an easy setup and clear settings. All you have to do is click on upload video (either from your device or with a URL) then, you can automatically choose the thumbnail from a frame in the video or you can add a custom thumbnail.

You can choose to have different buttons and interactions on the video, this includes displaying the control bar, as well as restart and voice buttons. You can also autoplay the video once the customer enters the app, and you can have the video play in a loop.

With the Slideshow element, you can display a collection or product images in bigger dimensions with a horizontal slider layout. Customers can navigate through items by sliding. You can use an existing image of a collection-product or place a custom one for your mobile app.

The Slideshow has different display options based on image frame shapes, these are; horizontal rectangle, vertical rectangle, and square form.

If you want you can choose where the content title will be placed, inside, outside, or hidden.

The margins of the Image are also customizable. You can give it the shape you desire. You can enable or disable the interaction with this element.

The Grid is the element with which you can display collections or products in a grid layout. The user can navigate the items inside by scrolling. You can use the existing image of a collection-product or set a custom one for your mobile app.

The Grid has different display options on image frame shapes, such as horizontal rectangle, vertical rectangle, and square form. This element also has small, medium, and large display size options. By choosing different view sizes, you can easily show more products on your showcase within one element.

Small displays 4 products in a row, medium displays 3, and large 2 products, as shown below.

The margins around the images are customizable. You can have the image with or without margins. You can also hide or reveal the content titles, prices, or borders. Additionally, you can enable or disable the tapping interaction.

The Slider element allows you to display collection or product images in a horizontal frame and a horizontal slider layout where your customers can navigate through the items by sliding. You can use the existing image of a collection-product or set a custom one for your mobile app.

Different from the Slideshow element, please keep in mind that the Slider only has the horizontal shape as a display option for the frames.

The margins of the Slider are customizable, and you can enable or disable interaction with this element.

This fantastic element is a great way to stimulate your mobile app users and drive extra traffic by offering app-exclusive discounts. It’s quite easy to add to your homepage and we have prepared a detailed guide for you to learn each and every detail about it.

The Recently Viewed element automatically displays the products that your customers last visited. This element makes shopping easier and keeps your customers engaged by letting them quickly find products they are interested in.

Please keep in mind that because this element works automatically, products will start appearing after your customers view a product.

And just like the other elements, you can make changes to the products' display type as well as their size.

The Loyalty Element is connected to your Shopney-supported Loyalty & Rewards 3rd party integration; you must first enable the Loyalty program integration in order to use this element. Once you enable the integration and add this element to your showcase, your customers will be able to see their rewards profile.

Last but not least, Live Streams! The Live Stream element will allow you to display your live stream on the showcase, whereas the Stream Replay element will let you add your old live steams to the homepage.

Please note that these 2 elements are connected to LiveMeUp, our supported 3rd party integration for live shopping; you must first enable this integration in order to use the elements.

We have gone over all the available design elements and what you can do with them. Now you are ready to design your awesome app with these various design elements! Please keep in mind to save & update after you are done with your design, and use our Preview app to see how your design would look on the app.

You can watch our step-by-step video tutorial for a more in-depth understanding of the showcase elements.

If you encounter any issues, our support team is here to assist you:

How to Preview Your App?

How To Set Up App-Exclusive Discounts For Your Shopney Mobile App?

What Is Countdown Timer and How To Use It Effectively?