موارد ودروس Adobe Fireworks Wireframing

نشرت: 2015-11-07

يعد Adobe Fireworks أحد أكثر خيارات التطبيقات شيوعًا بين مصممي الويب من أجل التخطيط الشبكي والنماذج الأولية. هناك العديد من الأسباب للنماذج الأولية باستخدام Fireworks على أي محرر رسومات آخر ، لكننا لن ندخلها في هذا المنشور (ربما يمكنك تجربة هذا: A Case for Adobe Fireworks مقابل Photoshop و Illustrator).

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

نحن نعد ، بمجرد أن تبدأ في استخدام Fireworks في التخطيط الشبكي ، فلن تعود أبدًا.

البرامج التعليمية لـ Fireworks Wireframing والموارد من Adobe

إنشاء تصميمات ويب متوافقة مع المعايير باستخدام Fireworks →
توضح هذه المقالة كيفية استخدام التحسينات على ميزة CSS Export حتى تتمكن من إنشاء تصميمات متوافقة مع المعايير.

إعداد نموذج تصميم ويب Fireworks لـ CSS وتصدير الصور →
تسرد هذه المقالة أولاً الأدوات الرئيسية التي يمكن أن تساعدك عند إعداد نموذج تصميم ويب Fireworks للانتقال إلى الويب. ثم يستعرض كل أداة بالتفصيل ويقدم بعض الأمثلة. تستمر هذه المقالة بمثال بسيط لتصميم موقع ويب (يتم توفير ملف PNG). أخيرًا ، تستعرض هذه المقالة وتساعدك على تحسين كود CSS / HTML الذي تم تصديره بسرعة.

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

قوالب CSS مسبقة الصنع في Fireworks →
تشرح هذه المقالة كيف يمكنك استخدام نماذج قوالب PNG المتوفرة لضمان تحقيق أقصى استفادة من ميزة تصدير CSS في Fireworks.

إنشاء نماذج أولية تفاعلية في الألعاب النارية ←
فيديو نصائح وحيل للألعاب النارية. في هذه الحلقة ، ستتعلم كيفية إنشاء نماذج أولية تفاعلية.

دروس الألعاب النارية Wireframing

الألعاب النارية: نماذج أولية تفاعلية في ملف PDF

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

أنشئ إطارًا سلكيًا لموقع ويب لتطبيق iPhone ترويجيًا في Fireworks

يغطي هذا البرنامج التعليمي عملية تصميم إنشاء إطار سلكي لموقع ويب لتطبيق iPhone في Fireworks. بالنسبة لأولئك الذين ليسوا على دراية بـ Fireworks ، ستكون نقطة انطلاق جيدة لاستخدامها في إنشاء إطار سلكي لمشاريع تصميم الويب الخاصة بك. هذا البرنامج التعليمي هو الجزء الأول من سلسلة متعددة الأجزاء.

إنشاء إطار سلكي أساسي باستخدام الألعاب النارية

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

دروس فيديو للألعاب النارية Wireframing

النماذج الأولية في الألعاب النارية (1 من 3)

ستتعلم في هذا الفيديو كيفية إنشاء شريط تنقل بالحالات والقوائم والقوائم الفرعية في إنشاء نماذج أولية لموقع ويب بسيط.

النماذج الأولية في الألعاب النارية (2 من 3)

ستتعلم في هذا الفيديو كيفية ربط الصفحات عند إنشاء نموذج أولي لموقع ويب.

النماذج الأولية في الألعاب النارية (3 من 3)

ستتعلم في هذا الفيديو كيفية إنشاء Swap Image أو Disjoint Rollover وإضافة التفاعلية.

موارد وقوالب إطارات الألعاب النارية

أوامر أورانج

أوامر Orange هي مجموعة ضخمة من الأوامر للألعاب النارية التي تجعل حياة مصمم الويب أسهل وسير العمل أسرع. أوامر Orange مجانية ومفتوحة المصدر.

مجموعة أدوات تخطيط الويب السلكي المصغرة للألعاب النارية

تمنحك مجموعة أدوات التخطيط الشبكي للويب المصغرة من Fireworks الأشكال الأساسية فقط للإطار الشبكي للويب. بالنسبة لأي شيء آخر ، يمكنك استخدام Fireworks محليًا لأن Fireworks نفسها أداة رائعة للنماذج الأولية والتخطيط الشبكي. الملف بتنسيق PNG وهو أصلي لـ Fireworks ويعني أنه يمكنك تحرير جميع الأشكال وتغيير حجمها في Fireworks.

رموز مكتبة Wireframe

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

الإستنسل مكتبة الألعاب النارية المشتركة

مجموعة استنسل للألعاب النارية قابلة للتنزيل. المجموعة في تنسيق المكتبة العامة.

قالب موقع شركة أبيض وأسود

نموذج مخطط سلكي مصمم للاستخدام مع موقع ويب الشركة. التصميم بسيط بالأبيض والأسود.

قالب الألعاب النارية لنظام Android

قالب الألعاب النارية لنظام Android. تم إعادة رسم عناصر واجهة مستخدم Android كصور متجهة. تم تصنيف العناصر في المجلدات في الغالب وفقًا لمفردات Android.

نموذج BlackBerry Mockup للألعاب النارية

نموذج الألعاب النارية لبلاك بيري. تم تصميم القالب لأجهزة BlackBerry بدقة 640 × 480 ، ولكن نظرًا لأن جميع عناصر واجهة المستخدم عبارة عن صور متجهة ، يمكن تغيير حجمها بسهولة.

مكتبة لفتة للألعاب النارية

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

موارد مفيدة للألعاب النارية

Webportio →
Webportio هو مورد رسومي للألعاب النارية. تتمتع جميع ملفات الرسوم ببنية جيدة ، لذا يسهل التنقل فيها. تعتمد الأعمال الفنية على المتجهات ويمكن تخصيصها بسهولة وفقًا لاحتياجاتنا. وجميع الملفات متاحة مجانًا ويمكن استخدامها للاستخدامات غير التجارية أو التجارية.

منطقة الألعاب النارية →
تعد منطقة الألعاب النارية مصدرًا لعشاق الألعاب النارية مع البرامج التعليمية والمقالات وقاعدة الارتباط والأوامر والأنماط والأنسجة والأنماط والأشكال التلقائية. وفقًا لموقع الويب ، فهو أحد أكبر مواقع الألعاب النارية وأكثرها تحديثًا بانتظام على الويب.

قراءة متعمقة

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

هل تعمل بإطار سلكي مع الألعاب النارية؟

دورك الآن: هل تقوم بالتخطيط الشبكي باستخدام Fireworks؟ إذا كان الأمر كذلك ، فلا تتردد في مشاركة البرامج التعليمية و / أو الموارد و / أو القوالب المفضلة لديك في قسم التعليقات أدناه.