CASE STUDY/ 01

خیام کالا

فروشگاه آنلاین روی ووکامرس؛ کاتالوگ چنددسته‌ای با رابط تیره و لهجهٔ طلایی.

حوزهٔ کارفرما
فروش تجهیزات خورشیدی، روشنایی و قطعات الکترونیکی
نقش ما
طراحی و توسعه — از بریف تا انتشار
پلتفرم
WordPress · WooCommerce · WoodMart + WoodMart Plus
وضعیت
زنده روی khayyam-kala.ir
صفحهٔ اصلی — بنر پکیج خورشیدی، ردیف دسته‌بندی‌ها و کارت‌های محصول
اسکرین‌شات واقعی از khayyam-kala.ir — بدون موکاپ و بدون روتوش
brief.md

کارفرما و خواسته

خیام کالا فروشگاهی آنلاین در حوزهٔ انرژی خورشیدی و روشنایی است: پنل و پکیج خورشیدی، اینورتر، باتری، شارژ کنترلر، چراغ و پروژکتور، تا قطعات و ماژول‌های الکترونیکی مثل ترایاک و ماژول. کارفرما می‌خواست این دفترچهٔ پرتعداد، هم برای خرید عادی و هم برای خرید فنی، قابل گشت‌وجو باشد — و خودش بتواند قیمت‌ها را بدون وابستگی به برنامه‌نویس به‌روز کند.

solution.ts

راه‌حلی که ساخته شد

ووکامرس روی وردپرس، با قالب WoodMart

کاتالوگ، صفحهٔ محصول، سبد و تسویه از همان اول روی ساختار استاندارد ووکامرس چیده شد تا افزودن محصول و دسته‌بندی برای کارفرما یک کار روزمره باشد، نه یک پروژهٔ فنی.

درخت دسته‌بندی روشن

منوی اصلی بر اساس همان چیزی است که مشتری جست‌وجو می‌کند: تجهیزات خورشیدی (پنل، اینورتر، باتری، شارژ کنترلر، چراغ و پروژکتور)، روشنایی (LED و COB، پروژکتور، چراغ اضطراری و کمپینگ، چراغ قوه و پیشانی)، ابزار و تجهیزات، و قطعات و ماژول‌های الکترونیکی.

رابط تیره با لهجهٔ طلایی

حس یک فروشگاه فنی، بدون شلوغی: کارت محصول با تصویر، قیمت، تخفیف و دکمهٔ افزودن به سبد؛ چیدمان با Elementor و اجزای WoodMart ساخته شده تا کارفرما بتواند بعداً خودش بلوک‌ها را جابه‌جا کند.

اعتماد و ردیابی

نماد اعتماد الکترونیکی در صفحهٔ اصلی نمایش داده می‌شود و Rank Math Pro برای سئوی فروشگاه فعال است.

process.log

مراحل کار

  1. بریف و استخراج دفترچهٔ محصولات: دسته‌ها، نام‌های فنی و نحوهٔ گروه‌بندی.
  2. چیدمان ساختار فروشگاه و طراحی رابط روی قالب WoodMart.
  3. راه‌اندازی ووکامرس، قیمت‌گذاری به تومان و چیدن مسیر تسویه.
  4. ساخت دسته‌بندی‌ها و ورود محصولات، با تصویر و توضیح فنی هر آیتم.
  5. تست مسیر خرید روی موبایل و دسکتاپ و مرورگرهای واقعی.
  6. انتشار، سئوی پایه و آموزش کارفرما برای ویرایش قیمت و محصول.
stack.json

با چه چیزی ساخته شد

همان ابزارهایی که روی همین سایت فعال هستند.

  • WordPressسی‌ام‌اس و پنل مدیریت
  • WooCommerceفروشگاه، سبد و تسویه
  • WoodMart + WoodMart Plusقالب تخصصی فروشگاه
  • Elementor + Elementor Proساخت صفحهٔ قابل ویرایش
  • Rank Math Proسئوی فروشگاه
  • LiteSpeedهاست و کش سمت سرور
delivered.md

تحویل شد

فقط چیزی که روی سایت خودش قابل دیدن است؛ بدون عدد ساختگی.

  • فروشگاه زنده است: صفحهٔ اصلی، دسته‌بندی‌ها، صفحهٔ محصول و مسیر خرید منتشر شده‌اند.
  • کارفرما از پنل وردپرس محصول و قیمت اضافه یا ویرایش می‌کند؛ بدون کدنویسی.
  • ساختار دسته‌بندی طوری چیده شده که با بزرگ‌شدن کاتالوگ نشکند.
shots/

چند نما از همان سایت

از همین آدرس، در عرض واقعی‌شان گرفته شده‌اند.

next.md

پروژهٔ بعدی این‌شکل می‌تواند سایت تو باشد

بریف را در فرم سه‌مرحله‌ای بنویس — نوع پروژه و بودجه و راه تماس. همان چیزی که در این صفحه خواندی در درخواستت ثبت می‌شود تا بدون تکرار شروع کنیم.

شروع همین نوع پروژه دیدن بقیهٔ کارها
پاسخ معمولاً کمتر از ۲۴ ساعت khayyam-kala.ir