Part ofmrmp.proYouTube@MrMpAI
Showcase · S5· 7.5 of 60 points

Autumn Book Café: what did each model build?

The prompt every model got

Build a complete Persian, right-to-left landing page for a fictional book café in Shiraz called “Autumn Book Café” that tells a story as you scroll: “a day at the café, from morning to night”. As the page goes down, the light and the sky move from morning to sunset to night, steam rises from a cup, autumn leaves fall and image layers move at different speeds (parallax). It has real 3D effects, such as a book that opens in 3D space as you scroll or menu cards that tilt with the mouse (CSS 3D or Three.js). Sections: a header with a menu, a hero with a tagline and a booking button, a drinks and cakes menu with prices in toman, an about section, the week's events (such as a poetry night and a reading), a table booking form, and a footer with the address and opening hours. The Vazirmatn font from Google Fonts, and every number in Persian digits. No external images; illustrations are made with CSS, SVG or Canvas. The booking form takes a name, a mobile number (starting with 09, 11 digits), a date and the number of guests, shows errors in Persian next to each field and a success message after a valid booking. Mobile numbers typed in Persian digits are accepted too. Animations are smooth, and heavy motion turns off for users who enabled “reduce motion”. The page works on mobile (390 px wide) and desktop. Write the copy yourself, natural and not like a translation.

Original (Persian)

یک صفحه فرود کامل فارسی و راست‌چین برای یک کافه کتاب خیالی به اسم «کافه کتاب پاییز» در شیراز بساز که با اسکرول یک داستان تعریف کنه: «یک روز در کافه، از صبح تا شب». با پایین رفتن صفحه، نور و رنگ آسمان از صبح به غروب و شب برسه، بخار از فنجان بلند بشه، برگ‌های پاییزی بریزن و لایه‌های تصویر با سرعت‌های متفاوت حرکت کنن (پارالاکس). جلوه‌های سه‌بعدی واقعی داشته باشه، مثلاً کتابی که با اسکرول در فضای سه‌بعدی باز میشه یا کارت‌های منو که با حرکت موس کج میشن (با CSS 3D یا Three.js). بخش‌ها: سربرگ با منو، بخش اصلی با شعار و دکمه رزرو، منوی نوشیدنی‌ها و کیک‌ها با قیمت به تومان، معرفی کافه، رویدادهای هفته (مثل شب شعر و کتاب‌خوانی)، فرم رزرو میز، و پانویس با آدرس و ساعت کاری. فونت وزیرمتن از Google Fonts و همه عددها با رقم فارسی. تصویر خارجی نداشته باشه؛ تصویرسازی‌ها با CSS، SVG یا Canvas ساخته بشن. فرم رزرو اسم، شماره موبایل (با ۰۹ شروع بشه و ۱۱ رقم باشه)، تاریخ و تعداد نفر بگیره، خطاها رو به فارسی کنار هر فیلد نشون بده و بعد از ثبت درست پیام موفقیت بده. شماره موبایل با رقم فارسی هم پذیرفته بشه. انیمیشن‌ها روان باشن و برای کاربرانی که «کاهش حرکت» رو در سیستمشون فعال کردن، حرکت‌های سنگین خاموش بشن. صفحه در موبایل (عرض ۳۹۰ پیکسل) و دسکتاپ درست نمایش داده بشه. متن‌ها رو خودت بنویس، طبیعی و بدون حس ترجمه.

Run two builds side by side: compare two models on this challenge