محتويات
1. نظرة عامة على Figma
2. مراجعة فيجما
3. دروس فيجما: كيفية استخدامها؟
4. بدائل فيجما والمقارنة
5. أسئلة وأجوبة حول مراجعة Figma

مراجعة كل ميزة من ميزات Figma للحصول على تجربة تصميم ويب لا تصدق

سكايلر ريدسكايلر ريدتم التحديث في 28 فبراير 2023معدل الصور

يعد تصميم واجهات المستخدم لمواقع الويب وتطبيقات الأجهزة المحمولة مع فريقك أمرًا بسيطًا: باستخدام Figma، أداة نمذجة قوية ومجانية. يمكن لأي شخص المشاركة في عملية التصميم بفضل التركيز على التعاون عبر الإنترنت وواجهة إضافية تعتمد على المتصفح. العيب الوحيد هو القيود المفروضة على الإصدار المجاني من الأداة. قد يكون هذا أبسط ما نعرفه عن Figma. يتيح لنا هذا المقال معرفة المزيد عنه من خلال قراءة هذه المراجعات الكاملة لـ Figma.

مراجعة فيجما

جدول المحتويات

1. نظرة عامة على Figma 2. مراجعة فيجما 3. دروس فيجما: كيفية استخدامها؟ 4. بدائل فيجما والمقارنة 5. أسئلة وأجوبة حول مراجعة Figma

1. نظرة عامة على Figma

ما هي فيجما؟

يعد تصميم واجهات المستخدم لمواقع الويب وتطبيقات الأجهزة المحمولة مع فريقك أمرًا بسيطًا: استخدام Figma ، وهي أداة نماذج أولية فعالة ومجانية. يمكن لأي شخص المشاركة في عملية التصميم بفضل التركيز على التعاون عبر الإنترنت والواجهة الإضافية المستندة إلى المستعرض. القيود المفروضة على الإصدار المجاني للأداة هي عيبها الوحيد.

علاوة على ذلك ، يُطلق على البرنامج المستند إلى الويب المصمم حصريًا لإنشاء واجهات مستخدم اسم Figma (UI). تم تطويره في عام 2015 من قبل مجموعة صغيرة من مطوري Google الذين يعتزمون إنشاء نهج أكثر فعالية للتعاون في مشاريع واجهة المستخدم. لقد اعتقدوا أن الأدوات الحالية مثل Photoshop و Sketch ليست متعددة الاستخدامات بدرجة كافية ، مما أثار حنقهم. لذلك شرعوا في تطوير شيء جديد لتمكين الأشخاص من إكمال المزيد من المهام بسرعة أكبر.

علاوة على ذلك ، تم طرح Figma ، التي كانت النتيجة ، للعامة في عام 2016. ومنذ ذلك الحين ، استخدمها الآلاف من المصممين الخبراء وتم تنزيلها ملايين المرات. نظرًا لأنه يوفر للعملاء مجموعة خاصة من الوظائف التي تفتقر إليها البرامج الأخرى ، فقد زادت شعبيتها بسرعة.

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

لماذا استخدام Figma فوق Photoshop؟

برنامج تحرير الصور الاحترافي Photoshop موجود منذ فترة. يقوم المصممون والمصورون بتحرير الصور باستخدام Photoshop لتعديل أشياء مثل القص وتغيير الحجم واللون. تم تقديم تطبيق ويب جديد تمامًا يسمى Figma في عام 2016. وهو مصمم لمساعدة المستخدمين في إنتاج إطارات سلكية ونماذج أولية ونماذج بالأحجام الطبيعية لمواقع الويب والسلع الرقمية الأخرى. فيما يلي الأسباب الثلاثة العظيمة التي تجعلك تستخدم Figma فوق Photoshop.

سهل الاستخدام. تُعد سهولة استخدام Figma واحدة من أبرز مزاياه. لا توجد أشرطة أدوات أو قوائم مربكة قد تُضِلّك. بدلًا من ذلك، كل ما عليك هو الاختيار من القائمة الأساسية في أعلى الشاشة.

لا حاجة إلى خبرة مسبقة. على عكس Photoshop، لا يحتاج Figma إلى أي معرفة مسبقة لتعلمه. يمكن لأي شخص البدء فيه والعمل فورًا.

Figma ممتاز للمصممين لأنه غير مخصص لاستبدال Photoshop. إنه تطبيق مرافق يساعد مصممي المواقع في تحسين عملهم.

2. مراجعة فيجما

التسعير فيجما

Figma هي أداة مجانية مع اشتراكات شهرية وسنوية بأسعار معقولة. العضويات الشهرية والسنوية المتميزة لـ Figma ، برنامج تصميم واجهة مجاني ، للمستخدمين المتميزين. بالطبع ، النسخة المجانية لها قيود. يمكن للمستخدمين عمل ثلاثة ملفات FigJam وثلاثة ملفات Figma. بالنسبة للمستهلكين غير الرسميين ، والفرق الصغيرة نسبيًا ، والمصممين المستقلين ، هذا ليس مروعًا.

بالنسبة للمستخدمين الذين دفعوا ، هناك ترقيتان متاحتان. مكتبات الفريق والمحادثات الصوتية وإضافات الملفات في Professional غير محدودة. مفيد إذا كنت بحاجة إلى الحفاظ على اتساق علامتك التجارية. الرسوم الشهرية هي $15 أو 14 جنيهًا إسترلينيًا أو 24 دولارًا أستراليًا لكل محرر. الأسعار الشهرية للمحررين هي $12 أو 11 جنيهًا إسترلينيًا أو 19 دولارًا أستراليًا للاشتراكات السنوية.

تبلغ تكلفة المؤسسة $45 / 41 جنيهًا إسترلينيًا / 71 دولارًا أستراليًا لكل محرر شهريًا بالاشتراك السنوي وتشمل كل ما يفعله Professional ، بالإضافة إلى المكتبات على مستوى المؤسسة والتحليلات وإدارة الملفات المركزية.

أرقام فيجما

يمكنك عرض شخصياتك المفضلة في الوضعيات التي تعجبك بمساعدة شخصيات الحركة PVC شديدة الوضوح والجذابة في سلسلة Figma. بالإضافة إلى ذلك ، يتم توضيح الأشكال في سلسلة Figma ، المصنوعة من ABS و PVC. كل شخصية تأتي مع حامل مرن. يتراوح ارتفاع الأشكال من 13 إلى 16 سم ، حسب ارتفاع الشخصية.

أرقام فيجما

قوالب فيجما

ابحث عن أكثر من 300 نموذج تم إنشاؤها بواسطة موظفينا لمساعدتك في إطلاق فكرة أو تحويلها إلى شيء جديد. يرجى البدء بالملاحة أعلاه ، أو التمرير لأسفل لتصفح بعض الفئات المفضلة لدينا للحصول على أفكار. فيما يلي بعض قوالب Figma الأكثر شهرة من قبل المستخدمين:

مجموعة أدوات للإطارات السلكية (Wireframe). تتيح لك مجموعة الإطارات السلكية المعتمدة على المكوّنات لدينا التحقق سريعًا من أفكارك وتسريع عملية تصميم مواقع الويب.

استخدم قوالب تطوير المنتجات لدينا للتخطيط للنسخة القادمة التي ستبنيها. توفّر قوالب FigJam خارطة طريق موثوقة من بداية رحلة منتجك حتى المنتج النهائي نفسه، مما يتيح لك تولي زمام القيادة بثقة.

يمكن لـ FigJam إضفاء الحيوية على تخطيط المنتجات. تُعد عملية التخطيط التي تنتهي إلى توافق في الآراء بدلًا من الفوضى الخطوة الأولى في إنشاء منتجات استثنائية. اكتشف كيف يجعل FigJam، وهو سبورة بيضاء إلكترونية للفرق عبر الإنترنت، عملية التخطيط أكثر شمولًا وفعالية وإمتاعًا.

قوالب فيجما

ملحقات وأيقونات فيجما

يتيح لك المكون الإضافي Figma: إحضار الرموز. بالإضافة إلى ذلك ، يمكنك سحب ملفات أيقونة البرنامج المساعد وإفلاتها في Figma. قم بتبديل الرمز المختار بسرعة. للمطورين ، اعرض رمز الرموز المستوردة. أدخل التعليمات البرمجية لاستيراد SVG الفريد. يقوم بفك تشفير البيانات: URI أيضًا. غير مشحون! تقوم Iconify دائمًا باستيراد الرموز كـ SVG ، على عكس المكونات الإضافية الأخرى التي تمنح المزيد من الرموز ولكنها تطلب المال لاستخدام SVG. يوفر مشروع Iconify مفتوح المصدر حصريًا مجموعات أيقونات مفتوحة المصدر.

علاوة على ذلك ، يتتبع البرنامج المساعد آخر صفحة قمت بزيارتها ، مما يجعل من السهل تصفح الرموز أو البحث عنها. من صفحة الخيارات ، يمكنك دائمًا إعادة تعيين المكون الإضافي. الوضع المضغوط متاح أيضًا في البرنامج المساعد للمستخدمين الذين لديهم شاشات صغيرة. قم بتمكين خيار العرض الصغير بالنقر فوق رابط القائمة (3 خطوط).

أيقونة فيجما

التخطيط التلقائي فيجما

واحدة من أهم ميزات Figma هي Auto Layout ، والتي تبرز من الوظائف المماثلة في برامج التصميم الأخرى بفضل قدرتها على التكيف. في جوهرها ، يمكّنك من إنشاء إطارات ومكونات بحيث يمكن توسيعها تلقائيًا ، إما مما يتسبب في ضبط الحاوية مع حجم محتوياتها أو العكس.

التخطيط التلقائي فيجما

3. دروس فيجما: كيفية استخدامها؟

1.

قم بإنشاء حساب Figma

قم بزيارة www.figma.com ، وانقر فوق تسجيل ، واملأ النموذج للبدء بـ Figma. عند الانتهاء من ذلك ، سيتم تشغيل Figma بشاشة بدء تبدو هكذا. للبدء ، حدد "ملف جديد" ، ثم هيا بنا!

Figma إنشاء حساب
2.

استكشف واجهة Figma

تتميز واجهة Figma بمظهر وشعور بسيط للغاية ولكنها تخفي العديد من الإمكانات القوية.

الأداة. يمكن الوصول بسهولة من هنا إلى الأدوات التي يُحتمل أن تستخدمها غالبًا — الإطارات، الأشكال، النص، إلخ. (سنغطي هذه الأدوات خلال الأيام القليلة المقبلة.)

الخيارات. تُعرض في هذا القسم الخيارات الإضافية للأداة التي اخترتها. يعرض Figma اسم الملف عندما لا يتم اختيار أي عنصر (كما في المثال أعلاه). تظهر هنا الخيارات السياقية عند تحديد عنصر ما.

الطبقات. يُدرَج كل مكون في الملف ويُصنَّف ضمن إطارات (Frames) ومجموعات (Groups).

لوحة الرسم (Canvas). هنا تُنجز كل عملك وتقوم بتقييمه.

المفتِّش (Inspector). يعرض المفتش المعلومات والإعدادات السياقية لأي كائن محدد. يمكننا في الصورة أعلاه رؤية الخيارات الخاصة بلوحة الرسم نفسها. سنناقش هذه لاحقًا خلال الأسبوع. يُرجى ملاحظة أن Figma يوفّر علامات تبويب مختلفة في المفتِّش (تصميم، نموذجة أولية، وكود).

3.

خلق إطار

لاختيار أداة الإطار (Frame)، اضغط على زر F. يوجد رمز أداة الإطار تحت قسم الخيارات في أعلى النافذة، حيث يمكنك أيضًا تحديدها كخيار بديل. بالإضافة إلى ذلك، يمكنك الضغط على A من أجل لوحة الرسم (Artboard) إذا كنت معتادًا على استخدام Sketch.

Figma إنشاء الإطار
4.

أنشئ طبقة نص

لنكتب الآن بعض المحتوى. لإضافة طبقة نص، انقر في أي مكان داخل إطار iPhone بعد اختيار أداة النص بالضغط على T. لنكتب تسجيل الدخول (Sign In) لأنه سيكون جزءًا من تصميم الزر. للخروج من أداة النص، اضغط على Escape.

Figma إضافة نص
5.

يجب ترتيب الطبقات في مستطيل

لاختيار أداة المستطيل، اضغط على R. ارسم مستطيلًا على شكل زر حول النص الذي أنشأته حديثًا.

نص فيجما محاذاة ومثلث
6.

محاذاة النص والمستطيل

من خلال الضغط على Escape أو V، تأكد من تحديد أداة التحريك (Move) قبل سحب تحديد مستطيلي (marquee) حول النص والمستطيل.

مثلث محاذاة فيجما
7.

تعديل الخط

يمكنك زيارة إعدادات المفتش أثناء اختيار طبقة النص لتغيير الخط وحجمه ووزنه ولونه. لا يزال Roboto مستخدمًا ، لكن الكتابة أصبحت الآن جريئة ومكتوبة بخط كبير. حاول النظر في اختياراتك!

تعديل النص فيجما
8.

حفظ وتسمية الملف

تسمية ملفنا هي المهمة الأخيرة لليوم؛ للقيام بذلك، حدد كل الكائنات (استخدام Escape سيعمل) ثم انقر حيث تظهر كلمة Untitled في أعلى النافذة. بعد ذلك أدخل الاسم، ثم اضغط على Save للإنهاء.

4. بدائل فيجما والمقارنة

الخطط والسعر الواجهة والخبرة تصميم التعاون عبر الإنترنت
4.0 4.5 4.5 4.0
4.0 4.0 4.5 4.0
4.0 4.0 4.0 4.0
4.5 4.0 4.0 4.0
4.0 4.5 4.5 4.5
4.0 4.0 4.0 4.0
4.0 4.0 4.0 4.0

5. أسئلة وأجوبة حول مراجعة Figma

هل Figma متوقف عن العمل؟

قد يتعطل ملف Figma لعدة أسباب. يعد إعادة تشغيل جهاز الكمبيوتر هو الحل الأكثر شيوعًا. حاول إعادة تحميل الملف أو فتحه في متصفح مختلف إذا لم يفلح ذلك.

كيف يمكن قص شكل في Figma؟

عندما تختار Crop من القائمة المنسدلة لوضع Fill في الزاوية العلوية اليسرى من الشاشة ، ستضيف Figma ثمانية مقابض زرقاء إلى حواف الصورة. بعد ذلك ، يمكنك تحديد مقدار الصورة المراد إظهارها بالنقر فوق المقابض الزرقاء وسحبها في أي اتجاه.

هل من السهل تعلّم Figma؟

Figma هو برنامج سهل نسبيًا لمصممي الويب الجدد للتعلم. هذا لأن Figma توفر للمستخدمين إصدارًا مجانيًا مقيّدًا من البرنامج بدون حد زمني مدمج ، والأدوات سهلة الاستخدام.

استنتاج

ستفهم FIGMA جيدًا من هذا المنشور ، إلى جانب مزاياها وعيوبها الرئيسية. منصة تطوير البرمجيات مفتوحة المصدر والقائمة على الفريق لإنشاء تطبيقات الويب هي FIGMA. يحتوي على محرر كود وأداة اختبار ومحرر نص منسق. وحدة التحكم في عرض النماذج (MVC) هي أساس FIGMA. حتى لو كان لها عيوب معينة ، يمكنك بسهولة تعلم Figma باتباع بعض الخطوات البسيطة المذكورة أعلاه بفضل فوائدها. نأمل أن يعطيك هذا المنشور كل التفاصيل.

هل وجدت هذا مفيدا؟

329 أصوات

نعمنعمشكرا لإعلامنا!لالاشكرا لإعلامنا!
برنامج AnyMP4 Video Converter Ultimate

محول ومحرر ومُحسِّن فيديو الكل في واحد تمت ترقيته باستخدام AI.

برنامج AnyMP4 Video Converter Ultimate