Last week, one of my customers who bought a no-code template asked if I can create a template for eCommerce use cases. I took his idea and came up with this online sneaker store. Here’s my app building process: Product2kit 1. Startup idea 👟🏃‍♂️🏀 Let’s name this mobile app — , an online store for authentic sneaker brands with a community photo-sharing platform. SneakerHypo I ideated the sneaker store concept from . I incorporated some of its branding elements in this app: bold, high-end, black-and-white, and minimalist design. Next, I came up with a list of app features: Goat.com Key functionalities List of sneaker brands Filter by product categories & collections Show recommended sneaker products Product details (image, slideshow, price, brand name) Select shoe sizes (men and women) User comment section Community photo-sharing (upload your sneaker outfits) Add to cart Customer payment via Stripe 👉 Preview the mobile app 2. Tools I use 🔨 Instead of spending months to build a working product, I have used these tools to quickly build the online sneaker eCommerce app: Glide A mobile app generator with app-like features. I use Glide to build the functional features including sign-in via Google, sneakers listing, upload style images, customize shoe sizes, add to cart, and payment integration. Stripe I set up Stripe with the Glide app to handle customer checkout and payment processing. Customers can enter shipping addresses to get their sneakers delivered. Google Sheets I use Google Sheets to create and store the mobile app database such as user data (i.e. email addresses, comment, photo upload) and app content (i.e. sneaker images, item listing, product price, product details). You can also edit the Glide app design and content via this spreadsheet: Behance Instead of designing the app from scratch, I use Behance for UI/UX inspiration. I filtered the search based on the keywords and colors I want: Unsplash I use Unsplash for high-quality free stock photos for all the sneaker images I used in this mobile app (i.e. product display, slideshow, and gallery). 👉 Preview the mobile app 3. Map out the flow 🗺 The next step is to map out the user stories — how users will go through the steps in interacting with your app. This will help you visualize the app features, organize app screens, item listings, and category tags. 👉 Preview the mobile app This article is part of my ↗️ where I share resources about building things. Join me :) Note: toolkit newsletters 4. Build the app features 🚀 Check out the result of the mobile app: (1) Showcase the best sneakers on the home screen The home🏠 screen includes the new arrivals, trending sneaker brands, and special collection series. I’ve also included a promo video on the storefront to create emotional connections with target customers. (2) Explore sneakers, filter and save to favorite list The “Search” screen will show all sneaker items and price tags. Users can also search for sneakers by product category (i.e. Lifestyle, New Pick, Performance, Timeless, Trending) and then save to ❤️ list. (3) Product details, shoe sizes, checkout with Stripe I have included sneaker images, slideshow, price, brand name, description for each product listing. Users can customize shoe 👟 sizes (men & women) before they place orders at the checkout. (4) Find sneaker inspiration from community posts This “Instagram-ish” feature: Users can browse inspiration or upload a photo with caption to post their favorite sneaker outfits on the “Community” section. (5) User comment and recommended products Users can leave a comment on a specific product to create a sense of community interaction on the app. I have also built a “similar product” listing to display relevant products based on category type. As a , I built micro tools to solve my own problems. For example: , , , and product builder↗️ article tool event app meal box app finance tracker , SaaS tracker , Notion portfolio , habit tracker . 👉 Preview the mobile app [1] Find me on Personal Site / Twitter / LinkedIn 🔥 [2] In case you miss out, I can send my upcoming toolkit to your inbox — Click here to join my newsletter 💌

Flow

Google

Instagram

Stripe

Target

Twitter

Built 11 MVP, no funding. Apps on Product Hunt #1 & Lifehacker. Product consulting US/APAC cos. 👋About: whizzoe.com

Build an eCommerce Mobile App using Google Sheets, Stripe And Glide

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

Venture Report: How to Monetize This Year's Big 3 Market Opportunities

Why GradientTape Is the Most Underrated Feature in TensorFlow

AI Is Eating the Classroom, and That’s Not a Bad Thing.

The Dragon Hatchling Learns to Fly: Inside AI’s Next Learning Revolution

How AI Can Help You Avoid Overpaying for Bitcoin Transactions

Venture Report: How to Monetize This Year's Big 3 Market Opportunities

Why GradientTape Is the Most Underrated Feature in TensorFlow

AI Is Eating the Classroom, and That’s Not a Bad Thing.

The Dragon Hatchling Learns to Fly: Inside AI’s Next Learning Revolution

How AI Can Help You Avoid Overpaying for Bitcoin Transactions

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps