AI Comparison

Prompt

Build a mobile food delivery app home screen (390px wide, iPhone-style), as a single responsive web app with clean, production-quality UI. White background, dark charcoal text, a coral-red primary accent (#E5484D), rounded corners throughout, and a modern rounded sans-serif font (e.g. Nunito or Poppins). 1. Header row: - Left: red location pin icon, the address "King St" in bold, and a down chevron to change address. - Right: a light-grey pill containing a segmented toggle. The selected segment is a white pill with a red car icon and the bold label "Delivery". Next to it is a shopping bag icon for Collection. 2. Search bar: - Full-width white rounded rectangle with a soft drop shadow and a magnifier icon. - Placeholder reads: Search for "Vegan" (with "Vegan" in bold). Rotate the bolded word every 2 seconds through Vegan, Pizza, Sushi and Halal. 3. Cuisine categories: - Horizontally scrollable row of circular food photos with a thin grey border, each with a bold label below: Burgers, Pizza, Kebab, Curry, Breakfast, Chinese, Desserts. - The last item is cut off at the screen edge to hint that the row scrolls. 4. Filter chips: - Horizontally scrollable row of outlined pill buttons: "Sort" with a sort icon and dropdown chevron, "4+ Stars", "Low Delivery Fee", "Free Delivery", "Offers". - Tapping a chip toggles a red-filled active state. 5. Restaurant list (vertical cards): - Each card has a large food photo (about 16:9) with rounded corners. Below the photo, the restaurant name in bold on the left and, on the right, a yellow star, the rating in bold, and the review count in grey. - Below that, a grey metadata row: map pin + distance, scooter icon + delivery time, and "Delivery: £X(min: £Y)". - Optional badges on the photo: a teal "NEW" tag at the top-left, and a red discount badge at the bottom-left reading "10 % OFF | Min: £20". - Card 1: Family Kebab House, 4.8 (6.2k+), 5.34 mi, 45 mins, Delivery: £5(min: £10), with NEW and 10% OFF badges. - Card 2: Kings Takeaway, 4.7 (3.1k+), 0.17 mi, 45 mins, Delivery: £2(min: £5), no badges. - Card 3: a full-width promotional banner styled as a dark-blue poster reading "NEW & LOADED – BIG NEWS ALERT! – FACTORY PIZZA DEALS". Make it a swipeable carousel with dot indicators. - Add 3 more restaurant cards with realistic UK takeaway names and data. 6. Bottom tab bar (fixed): - Five tabs with outline icons and labels: Home (house icon, active, red filled), Groceries (shopping bag with produce), Top 10 (sparkles), Orders (receipt), More (grid of squares). - Inactive tabs are dark grey. The bar has a white background and a thin top border. Interactions: smooth horizontal scrolling for the categories and chips, the content area scrolls under a fixed bottom nav, cards scale down slightly on tap, and the Delivery/Collection toggle switches state. Use high-quality food stock photos from Unsplash for all images. Match the spacing, typography weight and visual polish of apps like Deliveroo or Just Eat.

A system prompt was added to support web rendering