SuperAPI AI Directory

food-delivery

Design & creation

View repository

Updated 10-16 09:54

About this skill

Food Delivery Design

Restaurant Listing

  • Hero photo of signature dish
  • Restaurant name, cuisine type, rating
  • Delivery time estimate and fee
  • Distance from user
  • Promotion badges ("Free delivery", "20% off")
  • Open/closed status

Menu Display

  • Categories with sticky header while scrolling
  • Item: photo, name, description, price
  • Dietary tags: vegetarian, vegan, gluten-free, spicy level
  • Popular items highlighted
  • Customization options in a bottom sheet on selection
  • Add to cart with quantity selector

Cart & Checkout

  • Floating cart button with item count and total
  • Easy item modification (tap to edit)
  • Special instructions text field
  • Tip selection (preset amounts + custom)
  • Clear breakdown: subtotal, delivery fee, service fee, tip, total

Order Tracking

  • Status timeline: Confirmed → Preparing → Picked up → On the way → Delivered
  • Real-time map with driver location
  • Estimated arrival time (updating)
  • Contact driver option (call/message)
  • Photo confirmation of delivery

Food Photography

  • Overhead or 45-degree angle
  • Natural lighting preferred
  • Styled but not unrealistic
  • Consistent background/surface across the app
  • Aspect ratio: square (1:1) for grid, 16:9 for hero