شومـا (SHOMAAA)؛ فروشگاه آنلاین پوشاک رسمی و اکسسوری
فروشگاه آنلاین پوشاک رسمی مردانه و زنانه با هویت بصری اختصاصی، رابط فارسی و راست‌چین و تجربه خرید واکنش‌گرا؛ سفارش خانم یاسمین یمینی.
فروشگاه آنلاین پوشاک رسمی مردانه و زنانه شوما با Next.js و ووکامرس، رابط فارسی راست‌چین و ۳۰ محصول نمونه؛ سفارش خانم یاسمین یمینی.
فروشگاه آنلاین پوشاک رسمی: جزئیات و ویژگی‌ها
مشاهده فروشگاه زنده: shomaaa.ir
شومـا (SHOMAAA) یک تجربه مدرن خرید آنلاین پوشاک رسمی مردانه و زنانه است؛ کت‌وشلوار، بلیزر، پیراهن، پوشاک مجلسی و اکسسوری. تمرکز پروژه بر هویت بصری اختصاصی، رابط فارسی و راست‌چین، نمایش حرفه‌ای محصولات و تجربه خریدی روان در موبایل، تبلت و دسکتاپ بوده است.
سفارش خانم یاسمین یمینی · طراحی و توسعه: تفکر پردازان
اهداف و نیازمندی‌های کسب‌وکار
- ساخت فروشگاهی متمایز برای بازار ایران که ظاهر آن شبیه قالب‌های آماده نباشد و به یک برند مد اعتماد‌آفرین شبیه باشد
- نگه داشتن مدیریت محصول، موجودی، تخفیف و سفارش در ابزار آشنای ووکامرس
- تجربه کاملاً فارسی و راست‌چین، با اعداد، قیمت‌ها و تایپوگرافی درست
- سرعت مناسب موبایل، سئوی تمیز و قابلیت توسعه بعدی (درگاه پرداخت، حساب کاربری)
مفهوم طراحی و هویت برند
نام و نشان برند، پالت و تایپوگرافی از ابتدا طراحی شدند: نشان یک «یقه کت» ساده با دکمه برنزی، نوشتار لاتین SHOMAAA با حروف باز و فونت وزیر برای متن فارسی. پالت بر پایه عاجی گرم، زغالی و برنزی/زیتونی ملایم است و از گرادیان‌های رایج و کارت‌های بیش‌ازحد گرد پرهیز شده است.
سیستم طراحی با الهام از نظم Adobe Spectrum ساخته شد: شبکه ۴ پیکسلی، مقیاس تایپوگرافی پلکانی، توکن‌های رنگ و حالت‌های تعامل (hover، فوکوس، غیرفعال)، حلقه فوکوس ۲ پیکسلی و فرم‌ها و دیالوگ‌های دسترس‌پذیر. بسته Spectrum نصب نشده است؛ اصول آن به‌صورت دستی و با Radix UI برای اجزای دسترس‌پذیر پیاده شده‌اند.
تجربه کاربری و طراحی واکنش‌گرا
- منوی ناوبری راست‌چین، منوی موبایل، جست‌وجوی زنده و سبد خرید کشویی
- صفحه مجموعه با فیلتر قیمت، سایز و رنگ، مرتب‌سازی و صفحه‌بندی
- صفحه محصول با گالری، انتخاب سایز/رنگ، اعتبارسنجی انتخاب و وضعیت موجودی
- بدون سرریز افقی از ۳۲۰ تا ۱۹۲۰ پیکسل (با تست خودکار)
- حالت‌های خالی، بارگذاری، خطا و صفحه ۴۰۴ سفارشی
قابلیت‌های فروشگاهی (پیاده‌سازی و بررسی‌شده)
- ۳۰ محصول نمونه با نام و توضیحات فارسی، دسته‌بندی، SKU، موجودی، ویژگی‌ها و داده ساختاریافته؛ مدیریت از پنل ووکامرس
- محصولات متغیر واقعی (سایز و رنگ) با موجودی هر ترکیب و تصویر اختصاصی رنگ‌ها
- جست‌وجو، فیلتر، مرتب‌سازی، سبد خرید ماندگار، تغییر تعداد، حذف و کد تخفیف
- تسویه حساب مهمان با اعتبارسنجی نشانی و موبایل ایرانی و ثبت سفارش واقعی در ووکامرس
- ارسال رایگان بالای ۱۵ میلیون تومان و هزینه ثابت ارسال
معماری فنی و فناوری‌ها
ویترین با Next.js (App Router)، React و TypeScript سخت‌گیر نوشته شده و فقط از سمت سرور با Store API عمومی ووکامرس ارتباط می‌گیرد؛ هیچ کلید محرمانه‌ای در مرورگر یا مخزن وجود ندارد. توکن سبد خرید در کوکی httpOnly نگهداری می‌شود. پشتیبان فروشگاه WordPress + WooCommerce + MySQL است و برای استقرار از Kubernetes (k3s)، Traefik و گواهی Let’s Encrypt روی زیرساخت تفکر پردازان استفاده شده است. Playwright برای تست انتها‌به‌انتها به‌کار رفته است.
تولید تصاویر محصول با هوش مصنوعی
تصاویر محصولات با مدل Nano Banana 2.1 (از طریق OpenRouter) و با یک اسکریپت قابل‌ازسرگیری، با سقف هزینه و اعتبارسنجی خروجی تولید و به WebP بهینه شدند؛ ۴۲ تصویر روی هم حدود ۱٫۵ دلار هزینه داشت. این تصاویر تصویرسازی هستند و در خود فروشگاه هم «نمونه (تصویرسازی‌شده)» معرفی شده‌اند.
عملکرد، دسترس‌پذیری، سئو و امنیت
- Lighthouse موبایل (شبیه‌سازی شبکه کند): عملکرد ۸۸ تا ۹۳، دسترس‌پذیری ۹۶ تا ۹۷، بهترین‌روش‌ها ۱۰۰، سئو ۱۰۰؛ CLS برابر صفر
- سئو: عنوان و توضیحات فارسی، canonical، نقشه سایت، robots، داده ساختاریافته محصول و breadcrumb
- امنیت: اعتبارسنجی ورودی با Zod، محدودیت نرخ، بررسی مبدأ درخواست‌ها، هدرهای امنیتی و HSTS، شبکه‌بندی پیش‌فرض‌بسته در کلاستر و عدم دسترسی عمومی به پنل مدیریت
- ۵۷ تست خودکار Playwright روی نسخه تولید شامل ثبت سفارش، سبد، فیلترها و واکنش‌گرایی
وضعیت پروژه
فروشگاه روی shomaaa.ir با HTTPS معتبر در دسترس است و به‌صورت ویترین نمایشی اجرا می‌شود: محصولات و قیمت‌ها نمونه‌اند و درگاه پرداخت واقعی هنوز متصل نشده است (ثبت سفارش بدون برداشت وجه انجام می‌شود). ورود با حساب کاربری و تاریخچه سفارش در این نسخه وجود ندارد و برنامه‌ریزی‌شده است.
مشخصات پروژه
- سفارش‌دهنده: خانم یاسمین یمینی
- حوزه: فروشگاه اینترنتی پوشاک و اکسسوری
- بازار هدف: ایران · زبان: فارسی · طراحی: واکنش‌گرا و راست‌چین
- وب‌سایت: https://shomaaa.ir
- طراحی و توسعه: تفکر پردازان — tafakorpardazan.ir
پروژه‌ها و خدمات مرتبط
نمونه‌های مرتبط: مهراکو و جوهر. این کار بخشی از خدمات توسعه نرم‌افزار تفکر پردازان است. برای گفت‌وگو درباره پروژه مشابه، با تفکر پردازان تماس بگیرید.
سفارش این پروژه
نیازمندی‌های خود را بنویسید؛ همکاران ما برای بررسی و ارائه پیشنهاد با شما تماس می‌گیرند.
پروژه‌ای در ذهن دارید؟
از ایده تا نمونه اولیه و محصول، در کنار شما هستیم.