WrapUI | منصة احترافية للعرض الثلاثي الأبعاد (3D) لتطبيقات الموبايل

تفاصيل العمل

مشروع WrapUI هو أداة متطورة مصممة لمساعدة المصممين والمطورين على عرض تطبيقاتهم بأسلوب سينمائي تفاعلي. يعتمد المشروع على تقنيات الويب الحديثة لتقديم تجربة مشابهة لبرامج التصميم الاحترافية ولكن مباشرة من خلال المتصفح.

قمت بتطوير هذا المشروع باستخدام Angular 18 و Three.js، مع التركيز على تقديم أداء عالٍ (High Performance) وتحكم كامل في العناصر ثلاثية الأبعاد والإضاءة والتحريك.

المميزات الرئيسية التي قمت بتنفيذها:

- استوديو النماذج (Mockup Studio): دعم كامل لأجهزة متعددة (iPhone 15, Pixel 8, MacBook, Apple Watch) مع إمكانية التحكم في وضعية الجهاز (Position, Rotation, Scale) في فضاء ثلاثي الأبعاد.

- نظام تحريك سينمائي (Cinematic Animations): تطوير 17 نوعاً من التحريكات الجاهزة مقسمة لفئات (Entrance, Showcase, Interactive, Loop) مع إمكانية التحكم في السرعة ومزج الحركات.

- تعديل المواد والإضاءة لحظياً: إمكانية تغيير ألوان الأجهزة، رفع صور الشاشات، وتعديل بيئة الإضاءة باستخدام تقنية (HDRI) للحصول على واقعية مذهلة.

- نظام تصدير متطور:

- تصدير صور عالية الجودة (PNG) بدقة 3x.

- تسجيل فيديوهات للتحريكات بصيغة WebM مباشرة من المتصفح.

- لوحة تحكم ذكية: تتضمن اختصارات لوحة المفاتيح، وإدارة الطبقات.