هذا المقال يشرح كيفية عرض عملك بعد الانتهاء منه بشكل احترافي لمصممين الـ UI/UX
غالباً مايتم اهمال الجزء الاهم ، هو نشر المشروع في معرض اعمالك بالنسبة مصممين الـ UI/UX وبالنسبة للمطورين التطبيقات رفع التطبيق في متجر التطبيقات او تصميم صفحة عن المشروع مثلا
الغالبية العظمى (خاصة المطورين) ينشروا صور التطبيق كـ Screenshot وقليل من ينشر باستخدام Mockup البعض يعتمد على خدمات اونلاين والاخر يعتمد على الفوتوشوب لاضافة التصاميم او لقطات الشاشة ضمن الـ Mockup الطريقة اقل تكلفه ، ولكنها مملة
لذا الطريقة الذي سوف اشرحها اليوم ، تعتمد على السهولة والسرعة ايضا مثل الـ Magic
والطريقة تعتمد على موقع Angel الموقع يوفر نمادج مجانية لتجربتها
وايضا والاهم Plugin لجميع برامج تصميم الواجهات Sketch , Figma, Adobe XD النسخة المدفوعه منها يحتوي على اكثر من ٥٠٠٠ Mockups وايضا تدرجات الوان وخلفات ملونه وجاهزة للاستخدام
الشرح راح اشرحه بالاعتماد على Sketch بحكم تفضيلي له وايضا يمكن الاشتراك فيه مجانا لمدة ٣٠ يوم بدون الحاجة لبطاقة ائتمانية فتستطيع تجربة الشرح مجانا بدون الحاجة للدفع رابط الموقع
بالنسبة لموقع Angel كما ذكرت يوفر نسخة مجانية يمكن تحميلها من هنا ، الموقع يتطلب التسجيل)
١- بعد تحميل البرنامج وايضا الـ Sample من موقع Angel
٢- بعد فتح الضغط من الملف الذي حملته من موقع Angel قم بتثبيت نسخة الـ Plygin المتوافقه سوف تجد عدة نسخ
٣- افتح مشروع جديد File >> New
٤- افتح صفحة الاعدادات لتطبيق Sketch واختار تبويب Library اضغط على زر Add Library واختار الملفات التي حملتها
٥- الخطوه الاولة اضغط على insert في الاعلى وبعدها اختار الملف المراد
بالنسبة ليا اخترت cards كما في الصورة التالية
٦- الـ Plugin يعتمد على وجود Artboard اذا كنت مصمم واجهات فكل شاشة عندك عباره عن Artboard لكن اذا كنت مبرمج تطبيقات او مواقع فالي متوفر عندك صورة فقط
٧- لذلك تحتاج تضيف الصور في المشروع اضيف الصورة في المشروع بالنسبه ليا عندي هذه الصور
بالمناسبه يمكنك تحميل تطبيقي من هنا
٨- اختار شاشة وحده بالضغط عليها ، من الكيبورد اضغط على حرف A لاختيار ادارة Artboard
في يمين الشاشة ستظهر خيارات اختار خيار New from selection
كذا راح تتحول الصورة الى Artboard ، كرر نفس الخطوات مع بقيت الصور
٩ – الان كل الصور عندك عباره عن Artboard واضفت مسبقا الـ Mockup الذي تريد استخدامه في هذه الخطوه اضغط على الـ Mockup ، وبعدها تقدر تستخدم اختصار Command + \ او تختار Angle من تبويب الـ Plugin
١٠- بعد تنفيذ الخطوه السابقة سوف تفتح لك صفحة تختار الـ Artboards الذي تريد استخدامه حد الـ Artboards واختار Apply
النتيجة
١١- اذا ماعجبك الـ Mockup تستطيع تغييره من القائمة الموجوده في يمين الشاشة
النتجة بعد التغيير
١٢- من الشغلات المميزه انك تقدر تصنع التصميم الذي تريده
تستطيع دمج عدة Mockup مع بعض مثال وتحددهم وتستخدم الـ plugin النتيجة :
حسابي في Dribbble