Design studio

Open App Builder and pick an app. The builder has three tabs: Design studio, Add-ons and WooCommerce. The header shows the app’s icon, name and status, an app switcher, and the Build the app or Publish update button.

The Design studio is three panes: a rail of panels on the left, the controls in the middle, and the phone preview on the right. The preview shows your real synced products and has a screen switcher: Intro, Home, Shop, Product.

Saving

There is no save button. Every change saves on its own a moment after you make it. The indicator reads Saving… then Saved. If a save fails it says so and retries on your next change.

What reaches installed apps without a build

Everything in this guide except the launcher icon, the app name on the phone’s home screen and the app id reaches installed apps over the air: an installed app downloads the change on its next launch and shows it on the one after. There is no rebuild and no store re-review. The launcher icon, home-screen name, app id and the native launch-screen colour need a new build, because they live in the binary. See Builds.

Branding

Theme color. Twelve swatches plus a custom picker. It drives the app header, buttons and accents.

App icon. A square image, 1024 × 1024 recommended, PNG, JPEG or WebP. It is the phone’s launcher icon, which updates on your next build, and the small mark on the splash screen and side menu, which updates right away. Images that are not square or are smaller than 512 × 512 are refused. Two advisories are worth acting on before publishing: the App Store needs 1024 × 1024, and it refuses icons with transparency.

Logo in the app. Your wordmark, shown on its own in the app’s Home header in place of the icon and store name. Upload a wide image, ideally a transparent PNG around 600 × 160; there is no size or shape rule. It reaches installed apps over the air, no rebuild. Leave it empty to keep the icon + store name header. The splash screen and side menu keep the square App icon either way.

Dark mode. When on, the app follows the shopper’s device setting.

Language & direction. English or العربية · RTL. Arabic stores get a fully mirrored right-to-left storefront with Arabic strings throughout.

Navigation style. Bottom tabs, Side menu, or Tabs + menu, which suits stores with more than five categories.

The side menu. With Side menu or Tabs + menu, the drawer opens with your logo (the Logo in the app image, or the icon and store name), then Home and Shop, then your categories as a tree: parent categories with their WooCommerce images, children one tap deeper, and an All categories row once there are more than eight at the top level. Cart, Wishlist, Orders and Account follow under You, and the WhatsApp button under Help. Every enabled category is listed unless you switch off its Side menu toggle on the WooCommerce tab, which keeps it in Shop but out of the menu.

Bottom tabs. Home is always first. Four or five tabs in total, each with an optional label of up to 12 characters, chosen from Home, Shop, Cart, Account, Offers, Wishlist, Orders, Search, or a single category.

Layout & type

Storefront style. Two presets, each a complete look built on the same screens:

• Fashion: serif headings, airy spacing, portrait product cards. Built for apparel and lifestyle catalogs.
• General: sans headings, comfortable density, square cards. The safe default for everything else.

Until you choose, StoreToNative may pick a preset from your catalog. The moment you pick one, it stays.

Below the preset, each group of controls can be customised and reset independently:

Group	Options
Typography	Sans, Serif, Cairo (pairs well with Arabic)
Type scale	Compact, Regular, Large
Headers	Start, Center
Shape	Card corner radius
Density	Airy, Comfortable, Compact
Product card	Card style Flat, Outlined or Elevated; thumbnail Portrait or Square; price Subtle or Prominent; sale badge Text or Pill
Buttons	Style Filled, Outlined or Soft; height Compact, Regular or Tall
Grid	Two or three columns
Images	Fill or Fit
Surface	Neutral, Warm, Cool
Loading	Shimmer, Spinner, Top bar
Splash	On or off, and an entrance animation: None, Fade, Rise, Scale, Shimmer, Ring, Bloom

Home layout

The home screen is a list of sections you add, reorder and configure. It has its own guide: Home screen.

Intro

The tour shoppers see on first launch. Show the intro turns it on; Ask for notification permission on the last slide makes the final slide’s button double as the push permission prompt, which is the moment shoppers are most likely to say yes.

Up to six slides. A Story slide has an image, a title of up to 60 characters, a body of up to 160, and an animation (Fade, Rise, Scale). One slide can be an Interest picker, which asks the shopper to choose categories; the For you home section uses their answer. With no slides configured, shoppers see the built-in three-slide tour.

Contact & legal

• WhatsApp number. Gives shoppers a Chat on WhatsApp button on the account screen and on each order, plus an optional floating chat bubble in the app.
• Support email and Support URL.
• Privacy policy URL. Required to publish: neither store will review an app without one.
• Terms of service URL.
• Account deletion URL. Google Play’s Data safety form requires one when the app has accounts. If Shopper accounts are on, the app also offers deletion natively.

Keep these pages on your store’s own domain. Off-domain policy pages are flagged as a risk on the App Store checklist, because Apple reads them as a sign that the app is not the store’s own.