تعد أدوات التصميم جزءا أساسيا من عملية جعل أي منتج ويب يبدو أفضل. ولكن ، معظم أدوات التصميم هي برامج ثقيلة لدرجة أنها تتطلب مواصفات متطورة لجهاز المستخدم وإشراك معظم ذاكرة الوصول العشوائي أثناء استخدامها. أيضا ، تسمح أدوات التصميم هذه للمستخدمين باستخدام وظائفهم الكاملة فقط بعد شراء حزمهم المتميزة الباهظة الثمن. كحل لجميع هذه المشكلات ، يحتاج المطورون إلى برامج رخيصة وخفيفة لاستخدامها في أي جهاز بمواصفات متوسطة.
المحتويات
تبديلمقدمة
Figma هو خيار مناسب للغاية يلبي جميع متطلبات المطورين. إنها أداة تصميم مجانية قائمة على المتصفح أصبحت حاليا خيارا شائعا بين المطورين. إنه يوفر تجربة سلسة للغاية لمستخدميه من خلال ميزاته الرائعة والسهلة.
نحن هنا نناقش دليلا كاملا لاستخدام Figma بإمكانياته الكاملة.
في السابق ، كان المصممون والمطورون بحاجة إلى التواصل باستخدام رسائل البريد الإلكتروني فقط. وهذا يؤدي إلى عملية مرهقة تنطوي على العديد من المرفقات وتجربة رهيبة في التعامل معها. ثم دخلت العديد من الأدوات الحديثة حيز التنفيذ. جعلوا إجراءات العمل سهلة للمصممين والمطورين. ولكن ، كانت هناك مشكلة كبيرة أخرى تتمثل في الحفاظ على مزامنة ملفات المشروع في أدوات مختلفة. ومن ثم، لا تزال هناك حاجة كبيرة إلى عملية تتسم بقدر كبير من الكفاءة.
ثم جاءت Figma بإجراءات عملها السلسة. نظرا لأنها أداة قائمة على المتصفح ، يمكن للجميع استخدامها بسهولة مع أي نظام تشغيل يستخدمونه. يحصل المستخدمون على راحة من تثبيت البرامج غير الضرورية لدعم أداة التصميم. نظرا لكونها أداة قائمة على السحابة ، تقدم Figma دائما أحدث إصدار من التصميم لكل مستخدم. أصبح التعاون والاتصالات أيضا أسهل باستخدام هذه الأداة.
تقدم Figma أيضا خدماتها كتطبيق سطح مكتب لكل من Windows و macOS. تطبيق سطح المكتب هو تطبيق متعدد الأنظمة الأساسية مثل Slack و Visual Studio Code. على الرغم من أن تطبيق سطح المكتب والتطبيق المستند إلى المتصفح يوفران نفس الوظائف تقريبا ، إلا أن تطبيق سطح المكتب يحتوي على دعم مدمج لاستخدام الخطوط المحلية بينما تحتاج إلى تثبيت Figma Font Helper لاستخدام الخطوط المحلية في إصدار المتصفح.
لتوفير مساحة عمل جيدة التنظيم ، توفر Figma واجهتها مقسمة إلى 3 أجزاء رئيسية. يحتوي على لوحة قماشية كبيرة في المنتصف ، وشريط جانبي على الجانب الأيسر ، وشريط أدوات على اليمين. يتم استخدام اللوحة القماشية لتحديد موقع جميع التصميمات الموجودة عليها. يحتوي الشريط الجانبي الأيسر على أصول الملف وطبقاته وصفحاته. ويتم استخدام شريط الأدوات الأيمن لاحتواء جميع المعلومات حول العناصر الموجودة في الملف.
يتكون الملف عادة من صفحات متعددة تحتوي كل منها على لوحة قماشية واحدة. يستخدم المصممون تلك الصفحات المتعددة لتنظيم أجزاء مختلفة من الملف بصفحات مختلفة. لذلك ، يجب على أي مستخدم جديد ل Figma أولا التعرف على تلك الصفحات المختلفة للعمل معها بطريقة منظمة للغاية.
التنقل داخل Figma
- سيساعدك الضغط على Ctrl / Cmd والتمرير لأعلى / لأسفل أو الضغط على مفتاحي + و - على التكبير أو التصغير.
- سيؤدي الضغط على مفتاح المسافة والسحب بالماوس إلى جعلك تقوم بالتمرير أفقيا على اللوحة القماشية.
هناك العديد من الاختصارات الأكثر ملاءمة لتجعلك أكثر كفاءة على Figma. ولكن ، لا داعي للقلق بشأن تذكرهم جميعا. يمكنك دائما عرض هذه الاختصارات بالضغط على Ctrl / Cmd + Shift +؟
تحديد أنماط المشروع
يمكنك تحديد جميع الألوان والطباعة والألوان والشبكات والأنماط الأخرى للتصميم في الشريط الجانبي الأيمن. لإلغاء تحديدك ، يمكنك ببساطة النقر في أي مكان في اللوحة أو النقر فوق مفتاح Esc. يمكنك التحقق من جميع المعلومات حول نمط أي عنصر بمجرد النقر فوق رمز التحرير بجوار عنصر النمط.
تحديد عناصر النمط
يمكنك تحديد أي طبقة معينة بالضغط باستمرار على Command أثناء النقر أو بالنقر بزر الماوس الأيمن فوق العنصر لفتح قائمة جميع الطبقات المتداخلة وتحديد الطبقة التي تريدها.
بعد تحديد عنصر ، يمكن اشتقاق معلومات CSS الخاصة به من علامة التبويب "الرمز" في الشريط الجانبي الأيمن. ومع ذلك ، يتم إنشاء CSS تلقائيا ويجب عدم نسخه ولصقه في مشروعك الرئيسي.
بعض الخطوات الأكثر أهمية
- يمكن أن يتيح لك الضغط على مفتاح "Alt" وتحريك الماوس فوق عنصر قياس المسافات بين العناصر ووضعها بشكل صحيح.
- يجب وضع علامة على مادة عرض كمادة قابلة للتصدير لتصديرها. بعد ذلك ، يمكنك استخدام الاختصار Shift + Cmd / Ctrl + E لتصدير جميع الأصول التي تم وضع علامة عليها للتصدير.
- يمكنك استخدام علامة التبويب "النموذج الأولي" في الشريط الجانبي الأيمن لعرض المعلومات حول أي رسم متحرك.
- يمكن أن يؤدي النقر فوق رمز فقاعة الدردشة في شريط الأدوات العلوي أو الضغط على المفتاح "C" إلى نقلك إلى واجهة التعليق وستتمكن من كتابة تعليق حول أي عنصر بالنقر فوق أي مكان في التصميم.
هذه إرشادات موجزة لبعض الإجراءات المهمة التي يمكنك اتباعها للحصول على تجربة رائعة مع Figma. في Seahawk Media ، نبذل قصارى جهدنا دائما للحصول على أفضل المعلومات حول أي شيء لتسهيل استخدامه. للاستفادة من خدماتنا المختلفة ، لا تتردد في الاتصال بنا. أيضا ، قم بزيارة صفحة المدونة الخاصة بنا لمزيد من المعلومات حول منتجات الويب المختلفة.