The Tapcart Design Guide

A comprehensive guide to creating and launching your app.

Design with your brand in mind.

 

Tapcart gives you all the tools you need to design a fully-branded mobile app. With no coding or UI experience required, you can design your own app and update it in real-time. Our intuitive design dashboard and flexible drag-and-drop app builder give you the power to customize designs, layouts, imagery, fonts, icons and more.

 

 


 

In this guide, we’ll walk through all of the design elements and Tapcart’s best practices to achieve a truly successful app.

 

Colors.

Whether you prefer a simple color scheme or daring color combinations, the Tapcart dashboard lets you customize the colors of your app’s primary, accent, and icon colors to match your brand. You can either use our preselected color pallet or enter your brand’s own hex codes. This area also allows you to select your header icons for your main menu and your cart.

Primary color: This color is the main background color of the header and other parts of your app. In the example below, this is set to white as the logo text is black.

Icon color: This is the color of the icons in your app. In the example below, this is set to a darker shade with hex code #231F20.

Accent color: This is the color of the buttons in your app. In the example below, the accent color used is #C6A95A which is a mustard-gold that is the brand’s noticeable color. We recommend not using any grey-scale colors as in the user experience world, grey colors are meant to convey that something is disabled.

 

Brand logo.

The brand logo is the image that will display in the header of the homepage in your app.

  • The image size must be 200×50 PNG (i.e. 200 pixels wide by 50 pixels long)

  • Ensure the image has a transparent background and fits in the header area.

 

The size can further be adjusted using the slider in your app’s design dashboard.

 

App Icon.

Your app icon is one of the most important aspects of your app because it’s the real estate on your user’s phone and will be seen within the app stores.  An enticing app icon will bring your customers back into the app time and time again.

  • Your App Icon must be uploaded as a 1024×1024 pixel PNG file

  • Keep it simple and recognizable to your brand. We recommend using a logo and avoiding text in general.

 

 

 

Launch Screen.

The launch screen is an image that will appear for 2-3 seconds prior to loading your app. This is a prompt at the start of each app session, so keep in mind that if you do not fully quit the app then the launch screen will not appear again.

To optimize your launch screen, we recommend the following:

  • Your launch screen must be 1125 x 2436 dimensions to be compatible with the latest iPhone model

  • Avoid text on the sides and corners as they may get cut off in smaller iPhone screens

  • Include lifestyle imagery to ensure it grabs the attention of your audience


 

Menu.

You can also edit your menu, which we like to think of as your brand’s mobile content hub. With the Tapcart Dashboard, you can design the section titles, icons, and the order as well as the menu background image, which will make your app all the more dynamic.

The Menu sidebar helps customers navigate your app and find exactly what they’re looking for. In addition to the default menu sections like ‘Home’, ‘Collections’, ‘My Bag’, and ‘Orders’, this is a great place to add extra menu items that link to content outside of the app. For example, you can add videos, music, shows, blogs, lookbooks, and more to create a versatile and comprehensive brand experience in the app.

Multi-level Menu Collections.

The Multi-Level Menu Collections improves your app’s navigation and makes your app’s aesthetic dynamic. Now you can add images for each collection and simply drag-and-drop to rearrange the order.

 

 

Icons.

Choose from thousands of icons to use in your app. You can use them in the Menu as well as edit the header icons.

 

Fonts.

Select the font that best matches your brand.

 

Placeholder Image.

Show your brand when product images are loading.

  • Your Placeholder Image must be uploaded as a 750×750 pixel file

 


 

If you have any questions while designing your app, Tapcart’s team of mobile experts are here to help you every step of the way. Email us at team@tapcart.co or call 1-310-694-5085 for additional support.