تطوير واجهة المستخدم UI/UX

واجهة الموقع تهدف إلى أن تكون جذّابة، بديهية وسهلة الاستخدام — بحيث يكون التصفح، البحث عن ألعاب/نماذج، وعملية الشراء مريحة وواضحة للمستخدم، سواء على حاسوب أو جوال.

الموقع يعرض فئات منتجات (مثل: Ships, 3D Puzzles, Brain Teasers ...)، كل فئة تحتوي مجموعات من النماذج، مع صور، أسماء، أسعار وخيار "Add to Cart"

مكوّنات واجهة المستخدم الأساسية

• شريط تنقّل رئيسي (Navigation Bar) أعلى الصفحة يحتوي على قوائم الفئات (Categories) وقسم "Home / About / Contact / Brands / Offers" لتسهيل الوصول إلى أقسام الموقع بسهولة. 

• قائمة فئات مرئية تعرض جميع الفئات (Ships, 3D Puzzles, Kids Puzzles، الخ) بشكل منظم، ما يسهّل على المستخدمين تصفّح الفئات والعثور على ما يبحثون عنه بسرعة. 

• شبكة عرض المنتجات (Product Grid / Listing) — المنتجات تعرض بصورة مصغّرة (thumbnail)، اسم، السعر، ومؤشر “ADD TO CART” أو “Add to Cart”. هذا التخطيط يعطي نظرة سريعة وشاملة على الخيارات المتاحة.

• شريط خدمات إضافية (مثل “Track Order”، “Wishlist”، “Cart/Shopping Cart”) ليسهل على المستخدم تتبع الطلبات أو حفظ منتجات.

• قابلية الاستجابة (Responsive Design): تخطيط مرن يتكيف مع شاشات مختلفة (جوال، تابلت، كمبيوتر) حتى تظل تجربة المستخدم متسقة وسلسة. (هذا من مبادئ UI الجيدة)

• تسلسل هرمي بصري واضح (Visual Hierarchy): استخدام صور بارزة للمنتجات، أسعار وأزرار “Add to Cart” واضحة، مما يوجه انتباه المستخدم مباشرة إلى أهم العناصر (المنتج، السعر، الشراء). (مبدأ من مبادئ التصميم المرئي)

مبادئ تصميم و UX متبعة (ولماذا مهمة للموقع)

• البساطة (Simplicity): التصميم لا يحتوي على تعقيد زائد — الأزرار والفئات واضحة والنصوص مختصرة — ما يقلل من تشتيت المستخدم ويسهل عليه اتخاذ قرار. 

• الاتساق (Consistency): الألوان، الخطوط، تنظيم الفئات ونمط عرض المنتجات ثابت في جميع الصفحات — هذا يساعد المستخدم في تكوين “نموذج ذهني” لكيفية استخدام الموقع بسهولة دون تعلّم جديد في كل زيارة.

• سهولة الوصول والاكتشاف (Ease of find / Discoverability): القوائم والعناصر الهامة (بحث، فئات، عربة التسوّق، تسجيل دخول) في أماكن ثابتة ومعروفة، بحيث المستخدم لا يحتاج أن يفكر كثيرًا لمعرفة كيف يتنقل.

• تغذية راجعة / تفاعل واضح (Feedback & Interaction): عندما يضيف المستخدم منتج إلى العربة، يجب أن تظهر رسالة أو تغيير يوضّح أن الإضافة نجحت — هذا يطمئن المستخدم بأن إجراءه تم. (مبدأ من تصميم التفاعل)