المنتديات العلمية

منتدى التكنولوجيا وعلوم الحاسب => منتدى التصميم والابداع التشكيلي => الموضوع حرر بواسطة: الفيزيائية في يونيو 26, 2004, 03:58:51 صباحاً

العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 26, 2004, 03:58:51 صباحاً
بسم الله الرحمن الرحيم
والصلاة والسلام على أشرف المرسلين سيدنا محمد وعلى آله وصحبه وسلم


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


لتحميل البرنامج:
يمكن تحميل نسخة تجريبية لمدة 15 يوم من هذا الموقع:
http://www.swishzone.com/index.php?area=products&product=v2

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

بعد أن تم التحميل، لنبدأ أولا بأهم القوائم التي سوف تجدها أمامك


قائمة الفلم والمشهد:
movie & scene
ما ستقوم به هو التالي:
ستقوم بتصميم فلم متكون من مشهد واحد أو عدة مشاهد (يعتمد على تصميمك، وله عدة اعتبارات، لن أذكرها للاختصار، وتستطيع اكتشافها مع التدريب)
فأول ما يجب أن تحدده هو طول وعرض الفلم، ثم تذهب إلى القائمة الموجودة يمين الشاشة




1. من هنا تحدد الطول والعرض بالنقط (بكسل)
2. لأننا نتحدث عن تصميم متحرك، فالزمن هنا ضروري، والرقم الذي أمامي يعني أنني سأجعل كل 12 فريم يعبر عن ثانية واحدة، ويمكن تغييره.
3. لتغيير خلفية الفلم
4. من هنا تتحكم بالشبكة، وهي لتسهيل العمل، ولن تظهر أثناء العرض النهائي.
5. معنى العبارة: جعل الفلم أثناء تجربته (وليس عرضه) يعمل بشكل لا نهائي.

ثم حدد خصائص واسم كل مشهد




والآن لننتقل على الأدوات الأساسية:
هنا قائمة layout الموجودة في منتصف الشاشة بجانب المربع الأبيض (والذي سيكون العمل عليه)
وفي الصورة تفصيل لكل أداة:




بعد أن تتدرب على كل أداة ولو مبدئيا، انتقل للخطوة الثانية.


قائمة transform
عند إدارج أي صورة أو رسم أي شكل (دائرة مربع) أو حتى إدراج أي نص، سيمكنك تغيير أبعاد وموضع ودوران الشكل عبر هذه القائمة، والتي ستجدها على الجانب الأيمن من الشاشة، بجانب قائمة الفلم والمشهد movie & scene




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



إلى هنا هل كل شيء واضح؟؟

هل هناك أي أسئلة؟؟



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 26, 2004, 04:06:05 صباحاً
التطبيق الأول:

كيفية عمل اطار ببعدين:

1. ارسم مربعا
2. ستظهر لك خصائص الشكل الذي رسمته على الطرف الأيمن من الشاشة (تأمل الصورة)، حدد اللون والحدود.
3. الفكرة الجديدة في التطبيق هي في تغيير شفافية المربع أو الإطار من القيمة التي بجانب alpha (يرمز لها بالرمز A )
4. غير الشفافية إلى 50% مثلا للإطار وتأمل كيف أصبح شكله، ستلاحظ أنه سيتأثر بلون الخلفية التي وارءه.









الواجب:
تدرب جيدا، وفكر كيف يمكن عمل إطار بثلاث أبعاد؟؟

أراكم غدا بإذن الله..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 26, 2004, 04:08:31 صباحاً
يا جماعة خبروني إن لم تظهر الصور لديكم..؟؟
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: المستشار في يونيو 26, 2004, 05:11:35 صباحاً
هلا بك

شكراً لجهودك أختي

الصور لم تظهر لدي
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يونيو 26, 2004, 02:02:45 مساءاً
شكرا لك اختي لكن الصور لم تظهر  :O
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 26, 2004, 02:52:39 مساءاً
عدلت روابط الصور.. هل هي واضحة الآن جميعها؟؟
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: ابو سلمان في يونيو 26, 2004, 06:31:32 مساءاً
السلام عليكم ورحمة الله وبركاته

جزاك الله خير اختنا الفيزيائية على هذه الدروس

والصور واضحة جداً :)

ابو سلمان
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 26, 2004, 06:42:31 مساءاً
الأستاذ القدير.. أبو سلمان

جزاكم الله خيرا على حل مشكلة الصور..

وزادكم الله من فضله..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يونيو 26, 2004, 07:27:01 مساءاً
عملت الدرس الاول بنجاح قبل ما اشوف الصور لكن كيف ادرج الملف لمشاهدة التطبيق .
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 27, 2004, 03:18:48 صباحاً
السلام عليكم..

وصبحكم الله جميعا بالخير..


لنعود إلى تطبيقنا الأخير، كيفية عمل إطار ثلاثي الأبعاد..

وهو يشبه التالي:


الطريقة بإختصار:
1. ارسم مستطيلا.
2. غير ألوانه من قائمة خصائص التي على يمين الشاشة، اختر linear gradiant وغير الألوان بواسطة المثلثين الصغيرين الذين في الأطراف (هل وجدتهم)، واجعل المستطيل بلا إطار.



ملاحظة مهمة: في حالة وأنت تختار الألوان ظهرت عندك عدة مثلثات بالخطأ على طول المستطيل، فما عليك للتخلص منهم سوى أن تمسك بإحداها بزر الفأرة وتحركم خارج المستطيل يمينا أو يسارا، وسوف يختفون تماما.

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

4. الآن بكل دقة..
انسخ المستطيل وضعه على الجهة المقابلة.
لتغيير تدرج الألوان فتصبح متماثلة مع المستطيل السابق، من قائمة Modify ثم transform ثم flip horizental.
ثم انسخ مستطيلا أخر وقم بعمل تدوير له بزاوية 90 درجة من قائمة modify. وغير التدريج.
ثم مستطيلا رابعا أخيرا وضعهم بجوار بعضهم.

الناتج النهائي هو:




4. للتخلص من الزوايا، وجعله مائلة. سنستعمل أداة رقم (4) من قائمة layout واسمها reshap

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

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



حينها سيظهر لديك الخط المائل الذي نريد، كرر العملية على باقي زوايا الإطار إن كنت فهمت الفكرة جيدا.. :)


هكذا انتهى التطبيق الثاني.. هل كان مفهوما!!

لننتقل إلى الخطوة التالية..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 27, 2004, 03:50:48 صباحاً
قائمةInsert و قائمة Control



لعل الصورة تشرح نفسها..



قائمة outline

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


لتجميع عدة صور معا grouping

حدد الصور التي تريد تجميعها من قائمة outline (في المشهد الواحد) بواسطة الضغط على ctrl وتحديد صورة صورة على حدة، أو تحديد الصورة الأولى ثم مع البقاء ضاغطا على shift حدد الصورة الأخيرة وحينها ستحدد لك كل الصور بين الصورتين..

بعد التحديد، اضغط بزر الفأرة الأيمن، واختر grouping



ستلاحظ وجود عدة خيارات للتجميع: جربها ولاحظ الفرق بين كل واحدة والأخرى.


convert التحويل من نص إلى صورة أو من نص إلى زر أو من صورة إلى زر...

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


قائمة التأثيرات، ومسطرة الزمن effect & timeline



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

** في مسطرة الزمن ستلاحظ أنها مكونة من مستطيلات طويلة (مستطيل لكل شكل أو نص) والمستطيل الطويل مكون من مستطيلات صغيرة جدا اسمها frame ويعربوها فريمات :) ........... هل تذكر متى تحدثنا عن الفريمات !! نعم في قائمة movie وقلنا أن كل 12 فريم سيعبر عن ثانية، ويمكن تغيير الرقم.

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

** تستطيع اختيار التأثيرات من القائمة التي بجوار المسطرة من جهة اليسار(سنتكلم عن التأثيرات للصور والنصوص أي effect، أم تلك الخاصة بالمشهد فيسمونها action سنتعرف عليها لاحقا بإذن الله)، جربها كلها، ولاحظ الفرق بينها. هناك سبع مجموعات كل مجموعة هي عبارة عن تأثيرات مختلفة، وعند اختيار أي تأثير ستظهر أمامك لوحة setting لتتحكم بالتأثيرات كما تحب (يمكنك التحكم باللون أثناء عرض التأثير، أو الشفافية alphaأو الجهة التي تريد أن يبدأ فيها التأثير إن كان على شكل نص text.. وغيره)

** تدرب جيدا وجيدا جدا على التأثيرات وكيف يتغير العرض بتقديم وتأخير، أو تبطيء وتعجيل التأثير على مسطرة الزمن. كما يمكنك أن تضع أكثر من تأثير للشكل أو النص الواحد.

** قم بمشاهدة العرض عن طريق الزر: Play movie ، أو play scene الموجود في القائمة فوق المسطرة.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 27, 2004, 03:59:47 صباحاً
درسنا اليوم كان نظريا أكثر..

ولكن غدا بإذن الله سيكون أكثر تشويقا..

وسنتعلم كيفية صنع زر، وتطبيق عليه ( وأعتقد أن سيعجبكم كثيرا جدا)
وتطبيق آخر لعمل نجمة مضيئة جميلة.. :)

وسأخبركم غدا بإذن الله عن قائمة file

ولكن حاليا يا شروق حتى تستطعي أن تدرجي الملف في المنتدى حولي الملف الذي تصنعينه إلى ملف بامتداد .swf وذلك من قائمة file ثم export ثم اختاري أول واحدة SWF، وأدرجي الملف في المنتديات كفلاش.

ولكن على فكرة.. يجب أن يكون لديك flash player حتى تقومي بالتحويل الآنف الذكر ;)


تحياتي الآن..

وأرحب بأي استفسار..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 27, 2004, 04:02:56 صباحاً
نسيت الواجب:

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

تهانينا..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يونيو 27, 2004, 08:56:37 مساءاً
مشكوره اختي مع اني وجدت شوي صعوبه في تحديد الزوايا لكن صممت على تفاديها لكن انتي قلتي انه في السوتش يكتب بالعربي ولكن حاولت وما نفع معاي ابد ممكن اعرف اي انواع الخطوط ينفع مع السوتش وحفظت الواجب على الطريقه الي قلتيها ومع كده عند ادراجه في الفلاش يطلب اسم موقع في النت يعني فشلت في العرض :(
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: ابو يوسف في يونيو 27, 2004, 10:24:08 مساءاً
السلام عليكم

اختي الكريمة الفيزيائية

جزاك الله كل خير على دروس التصميم


اختي الكريمة شروق

يمكنك رفع الملفات الى موقع مستضيف على الشبكة ومن ثم وضعها هنا

راجعي الرابط التالي

:)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 28, 2004, 04:13:42 صباحاً
السلام عليكم..

كيف حالك يا شروق :)

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

الآن عند ادراج نص نقوم بضغط الأيقونه في الشريط العلوي
ستجدين أن خصائص النص ظهرت لك في الجانب الأيمن من الشاشة



1. من هنا تحددي نوع الخط ( أي خط عربي).
2. من هنا تغيري حجم الخط.
3. من هنا نغير لون الخط ( يتضمن هذا الشفافية أيضا).
4. من هنا نكتب النص الذي نريد، ويجب ملاحظة أننا لا نستطيع الكتابة إلا داخل هذا المربع الأبيض (أما داخل المربع العمل فلا يمكن أبدا، وإنما نستطيع هناك أن نقوم بتحديد النص بالنقر عليه، أو تحريك موضعه، أو تغيير حجمه، أما أي تعديل في النص نفسه كتابة، فيجب أن يكون من داخل المربع الأبيض الذي يظهر على يمين الشاشة)

** وفي حالة أن لم تستطيعي الكتابة بالعربي، اضغطي أولا ctrl+shift. ثم إذا بقيت المشكلة موجودة، فاذهبي إلى الشريط الذي يكون في أسفل سطح المكتب (والذي تظهر فيه الإيقونات المفتوحة) وغيري من EN إلى AR بالنقر عليه.


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


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



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 28, 2004, 04:14:35 صباحاً
نعود الآن.. ونتابع آخر ما توقفنا عنده..


تطبيق النجمة المنيرة

تأمل الصورة:



1. نقوم برسم دائرة على أن تكون شديد التحدب من جانبيها (دائرة مضغوطة كما في الصورة)
2. نغير لونها بواسطة radial gradiant أي تدرج دائري، سنغير الألوان بحيث نجعل الدائرة تحمل لونا داكنا في الوسط، ثم لونا شفافا في الطرف كما في الصورة (شفافا تماما أي أن A = 0 )
3. نجعل الدائرة بلا حدود (لاحظ الصورة).
4. نقوم بعمل نسخ ولصق للدائرة (المضغوطة) وندير الدائرة الثانية والتي ستكون فوقها تماما مقدار 90 درجة من modify ثم transform ثم rotate 90 .
5. النجمة الرباعية الآن مكتملة، يمكنك أن تزيد من عدد رؤوسها بزيادة عدد الدوائر.
6. ويمكن أيضا زيادة دائرة في المنتصف (كحركة جمالية) وللمعلومية لرسم دائرة منتظمة، تابع الرسم وأنت تنقر بالزر shift.



7. والآن نجمع كل مكونات النجمة (راجع الدرس السابق) بتحديدها جميعا ثم النقر بزر الفأرة الأيمن ثم اختيار grouping as shap

8. فائدة التجميع هو عمل مؤثر للنجمة ككل، وليس لجزء منها.

9. عند مسطرة الزمن قم بعمل التأثير التالي (وتأكد أن زرpreview frame  إلى الداخل):
Fade in ثم قم بعمل دوران للنجمة مقداره 180 درجة من modify
ثم Fade out وأيضا قم بعمل دوران للنجمة مقداره 180 درجة.
قم بمشاهدة عملك بالضغط على play scene.

سيكون تقريبا هكذا..


أرجو أن يكون قد أعجبكم.

لننتقل الآن إلى تطبيق آخر.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 28, 2004, 04:28:43 صباحاً
صمم زرا

هناك عدة طرق لعمل زر، سأخبركم بالطريقة الأسهل:
1. ارسم شكلا أو اكتب نصا.
2. اضغط بزر الفأرة الأيمن ثم اختر convert to button.
3. على قائمة Outline سيظهر لك التالي:



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

ملاحظة أخرى على الهامش: علامة الناقص (الطرح) في الصورة يعني وجود مجموعة مفتوحة، وعند الضغط على الناقص تتحول إلى زائد وتغلق المجموعة.


4. الزر، أي زر يتكون من ثلاث أمور، وهي كما في الصورة:
Up state أي شكل الزر والفأرة بعيدة عن الشكل.
Over state أي شكل الزر والفأرة على الشكل (بدون الضغط على الشكل).
Down state أي شكل الزر بعد أن تضغط بزر الفأرة على الشكل.
(لا تهتم بالحالة الرابعة، وانتقل إلى الخطوة التالية)

5. لتغيير كل حالة من الحالات الثالثة حدد على الشكل من قائمة outline ثم انتقل إلى قائمة shape التي ستظهر على يمين الشاشة، وغير الألوان كما تريد، من الممكن أيضا تغيير حجم الشكل (ويمكن الاستعانة بقائمة transform لمزيد من الدقة في هذا الشأن " أجمل شيء في التصميم الدقة" )، من الممكن أيضا حذف الشكل في إحدى حالاته (مثلا إذا كنت لا تريد للزر أن يظهر إلا عند مرور الفأرة عليه، قم بحذف الشكل عند الحالة الأولى وهي Up state). ومن الممكن أيضا عمل زر على هيئة شكل، وعند مرور الفأرة عليه يتحول إلى نص، وذلك بحذف النص في الحالة الثانية Over state وإدراج نص مكانه.

الخيارات كثيرة، وعليك بتجربتها لترى النتيجة بعينك.

ثم لمشاهدة نتيجة عملك قم بالنقر على play scene.

والآن انظر للأمثلة التالية، وحاول تطبيقها عندك:




سنكتفي بهذا القدر اليوم..

وسنتعرف لاحقا على طريقة عمل الأوامر للزر.

وإلى أن نراكم غدا بإذن الله..

تدربوا وتدربن جيدا..

وأرجو للجميع دوام التوفيق..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يونيو 29, 2004, 02:15:19 صباحاً
طبقت درس اليوم بنجاح ولكي جزيل الشكر
اما بالنسبه للرابط الي وضعه الاخ لم تظهر فيه الصور ابدا
واما بالنسبه للخط العربي فهو يظهر لكن كل حرف على حدى ولا اعرف ما المشكله بالضبط  :laugh:
واشكرك على جهدك في الشرح وجزاك الله خير
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: د- رزان في يونيو 29, 2004, 03:35:13 صباحاً
جزاك الله خيرا اخت فيزيائية
انا عندي الكراك لبرنامج swish2 و سويش ماكس ممكن انزلهم بس ما اعرف كيف
انزلهم في الموقع
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 29, 2004, 04:24:52 صباحاً
السلام عليكم..

عندي سؤال يا شروق.. هل تستعملين برنامج سويش 2 أو سويش ماكس؟؟ لأني أذكر أني واجهت نفس المشكلة مع سويش ماكس؟؟؟...

وسأحاول أن أعرف ما هي المشكلة بالضبط..


د-رزان شكرا للمساعدة، من الممكن أن تضع رابط الكراك على المنتدى..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 29, 2004, 04:30:23 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:
التأمل.. الخطوة الأولى والأهم للإبداع



...
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 29, 2004, 04:31:20 صباحاً
قائمة File



1. فتح مستند جديد.
2. فتح مستند قديم.
3. حفظ الملف، لنلاحظ أن ملف سويش يحفظ بالامتداد .swi
4. فتح نافذة جديدة للبرنامج.
5. هنا ستجد قائمة بعدد من الأمثلة السابقة الموجودة في البرنامج، تأملها (عد إلى حكمة اليوم) بالتأكيد ستفيد من أفكارها، ولعلها تساعدك كثيرا مستقبلا.
6.

أ. لحفظ الملف بامتداد .swf وهو الامتداد الذي يمكنك فيه تضمين ملف سويش داخل الفرونت بيج (وللإنترنت عامة)، وداخل البوربوينت، والفلاش. (وستحتاج أن يكون لديك في جهازك برنامج flash player لترى هذا الملف)
ب. لحفظ الملف بامتداد html لتحميله كصفحة ويب، ستستعمل هذا إن كنت تريد تصميم موقع بهذا البرنامج، وستلاحظ أنك عندما تحفظه بامتداد html سوف يقوم البرنامج تلقائيا بحفظ ملف آخر في نفس المجلد بامتداد .swf ، وعند تحميل الملفات إلى موقعك، سوف تقوم بتحميل كلا الملفين.
ج. لحفظ الملف بامتداد .avi ، حسب ملاحظاتي، ستستعمل برنامج real player لفتح الملف، وسيكون حجمه كبيرا نسبيا.

7.

إذا أردت أن ترى الناتج النهائي للعمل كفلاش، يمكنك استخدام test ثم اختر in player.
وإذا أردت أن ترى الناتج النهائي كصفحة ويب، اختر in browser.
(ملاحظة مهمة، لكلا الخيارين يجب أن يكون لديك برنامج flash player لتستطيع مشاهدة عملك النهائي)

ستستفيد من هذا الخيار الأول إذا أردت حفظ ملفك على امتداد .exe وإليك الطريقة:

لحفظ الملف بامتداد exe.

* اذهب إلىtest  ثم in player.
** عندما تفتح لك نافذة الـ flash player إذهب إلى file ثم إلى create projector...
*** احفظه في المجلد الذي تريد.




والآن سننتقل إلى خطوة في غاية الأهمية:



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 29, 2004, 04:34:16 صباحاً
قائمة action

* هذه هي القائمة الأكثر أهمية في برنامج سويش. سننتقل فيها خطوة خطوة، وتطبيق تطبيق.

** هذه القائمة تستطيع الوصول إليها من أماكن مختلفة، ولكن أهم الأماكن هي:

1. إذا كنت محددا على scene في المسطرة ستجد أن هناك قائمة Action تظهر على يسارك


2. كما ستجد القائمة على يمين الشاشة بجانب قائمة movie  و scene و transform


*** لتبدأ باستخدام هذه القائمة عليك أولا إما أن تحدد (أنظر الصورة التالية)




لعلك تفهم الكلام السابق عند التطبيق..

لننتقل إلى التطبيق الأول لهذه القائمة:

أوامر play و stop من قائمة Action

1. قم بعمل فلم متحرك بسيط، لنفرض مثلا أنه سيارة تتحرك عبر الطريق
2. تستطيع رسم السيارة من الأقلام التي بالبرنامج (وأنا أفضل ذلك) أو تقوم بإدراج سيارة، ثم أدرج خلفية شارع مثلا (أو ارسم الشارع أيضا).
3. ستأخذ السيارة وتقوم بتحريكها من اليسار إلى اليمين مثلا بواسطة التأثير move من قائمة Effect ثم حرك السيارة، أو قم بتحريكها رأسا باستعمال الأداة motion path الموجودة في قائمة layout (رقمها حسب الصورة المدرجة سابقا؛ 3).
4. قم بمشاهدة عملك عن طريق play movie أو play scene، إذا كنت متقنا في عملك ستجده يتحرك من اليسار إلى اليمين ثم يعود فيتحرك من اليسار إلى اليمين هكذا إلى ما لا نهاية.
5. سنقوم الآن بوضع زرين، أحدهما سيقوم بعمل stop لإيقاف الفلم، والآخر play لتحريك الفلم إذا كان واقفا.
6. اصنع زرين (راجع الدروس السابقة)، لنقل مثلا أننا سنصنع الزر على شكل نص، الأول stop والآخر play أو نستطيع كتابتها بالعربي (تشغيل، إيقاف).
7. لنبدأ بزر الإيقاف:
* حدد على الزر من قائمة layout.
** انتقل إلى قائمة action التي على يمين الشاشة لتحديد الحدث الذي نريد even.
*** سنختار هنا on press (أي حال الضغط بزر الفأرة).
**** سيتحول زر الـ event الآن إلى زر action.
***** اختر stop.

# الذي فعلته الآن، أنك وضعت له الأمر التالي: ""حينما يُضغط بزر الفأرة على هذا النص، أوقف الفلم""

8. قم بعمل الخطوات السابقة لزر التشغيل، ولكن اجعل الخطوة الأخيرة هي اختيار paly.

العمل النهائي سيكون كالتالي:
(عذرا أني صنعته على عجل)




اختبر زري التشغيل والإيقاف بنفسك.



## هناك فكرة أخرى لنفس العمل السابق.

إذا أردت أن لا يعيد الفلم نفسه كلما انتهى، اختر الفريم الذي تريد للفلم أن يتوقف عندها (سيكون غالبا الفريم الذي ينتهي عنده الـ effect الخاص بالسيارة) بالتحديد على الفريم. ثم إذهب إلى قائمة action التي بجوار المسطرة، واختر stop.




إلى هنا نصل إلى نهاية درس اليوم.




الواجب:
قم بنفس العمل السابق، ولكن بجعل سيارتين تظهران معا، على أن تسبق واحدة منهما الأخرى بمسافة بسيطة.





أراكم غدا بإذن الله..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: فراشة في يونيو 29, 2004, 12:23:23 مساءاً
جزاك الله خيرا اختي الفيزيائئية
ساحاول تنزيل البرنامج وتطبيق الدروس لاحقا
شكرا :)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يونيو 29, 2004, 03:33:54 مساءاً
البرنامج هو سوتش 2
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 30, 2004, 02:51:41 صباحاً
أهلين أستاذتي وفراشة المنتدى..
ازدان موضوعي بمشاركتك فيه..


أختي شورق.. ما زال البحث جاريا!! ولكن هل من الممكن أن يكون السبب من الويندوز مثلا؟.. ما هي الإصدارة المستعملة؟
وعلى كل حال، بإذن الله يكون هناك حل!!
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 30, 2004, 02:57:15 صباحاً
بسم الله الرحمن الرحيم


حكمة اليوم: الآراء كالمسامير، كلما طرقها المرء أكثر ازدادت عمقاً.
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 30, 2004, 02:58:34 صباحاً
goto frame من قائمة Action

لننتقل إلى أمر جديد من قائمة Action.

سيفيدك هذا الأمر إذا كنت تريد الانتقال من فريم إلى فريم خلال المسطرة، أو كنت تريد الانتقال من مشهد إلى مشهد آخر في نفس الفلم.

إذا عليك أولا أن تحدد الحدث event سواء على مسطرة المشهد scene فتختار الفريم، أو على شكل أو نص معين فتختار الـ event من القائمة التي ستجدها على يمين الشاشة عند Action.

بعد ذلك اختر الأمر goto frame من قائمة Action ( تتحول قائمة event إلى قائمة action تلقائيا بمجرد أن تختار الحدث event).

ستظهر لديك القائمة التالية على يمين الشاشة، تأملها الآن..



في الصورة اخترنا الحدث بتحدد الفريم من مسطرة المشهد..

والآن تتبع أرقام الصورة:

1. هنا سيخبرك عن الفريم الذي سينتقل إليه والمشهد. وهو في الصورة: عند الفريم 0، سينتقل الفلم إلى الفريم رقم 5 من المشهد الثاني.
لتحديد الفريم والمشهد، انتقل إلى الخطوة التالية:
2. هنا حدد الفريم الذي تريد، إما بتحدد رقم الفريم (number) أو تختار الانتقال إلى الفريم التالي أينما كان (next) أو الانتقال إلى الفريم السابق أينما كان أيضا (prev.)
3. من هنا ستحدد المشهد، إما أن تختار رقم أو اسم المشهد، أو المشهد التالي، أو المشهد السابق (انتقل عبر القائمة وستفهم المقصود).

* الآن أي تغيير في الفريم أو المشهد سيبدو لك عند (الرقم 1).



لننتقل إلى التطبيق التالي:

عرض شرائح متتابعة:

كالتالي:




طريقة العمل:
1. قم بإدراج مجموعة من الصور
2. قم بإدراج نصين (التالي والسابق)، (ملاحظة مهمة: من الممكن تحويل هذه النصين إلى زرين ثم إضافة الـ action، ومن الممكن إضافة الـ action بدون تحويل النصين إلى زر – جرب الحالتين لترى بنفسك - )
3. للزر (التالي) أضف الحدث (event): On press
4. اختر الأمر goto frame من قائمة action
5. حدد الـفريم التالي (next)
6. قم بعمل الخطوات السابقة نفسها للزر (السابق) ولكن بتحديد الفريم السابق (pre.)
7. بالنسبة للصور قم بعمل التأثيرات على المسطرة Timeline كما في الصورة التالية:



شرح الصورة:
* في الفريمات الأربع الأولى (من 0-3) من مسطرة المشهد وضعنا الأمر stop من قائمة action.
** لكل صورة وضعنا التأثير place من قائمة effect ثم في الفريم التالي وضعنا التأثير remove من قائمة effect.

8. قم باستعراض الفلمplay movie ، وشاهد النتيجة.



السؤال: لو جعلنا الصور في كل مشهد منفصل بدلا من أن يكونوا في مشهد واحد، أي سيكون لديك مشاهد على عدد الصور. كيف سيتغير الـ action الآن؟!



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يونيو 30, 2004, 03:01:31 صباحاً
إضافة الصوت:

من قائمة action سنضيف الصوت بالأمر play sound، وهناك الأمر stop sound لإيقاف الصوت، وهناك stop all sound إذا كان هناك أكثر من صوت وتريد أن توقفهم جميعا.

لتحميل أي صوت لبرنامج سويش، يجب أن يكون يحمل إحدى الامتدادان .wav أو .mp3 وأما .rm أو .ram فلا يمكن استعماله هنا. وهناك عدد من برامج التي تحول امتدادات الصوت مثل stream box وهو سهل الاستخدام جدا.

عندما تختار الأمر play sound ستظهر لك القائمة التالي على يمين الشاشة:



1. من هنا سيظهر لك اسم الصوت الذي اخترته
2. من هنا أدرج الصوت الذي تريد للبرنامج
3. من هنا يمكنك تحديد بعض الخصائص للصوت، لنتأمل الصورة التالية:



1. سيخبرك هنا عن طول الصوت بالثانية وبالفريم، وستفيدك هذه المعلومات عند إنشاء بطاقة بصوت مثلا.
2. هنا حدد عدد مرات التي تريد أن يتكرر فيها الصوت، إذا أردت أن يعيد تكرار نفسه بلا توقف، حدد رقما كبيرا (1000 مثلا).
3. هنا بعض التأثيرات للصوت، مثلا fade in إذا أردت أن يبدأ الصوت تدريجيا، و fade out إذا أردت أن ينتهي الصوت تدريجيا.....
4. يمكن من هنا تجربة الصوت.




------

إلى هنا ننتهي اليوم.. يبقى التدريب، وغدا سنبدأ بإذن الله بعمل تطبيق على الصوت، وسيكون عبارة عن ""بطاقة إهداء""..

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


والسلام



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 01, 2004, 01:50:01 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:

قال رسول الله صلى الله عليه وسلم: " لن يشبع مؤمن من خير يسمعه حتى يكون منتهاه الجنة " - رواه الترمذي
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 01, 2004, 01:50:44 صباحاً
تطبيق عمل بطاقة صغيرة بالصوت:



1. أدرج خلفية.
2. ضع الصوت في أول فريم من المشهد باختيار الأمر play sound، ثم من export التي ستظهر على اليمين (راجع الصور السابقة) اختر الصوت.
3. صمم البطاقة بالشكل الذي تريد. في البطاقة السابقة كتبت كلمات البطاقة، وجعلت لها ظلا بأن نسخت النص مرة ثانية وغيرت لونه وأرسلته خلف النص الأول (بتحريكها للأسفل من قائمة outline، بالفأرة أو بالأسهم).
4. من الممكن إدراج زر وأختر له الحدث on press ثم من قائمة action اختر stop sound، ثم اختر الصوت الذي تريد أن يتوقف (فقد يكون عندك أكثر من صوت في العمل أو الفلم الواحد)، وإذا كنت قد استخدمته في نفس الفلم، فستجده في أسفل قائمة export بدون الحاجة لاختيار الملف من جديد.
5. عندما ينتهي الصوت (تستطيع معرفة الفريم الذي ينتهي فيه من (properties) للصوت) ضع زر (إعادة) واختر له الحدث on press ثم الأمر gotoframe 0.
6. هكذا انتهينا من البطاقة، وتبقى صفحة التحميل (laoding):


صفحة التحميل laoding:

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

الطريقة سهلة وتتلخص في:

(1) بعد أن يكتمل العمل، نضيف مشهدا Scene ونرفعها إلى أعلى (من عند outline بواسطة الأسهم) لتكون أول ما يظهر للمستخدم، ونسمها Preloader.
(2) في أول فريم frame 0 of time line، نختار If frame loaded من عند Add Action.
(3) في القائمة على اليمين (في الأسفل) نختار المشهد الأول من العمل وغالبا سيكون اسمه scene 1.
(4) نعود لـ add action ونختار goto frame 0 of scene 1.
(5) نكتب كلمة تدل على التحميل، مثلا (انتظر التحميل، please waite، loading...) ونضيف لها ما نشاء من المؤثرات effects.
(5) في آخر فريم ينتهي عنده مشهد Preloader سنضع الأمر Goto frame 0 of preloader. وفي الفريم الذي يليه سنضع الأمر Preloader content.

الناتج النهائي سيشبه العمل التالي:



وعند المسطرة سيكون يشبه التالي:




سنكتفي بهذا القدر اليوم.



الواجب:

قم أو قومي بعمل يشبه التالي (مع صوت الأزرار) إن استطعت إتقانه، سيكون هذا معناه تقدما كبيراً.. تهانينا



لاحظ ولاحظي حدود العمل، وكيف تظهر الكلمات عند النقر على أحد الزرين، كما لاحظوا أيضا كيف يظهر الصوت عند الضغط على أي زر.. حاولوا أن تنفذوا شيئا قريبا من هذا.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: Prof_Saaikq في يوليو 01, 2004, 06:52:06 مساءاً
مشكورة يا الأخت الفيزيائية على الشرح و الله يعطيك العافية
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 02, 2004, 02:37:51 صباحاً
العفو أخ Prof_Saaikq

أرجو أن يكون فيها الفائدة للجميع..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 02, 2004, 02:38:20 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:

قال المتنبي:
ولم أر في عيوب الناس عيباً            كنقص القادرين على التمامِ
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 02, 2004, 02:39:45 صباحاً
اليوم درسنا سيكون قصيراً، وأعتقد أنه سيكون رائعاً لهواة الرسم خاصة، وسيجدون فيه الكثير والكثير من المتعة

سنترك اليوم قائمة Action (ونعود لها فيما بعد) ولنرجع إلى قائمة layout لنتعلم كيف يمكن رسم صورة ببرنامج سويش:

قلم الرسم  :Bezier

تأملوا معي صورة التفاحة هذه مثلا:



أخترت لكم صورة سهلة.

الآن لندرجها في برنامج سويش من إدراج صورة

لنمسك بالقلم Bezier (بالنقر عليه من القائمة)

والآن نبدأ من حافة التفاحة ونبدأ بالفأرة ننقر عليه نقرة واحدة فقط، ثم نأتي على مسافة قريبة وننقر نقرة واحدة بالفأرة.. وهكذا حتى نكمل على باقي حدود التفاحة وتصبح الحواف كلها عبارة عن دوائر

هذا الشكل قبل إن تتم إغلاق الدوائر (الخطوة قبل الأخيرة)



وهذا الشكل بعد أن تتم إغلاق جميع الدوائر (الخطوة الأخيرة)



والآن لتعديل الرسمة نستخدم الأداة reshap

بمجرد النقر على هذه الأداة من القائمة سيظهر لي الشكل الذي رسمته آنفا وكأنه عبارة عن مجموعة من المربعات، مثل هذه الصورة:



نعود فنقول أن كل المربعات تعبر عن زوايا حادة، وأن الدوائر تعبر عن زوايا منحنية، طبعا أنتم الآن لا تشاهدون أي دوائر.
لنذهب إلى زاوية من زوايا الرسم الذي لا يحتوي على أي مربع، وننقر بزر الفأرة الأيمن ونختار Quadratic

كالصورة:



ستظهر الآن دائرة في المنتصف المسافة بين مربعين، نستطيع أن نحركها كما نريد بالفأرة
وهكذا نستمر بعمل الدوائر حتى تصبح الصورة كلها عبارة عن مربعات ودوائر. كالصورة التالية:



نحن في طريقنا إلى الاحتراف في الرسم..

وقد قمت بتغيير ألوان الرسم من القائمة التي تظهر لي على يمين الشاشة (fill) نختار مثلا radial gradiant ونختار الألوان التي نشاء، ونتحكم باتجاه تدرج الألوان من أداة Fill transform من قائمة layout.


نقوم بتكرار العمل مع باقي أجزاء الصورة..
تأملوا الصورة التالية:



وأخيرا نجمع الصورة grouping as group.

ستقولون وما فائدة رسم صورة يمكن إدراجها رأسا من جهاز الحاسب!!
الجواب في نقطتين:
النقطة الأولى: أن حجم الصورة المرسومة بالبرنامج أصغر بكثير من حجم الصورة المدرجة، كما أنها تكون أكثر وضوحا وجمالا (في نظري).
النقطة الثانية: أن رسم الصورة سيساعدني على عمل (حركة) animation للرسمة، شاهدوا كيف قمت بعمل صورة متحركة للتفاحة السابق رسمها:



قمت بنسخ الصورة أكثر من مرة، وفي كل مرة كنت أعدل عليها قليلا، فالصورة المتحركة السابقة عبارة عن أربع صور، ثم وضعتها وراء بعضها، وأثرت عليها من قائمة effect وكنت أختار place ثم remove لكل صورة، على أن يكون place للصورة الثانية فوق remove للصورة السابقة الأولى، وكان البعد بين كل تأثير وآخر حوالي ثانية.


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

أرجو أن يكون درس اليوم مفيداً وسهلا، ولعله يكون كذلك بالتمرين.

والواجب هو القيام بعمل التفاحة المتحركة كالتي ترونها فوق، وتذكروا أن الإتقان مهم جدا هنا، وتذكروا أيضا حكمة اليوم (ولم أر في عيوب الناس عيبا          كنقص القادرين على التمام).


أراكم غدا بإذن الله.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: أبو عبد العزيز في يوليو 02, 2004, 08:17:17 صباحاً
بارك الله فيك وجزاك خيرا أختي الفاضلة الفيزيائية على هذا المجهود

الرائع والشرح السهل والمفصل والذي أسأل الله أن يجعله في ميزان أعمالك .



ودمتم سالمين. :)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: ابو سلمان في يوليو 02, 2004, 02:05:51 مساءاً
السلام عليكم ورحمة الله وبركاته

جزاك الله كل خير اختنا الفيزيائية على ما تقدميه لنا

لدي طلب بسيط أرجو أن تتكرمي أو احد من طلابك أو طالباتك الكرام بالقيام به

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

أحببت أن اطرح هذا الامر حتى افتح الباب للجميع في المشاركة والمساهمة لانجاح المشروع

إذا كان ذلك ممكناً وبدون حرج :)

اخوكم / ابو سلمان



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 03, 2004, 04:11:07 صباحاً
السلام عليكم..

شكرا أستاذ أبو عبد العزيز.. وجزاك الله خيرا..

أستاذ أبو سلمان..

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

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

ونشكر لكم جهودكم الطيبة..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 03, 2004, 04:12:07 صباحاً
نبدأ..

بسم الله الرحمن الرحيم

حكمة اليوم:

إذا لم يكن في حوزتك غير مطرقة، فستتعامل مع أي شيء على أنه مسمار
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 03, 2004, 04:13:16 صباحاً
قبل أن نعود إلى قائمة Action، نريد أن نتعرف على خاصية جدا مهمة في برنامج سويش، وهي كيفية عمل sprite.

SPRITE:
 

أستطيع أن أعرف sprite بأنها إنشاء فلم داخل الفلم الأصلي. لاحظنا في الدروس السابقة أن جميع الأشكال والصور والنصوص الموجودة تكون مرتبطة بعضها مع بعض. لنضرب مثلا أنك تريد إنشاء خلفية متحركة بشكل دوري (بدون توقف) وتريد أن تنشأ فلم أمام هذه الخلفية، بالتأكيد لن يكون عملياً أن تقوم بتكرار التأثير، وإنما يكون الحل باستخدام sprite. ستفهم المقصد بإذن الله من خلال التطبيق.

خلفية متحركة:

(1) سأدرج صورتين في العمل، الواحدة عبارة عن جبال، والأخرى خلفية لسماء زرقاء.
(2) الخلفية سوف أقوم بعمل نسخة أخرى منها لأطولها فأتمكن من تحريكها،
(3) لنلصقها بجانب بعضهما كما في الصورة:


(4) لإزالة الخط الفاصل بينهما، سوف نقلب إحدى الصورتين من modify ثم transform ثم flip horizontal، ولتصبح الصورة:


(5) نريد تجميع الصورتين grouping as shap
(6) نقوم بعمل تأثير الحركة من اليمين إلى اليسار من قائمة effect ثم move وحرك الصورة المجمعة التي أمامك.
(7) ولأننا نريد تحويلهما إلى sprite، سنقوم بالنقر على الزر الأيمن للفأرة واختيار convert to sprite
(7) ستلاحظ أن هناك نافذة أخرى يمكن أن تفتحها من علامة (+) بجانب sprite عند قائمة outline.
(8) هذه النافذة الجديدة أو sprite تحتوي على مسطرة مختلفة كلية أو مستقلة عن مسطرة المشهد الخارجية، وستجد بالتأكيد التأثير الذي قمت به، ولكنه الآن منفصل عن أي شيء خارج الـ sprite
(9) لإغلاق الـ sprite والعودة إلى الصفحة الأولى، انقر على علامة (-) التي بجانب الـ sprite عند قائمة outline، وستتحول إلى (+) دليلا على أنك الآن خارج الـ sprite.
(10) الخطوة الأخيرة، هي أن أعطي الأمر loop للـ sprite. وستجده على القائمة التي ستظهر على يمين الشاشة (بجانب خصائص الفلم والمشهد..) مادمت محددا على الـ sprite.
تأمل الصورة التالية: (عن السهم الأحمر)


العمل انتهي الآن، سيكون يشبه التالي:


بالطبع يمكنك تبطيء الحركة بزيادة عدد الفريمات للتأثير move.



ما كان سابقا هي فكرة مبسطة، وهناك أفكار أكثر تعقيدا، بل بواسطة الـ sprite نستطيع أن نصنع بعض الألعاب الخفيفة، وأفكار أكثر متعة.. ولكن انتظروا للدروس القادمة بإذن الله.

من الأفكار المشابهة لما سبق:
* تصميم حوض ماء، وأسماك تتحرك بشكل دوري، وحينها ستضع كل سمكة في sprite منفصل.
* تساقط مطر، أو أزهار من أعلى الصفحة إلى أسفل.
* نقاط تتقاطر من كلمة مكتوبة


الواجب:
القيام بعمل يشبه التالي:


تهمني الخلفية أكثر من الكلام نفسه.. هل تستطيع أو تستطيعين معرفة فكرتها، وكيف تدور هكذا!!


غدا سنكمل الـ sprite بإذن الله، وسنتعلم كيف يمكن صنع الأقنعة mask، مع عدد من التطبيقات الغاية في الجمال والابتكار.


السلام عليكم



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 03, 2004, 02:31:53 مساءاً
السلام عليكم ورحمة الله وبركاته
اختي كل ما زادت المعلومات تهت اكثر مع ان شرحك مبسط ولكن مثلا في طريقة وضع كثر من صوره عند تطبيقها يغلق البرنامج نفسه بعد اظهار خطأ في البرنامج
كذلك قلتي لمعرفة وقت انتهاء الصوت يكون من قائمة في اليمين export
ولم تظهر القائمه كذلك ؟!
وفي صفحة التحميل بعد كل ما تم يظهر فقط صفحة التحميل عند استعراض المشهد ولا يظهر المشهد التالي الأصلي ؟
اما بالنسبه لرسم التفاحة فحدث ولا حرج  :(  كيف يظهر التدرج بادقه الموجوده في رسمك ما شاء الله دقيق جدا
عارفه اني تعبتك لكن لكي الاجر عند الله  :D
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 03, 2004, 02:34:26 مساءاً
نسيت   :O  كيف نربط ظهور الرقم مع الضغط على الزر المرتبط بالصوت لاني لم استطع عمل ذلك في الواجب  :laugh:
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 03:49:05 صباحاً
وعليكم السلام ورحمة الله وبركاته

أهلا أهلا بأختي شروق..

أولا بالنسبة للصور: أستغرب حدوث الخطأ عندك، ربما يكون السبب من الصورة، أو من امتداد الصورة. هل يحدث هذا مع أي صورة تختارينها؟؟ هل جربت صور أخرى؟؟
ومع هذا سأفصل هنا عملية إدارج صورة، لعل هذا يساعدك على اكتشاف المشكلة


إدارج صورة:

(1) سنذهب إلى الشريط الذي في الأعلى ونضغط على إدراج صورة Insert Image



طبعا ستفتح لنا قائمة، ومنها ندرج الصورة المختارة والتي ستكون إما بامتداد .jpg أو .gif أو .bmp

(2) وستظهر لي الصورة بهذا الشكل عند قائمة outline التي هي على يسار الشاشة:



(3) أكرر العملية لإدراج أكثر من صورة، وستظهر لي كلها على القائمة outline (في الصورة السابقة مدرجة فيها صورتين)



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 03:50:53 صباحاً
بالنسبة لمعرفة زمن الصوت:

بعد أن تختاري الأمر play sound من قائمة action، ستظهر لك ما يشبه الصورة التالية:



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







** بالنسبة لمشكلة صفحة التحميل، في الحقيقة يصعب علي تخمين المشكلة، قد يكون هناك أمر stop مثلا عند أول فريم من المشهد الأصلي.. أو قد يكون هناك سبب آخر، إن أحببت أن ترسلي لي الملف (ملف السويش الأصلى الذي بامتداد .swi) على بريدي الإلكتروني لعلي أعرف السبب؟؟



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 03:51:22 صباحاً
نأتي لرسم التفاحة:

لا تيأسي إن لم تكن الرسمة بذات الدقة المطلوبة، مع التمرين سوف يتحسن الأمر كثيرا، تأكدي من هذا.

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

تدرج الألوان في رسم التفاحة:

(1) بعد أن نتم الرسم ونقوم بتعديل النقاط بواسطة reshap (والتي ستكون عبارة عن دوائر ومربعات) سننتقل إلى خصائص الألوان من عند القائمة shap على يمين الشاشة (لنتأمل الصورة التالية):



(2) سنختار عند Fill التدريج الدائري Radial gradient، واختاري الألوان كالتالي:




(3) لننتقل الآن إلى قائمة layout والأداة fill transform


بمجرد أن نضغط على الأداة سيظهر حول الرسم مستطيل بزوايا ذات مربعات زرقاء صغيرة كالصورة:



نحرك هذا المستطيل إلى الأعلى من جهة اليسار قليلا (كما في الصورة التالية) ولاحظوا أن الذي يتحرك هو فقط تدرج الألوان وليس الشكل نفسه:



(4) سنكرر الحركة مع باقي الشكل (الورقة، ثم الفرع البني..)

(5) انتهت الصورة، نقوم بتجميعها على هيئة grouping as group وأنا أفضل أن تجمع على هذه الهيئة من أن تجمع على هيئة grouping as shap لأننا نستطيع في الأولى أن نجري تعديلاتنا حتى بعد التجميع، أما في الثانية فلا يمكن. وعلى العموم الاختلاف بين الاثنين يظهر أكثر عند إضافة الـ effect لهما.

** أرجو أن يكون الشرح الآن أوضح، وأن يكون قد تجلى ما خفي عليك يا شروق، وأهلا دوما بأسئلتك، وأنا لا أتضايق منها أبدا.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 03:52:25 صباحاً
** لنأتي الآن على الواجب الذي ذكرته..

طريقة عمل الزر بالصوت وارتباطه بظهور صورة أو نص معين:

(1) سنصنع زراً أولا.

(2) في الواجب قمت بعمل تكبير قليل للزر عند إمرار الفأرة عليه (أي من عند over state) بأن كبرت حجم الخط بمقدار العدد 2 (يعني إذا كان الأول 18، فالثاني عملته للتكبير 20).

(3) لربط الصوت مع الزر بمجرد النقر عليه قمت بالتالي: من عند قائمة action التي على يمين الشاشة اخترت الحدث on press من قائمة event، ثم عندما تحولت قائمة event إلى قائمة action قمت باختيار الأمر play sound، وأدرجت ملف الصوت المطلوب كما فعلنا وتحدثت عنه سابقاً.
أي من المفروض أن يكون كالتالي:



(4) لأجعل الزر يقوم بإظهار صورة أو نص معين سأقوم بإدراج الصورة أو النص، وأجعل لها من عند مسطرة الزمن timeline التأثير place (أو التأثير fade in.. أو أي تأثير آخر) من قائمة effect بحيث أجعلها تظهر (أو يبدأ ظهورها) في الفريم الثاني (وليس الأول)، أقصد أن هذا التأثير سيكون في الفريم الثاني.

(5) في الفريم الأول سأضع الأمر stop للمشهد، بحيث يتوقف هنا العرض، ولا ينتقل إلى الفريم الثاني إلا بأمر آخر أضعه (تأمل الصورة التالية)



تابع الخطوة التالية.

(6) سأضع للزر أمرا يجعله يتحرك إلى الفريم الثاني عند الضغط عليه، وذلك بأن أختار goto frame 2 of scene 1 (ولا ضير أن يكون هناك أمرين للحدث الواحد  في الزر الواحد) .كما في الصورة التالية:




إذا الآن عندي زر يحتوي على أمر إصدار صوت بمجر النقر عليه، وأمر آخر وهو الانتقال إلى الفريم الثاني (وهو الفريم الذي ستظهر فيه الصورة أو النص).

(7) سأكرر العملية مع الزر الثاني، ولكن سيكون هناك اختلاف في الفريم الذي سينتقل إليه لتظهر صورة أخرى، لأني سأجعل كل صورة تظهر في فريم مختلف. (العملية نظريا متشابكة، ولكنها عمليا سهلة ومسلية جدا)

أرجو أن يكون الشرح واضحا.. والعملية سهلة وناجحة..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 04:01:16 صباحاً
والآن نبدأ درسنا

بسم الله الرحمن الرحيم

حكمة اليوم:
من علت همته، طال همه
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 04:02:31 صباحاً
* كنا تكلما بالأمس عن ميزة sprite وكيف استخدمتها في عمل loop منفصل عن الفلم.

قبل أن ننتقل إلى كيفية عمل القناع، سنذكر ملاحظة في غاية الأهمية:

إدراج صورة متحركة بامتداد .gif للبرنامج:

عند إدراج صورة متحركة بامتداد .gif للبرنامج (بطريقة الإدراج العادية لأي صورة) سوف يظهر لي النافذة التالية:



السبب أن الصورة المتحركة يُدرجها البرنامج على هيئة sprite وبعدد فريمات معينة يحكمها زمن الصورة المتحركة.

لذلك عند إدراج صورة متحركة، يجب أن أقوم بتحديد جميع الفريمات بأن أضغط على الزر select all frames من النافذة التي فتحت لك أولا، وستجد حينها أن جميع الفريمات قد حدد بالرمادي، ثم اضغط import.

* قم بإدراج صورة متحركة بامتداد .gif وتتبع الخطوات السابقة، ثم افتح الـ sprite من العلامة (+) بجانب العين في القائمة outline ولاحظ كيف أدرجت هذه الصورة، فلعل هذا يساعدك على فهم طبيعة الـ sprite أكثر.




لننتقل الآن إلى الجزء الأكثر إمتاعا في موضوعنا اليوم:

كيفية عمل القناع mask:

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

لنبدأ بفكرة مبسطة...



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 04:03:19 صباحاً
تطبيق: عمل نص بألوان متداخلة:

(1) أدرج نصاً.

(2) حوله إلى sprite (شرحنا ذلك سابقا).

(3) افتح الـ sprite من علامة (+) بجانب العين في قائمة outline

(4) أنت الآن داخل الـ sprite.

(5) ارسم مستطيلا بحيث يغطي الكلمة تماما.

(6) غير ألوان المستطيل وأجعل لها تدرجا خطيا مثلا linear gradient. وغير ألوانها كما تشاء.

(7) حدد على sprite من قائمة outline لتظهر لك القائمة الخاصة بها من جهة اليمين، هناك خيار loop وقد تكلمنا عنه بالأمس، وهناك بجانبه الخيار Mask ضع علامة صح بجانبه.




(8) أغلق الـ sprite من علامة (-)

(9) قم بعمل play scene أو play movie وشاهد النتيجة الرائعة



(10) من الممكن إدراج صورة بدلا من رسم مستطيل وتغيير ألوانه.

(11) يمكن جعل الألوان تتحرك يمينا ويسارا، انتقل إلى التطبيق التالي:



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 04, 2004, 04:04:39 صباحاً
تطبيق: عمل نص بألوان متداخلة *** متحركة***:

(1) بنفس الطريقة السابقة، ولكن عند رسم المستطيل اجعل أطول من النص. لنجعل طوله ضعف النص مثلا.

(2) اجعل أول المستطيل يغطي النص، أي لا تضع منتصف المستطيل فوق منتصف النص، لأنك ستحرك المستطيل.

(3) حرك المستطيل بجعل عليه الأمر move ثم تحريكه إلى أن ينتهي المستطيل مع أو كلمة للنص.

(4) لمزيد من الدقة، اجعل المستطيل يتحرك مجيئة وذهابا، أي أثر عليه بتأثير آخر move بجانب الـ move الأولى ولكن اعكس الحركة هذه المرة.

(4) عندما تضع علامة صح على mask ضع علامة صح أيضا على loop.

(5) أخرج من الـ sprite وشاهد النتيجة.






إذا فكرة الـ mask هي أن لديك قالبا، وغطاء للقالب، الذي سيبدو لنا هو لون الغطاء، وشكل القالب، أي لن يظهر لنا لون القالب أبدا (لم يظهر لدينا لون النص الأول الذي كتبنا به)، كما لن يظهر لنا شكل الغطاء لأنه سيأخذ شكل القالب (وهو شكل المستطيل الذي رسمناه)، بصيغة أخرى؛ كأني أصب خلطة ملونة فوق القالب

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



سنكتفي اليوم بهذا.

أجيدوا عمل التطبيقين الماضين لأن تطبيقات الغد لن تكون بهذه البساطة

الواجب:

فكروا كيف يمكن عمل النص المائي التالي بواسطة الـ mask ..



سوف نشرح فكرتها غدا.. ولكن سأعطيكم فرصة للتفكير..



أستودعكم الله



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 03:13:07 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:
كل شيء يرخص إذا كثر، إلا العلم فإنه إذا كثر غلا
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 03:19:23 صباحاً
لنكمل ما بدأناه في الأيام الماضية، وسنبدأ بالتطبيق الذي انتهينا عنده بالأمس:

تطبيق: التموج المائي

1. ندرج صورة.

2. ننسخ الصورة ونضعها في الإتجاه المعاكس لها (بالدوران بواسطة modify ثم transform ثم flip vertical.

3. نقوم بعمل نسخة أخرى للصورة المعكوسة. أصبح لدي الآن 3 صور، الصورة الأصلية، وصورتين مقلوبتين فوق بعضهما البعض.

4. أحول الصورة الثالثة إلى  sprite (وشرحت الطريقة سابقا)

5. الآن داخل الـ sprite أقوم برسم عدد من المستطيلات التي سوف تغطي الصورة، تأمل الصورة التالية:



احرص على أن تكون المستطيلات تغطي أكثر من حجم الصورة.

6. نقوم بالتحديد على جميع الصور، ثم تحويلها إلى grouping as shap (ولن يجدي أن نجمعها grouping as group).

7. نقوم بعمل التأثير alternate من قائمة effect للمستطيلات (وليس للصورة نفسها).

8. فكر معي... نحن نريد أن نجعل الصورة تأخذ شكل المستطيلات، بينما تأخذ المستطيلات شكل الصورة، هذا يعني أن علي جعل المستطيلات في أسفل الصورة، قم بتحريك المستطيلات من قائمة outline للأسفل بواسطة الفأرة أو بالأسهم (التي عند قائمة outline).

9. أغلق الـ sprite وعد للمشهد الأصلي.

10. حدد على الـ sprite، ثم من القائمة التي ستظهر على يمين ضع علامة صح على mask وأيضا على loop.

11. أخيرا، قم بتحريك الـ sprite قليلا إلى أعلى (حركها بمقدار حركة أو حركتين فقط بالأسهم التي في لوحة المفاتيح).

12. شاهد العمل play scene.





العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 03:20:42 صباحاً
تطبيق: الورود المختفية

شاهد العمل التالي، لا يغرك كونه فارغا تماما، بل مرر الفأرة (فقط تمرير) على الصفحة وشاهد ظهور الورود واختفاؤها.



الطريقة:

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

ملاحظة: إذا أردت أن تلون الوردة بأكثر من لون، حول النص إلى شكل عن طريق grouping as shape ثم تعامل معها ولونها كأنك تلون أي مربع أو دائرة.. (من قائمة shap على يمين الشاشة).

2. ضع هذا الشكل (لنقل الوردة) في إحدى زوايا مربع العمل، ثم حوله إلى sprite.

3. افتح الـ sprite.

4. أدرج أي تأثير (في العمل استعملت التأثير Blur من قائمة effect).

5. اجعل هذا التأثير يبدأ من الفريم رقم 1، وليس من الفريم 0.

6. ارسم دائرة بحجم الوردة (أو الشكل) على أن تجعل الدائرة بلا ألوان وبلا حدود، فالهدف الآن عمل زر فوق الوردة يتحكم بظهورها دون أن يكون ظاهرا أثناء العرض.



(في الصورة لم أخفي لون الدائرة والحدود حتى أوضح ما أقصده برسم دائرة بحجم الوردة، ولكن قم أنت بإخفاء الألوان)

7. للدائرة المخفية قم بعمل الـ action  التالي:



8. في مسطرة الزمن ضع الأمر stop عند الفريم الأول للمشهد، انظر الصورة التالية:



9. أغلق الـ sprite وقم بنسخ هذه الصورة عدد من المرات بحيث تغطي مربع العمل كله:



10. شاهد العمل play scene.

11. هناك أفكار كثيرة يمكن تطبيقها تشبه هذا التطبيق، تأمل هذا المثال (أمرر الفأرة):



قمت بعمل اخفاء للمربعات الصغيرة حال إمرار الفأرة عليها، وأخفيت ورائها النص (كتبت هذا النص في المشهد الأصلي وليس داخل أي sprite).






سنكتفي بهذا اليوم

أتمنى للجميع التوفيق، موعدنا غدا بإذن الله مع تطبيق أخير للـ sprite لننتقل بعدها إلى ما هو أكثر دقة وذكاء ومهارة...

الواجب:
تدرب جيدا وكثيرا، فالآتي يعتمد على حسن تدريبك..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 03:22:51 صباحاً
كنوع من التنبيه، أغلب التطبيقات التي أذكرها هنا هي تطبيقات موجودة في الإنترنت، وليس جميعها من صنع أفكاري.. وكل ما قمت به هو أني صغتها بأسلوبي الخاص... واعذروني أني لا أذكر جميع هذه المواقع أو أسماء أصحابها..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 05, 2004, 02:40:08 مساءاً
السلام عليكم ورحمة الله وبركاته
اولا اشكرك اختي على التوضيح
ثانيا اخبرك باني قد حللت مشكلة الخط عن طريق حذف البرنامج واعادة تحميله مرة ثانيه ثالثا : اخيرا سوف تشاهدين اعمال مقلده لاعمالك
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 05, 2004, 02:45:35 مساءاً
وهناك اعمال اخرى مثل
اما الاخير ففيه كثير من الملاحظات ارجوا التعليق عليها جميعا
وشكرا لك مرة ثانيه  :D
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 02:56:04 مساءاً
وعليكم السلام ورحمة الله وبركاته

ما شاء الله تبارك الله..

أولا: مبارك حل مشكلة الخط.

ثانيا: ممتاز بالنسبة للبطاقة الأولى.

ثالثا: جيد جدا.. ولكن يبدو أنك لم تضعي الدوائر الخلفية المتحركة في sprite وتجعليها تتحرك في loop حتى تكون منفصلة عن النص الذي تضعينه أمام الدوائر...

فكرة الدوائر كانت باختصار: هي عبارة عن 3 دوائر، كل دائرة تدور في اتجاه مخالف عن التي بجوارها، أحسنت في عمل التدريج الخطي للدائرة الأولى. وللقيام بعملية التدوير بشكل أكثر دقة، قومي بعمل move من قائمة effect ثم أديري الدائرة بواسطة modify ثم transform ثم rotate 180  أي ستديرينها نص تدوير، ثم قومي بعمل move أخرى بجانب الـ move الأولى، وأديريها 180 درجة أخرى، والسبب أنك إن قمت بعمل التدوير 360 رأسا فإن البرنامج يتعامل معها وكأنك لم تديرينها أبدا، وسترينها ثابتة.

والآن تأكدي عند تدوير الدائرة التالية أنك تديرينها بعكس الإتجاه، ربما يفضل أن تستخدمي أداة rotate من قائمة layout...


تبقى ملاحظة مهمة: عند عمل التدوير تأكدي أن زر perview frame  هو للداخل حتى يفعّل عملية التدوير. (أو تأكدي من وجود المؤشر الأحمر على المسطرة)


بالتوفيق دوما..
:)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 05, 2004, 03:09:18 مساءاً
أما الصور الطفولية الرائعة، فهي ممتازة، ولكن فقط أريد التأكد لأني شعرت أن عندما أضغط على آخر صورة فإنها لا تنتقل إلى الصورة التالية رأسا؟؟ هل هناك مسافة بين كل stop وآخر؟؟ أم أنك وضعتها في فريمات متتالية؟
وكان إدارج صوت الزر ممتازا..

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

تحياتي لك، أرجو أن أكون قد استطعت إيصال وجهة نظري إليك..
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 06, 2004, 12:05:59 صباحاً
السلام عليكم
كيف الحال ان شاء الله بخير
اشكرك اختي على ما قدمت من توضيح بس الدائرة كانت واحده فقط
وعندي لك سؤال كيف يتم التدوير العكسي ما ضبط معي  وها عمل اليوم
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 06, 2004, 12:13:41 صباحاً
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 06, 2004, 01:56:54 صباحاً
ما شاء الله.. بالنسبة للفلاشين، لا يوجد عندي أي تعليقات هذه المرة.. وأراهما متقنين

وكنت أقصد 3 دوائر لأن هناك دائرة في المنتصف، وهناك دائرة أكبر منها بقليل وهي تمثل الإطار، وهناك دائرة بينهما وكأنها أعطت ارتفاع للإطار.. فهل لاحظت ذلك؟؟!!

ارسمي دائرة، ثم بأداة rotate أديريها نصف دوران. ثم الدائرة الأخرى أديريها أيضا نصف دوران ولكن بإتجاه معاكس (يعني واحدة مع اتجاه الساعة، والأخرى عكس اتجاه الساعة) واجعلي الدائرة التي في المنتصف ثابتة، لا تتحرك، وإنما فقط كمنظر جمالي إن أردت. ثم ضعي الدوائر داخل sprite وضعي علامة صح على loop.

وعلى كل حال، هذا ملف سويش الأصلي بامتداد .swi حتى تشاهدي خطوات العمل من مسطرة وأكشن.. وغيره، أرجو أن يكون فيه الفائدة:

http://bb.domaindlx.com/4thinking/loop.swi

إن لم تصل الفكرة إليك واضحة بعد، أخبريني..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 06, 2004, 02:03:41 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:
الفشل في التخطيط ، يقود إلى التخطيط للفشل
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 06, 2004, 02:04:50 صباحاً
تطبيق: معرض الصور

كالتالي:



الطريقة:

1. سندرج صورتين، ثم نحول الصورة الثانية إلى sprite.

2. نفتح الـ sprite ونقوم برسم عدد من المستطيلات مختلفة السمك بجانب الصورة، على أن يكون المستطيل الأخير هو بنفس قياس الصورة الأصلية. (تأمل الصورة التالية)



3. نقوم بتجميع جميع المستطيلات (ماعدا الصورة الأصلية) على شكل grouping as shap.

4. نقوم بعمل التأثير move ونحركها تجاه اليمين مثلا، على أن تتوقف حركة المستطيلات عندما يكون المستطيل الكبير فوق الصورة تماما.

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



6. الآن أغلق الـ sprite وضع علامة صح بجانب mask. ولا داعي لأن تضع علامة صح بجانب loop لأننا لا نريد تكرير حركة الصورة، وإنما نريدها أن تتحرك مرة واحدة فقط.

7. شاهد العمل.

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





إلى هنا أرجو أن تكون فكرة الـ sprite واضحة تماما... الآن سنعود لقائمة action ونتعرف على الأمر tell target والذي يعتمد عمله على الـ sprites... فارعوا انتباهكم..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 06, 2004, 02:05:22 صباحاً
من قائمة Action الأمر Tell target

هذا الأمر سيكون همزة وصل بين الـ sprites المختلفة التي تكون في المشهد الواحد. تخيل أنك صنعت أكثر من sprite وتريد أن تصدر أمراً وأنت داخل sprite ليقوم بأعمال تتعلق بـ sprite أخرى، قد تريد مثلا أن تجعل الـ sprite الآخر ينتقل إلى فريم آخر goto frame، أو يقوم بتوقف stop أو عمل play كيف يمكنك فعل هذا وأنت داخل sprite  آخر...

الجواب هو بالأمر tell target.

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

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


لعبة الأقلام



الطريقة:

(1) سنبدأ بوضع العداد الذي سوف يظهر على طرف العمل والذي سيزداد كلما قام المستخدم (أو اللاعب) بالضغط على القلم وهو يسقط.

(2) نكتب الأرقام من 1-5 فوق بعضها، ثم نجمعها Grouping as sprite ، ومن الأفضل تسمية الـ Sprite ولنقل مثلا units ويفضل أن يكون بالإنجليزية وليس بالعربية.

(3) عند مسطرة الزمن، سنجعل التأثيرات كما التالي في الصورة:



(4) والآن نخرج من الـ Sprite بالضغط على (-) الذي بجانب  units.

(5) نرسم شكلاً، ولنفرض أنها قلم (أو علب هدايا، أو وردة..)

(6) نضعها في أعلى الصفحة، ونأثر عليها بـ Move ثم نحركها نزولاً.
ملاحظة مهمة: (تأكد طوال عملك أن السهم Preview frame
 هو للداخل، (أي في حال التفعيل)).

(7) نحول القلم إلى Sprite، ونفتحها بالضغط على +.

(8) ونحول القلم إلى زر بواسطة convert to button.

(9) نضع الأوامر التالية للمستطيل الشفاف:



عندما نختار الأمر tell target سوف تظهر لنا قائمة في الأسفل للخيارات، وسوف نجد كل خيار عبارة عن اسم Sprite موجود في المشهد، أما الخيار والذي يحمل (\) بدون اسم، فهذا معناه أني أريد إدراج أمر للمشهد الأصلي، وليس لـ sprite أخرى.


(10) نخرج من الـ Sprite، ونضع علامة صح على Loop.  ثم نقوم بنسخ الـ sprite عدداً من المرات، ونضعها بجانب بعضها البعض.

(11) إذا أردت أن لا يكون نزول الهدايا معاً، حدد Place مختلفة على مسطرة الزمن، وتأكد من وضع stop في
آخر فريم حتى لا يعيد الفلم نفسه.




(12) انتهى العمل الآن. جربه من Play scene.

** هذه فكرة جدا بسيطة لدور الأمر tell target. والذي يستطيع الوصول إلى درجة الإتقان في ذلك سوف يجد الكثير من المتعة في ذلك.

** من الممكن مثلا عمل ساعة بنفس الفكرة..

تأمل مثلا:



سأتركها لكم لتفكروا فيها كتمرين على tell target.




غدا بإذن الله سنتطرق إلى الأوامر الأخرى في قائمة action ...
* كيف يمكن عمل full screen
* كيف يمكن إدراج وصلة موقع أو بريد إلكتروني..

وغير ذلك..

كونوا معنا..



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 07, 2004, 05:28:36 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:

يقول السباعي رحمه الله:
لا ينمو العقل إلا بثلاث، إدامة التفكير، ومطالعة كتب المفكرين، واليقظة لتجارب الحياة
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 07, 2004, 05:30:52 صباحاً
الأوامر المتعلقة بصفحات الويب

تستطيع بواسطة برنامج سويش أن تصمم موقعا كاملا، لنستعرض الأوامر التي ستساعدنا في ذلك، وكل هذه الأوامر ستجدها في قائمة Action:


وضع رابط لصفحة ويب Goto URL

عندما تقوم بصنع زر وتريد أن تربطه بموقع ما، بحيث ينقل المستخدم إلى الموقع بمجرد النقر عليه، استعمل الأمر Goto URL من قائمة Action. (إن لم يظهر لك الأمر رأسا، قم بالنزول إلى أسفل القائمة بواسطة السهم الذي في الأسفل لتظهر أمامك باقي الأوامر).

وهذه الصورة للتوضيح:



في المستطيل الذي يظ



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 07, 2004, 05:31:54 صباحاً
أوامر FS command



** Fs command تحمل عدة أوامر لنتطرق إلى بعضها:

أمر Quit

هذا الأمر للخروج، عليك أن تختار الأمر، ثم عند المستطيل Argument اكتب (true).

أمر Full Screen

هذا الأمر لفتح العمل أو العرض على كل شاشة الكمبيوتر.
ثم اكتب عن Argument كلمة ( true)

إما إذا أردت أن يحدث العكس، فاكتب كلمة (false)

** هذين الأمرين لن تحتاجهم على صفحات الويب، هم خاصين بالعرض كامتداد .swf أو .exe



أمر Show menu

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



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 07, 2004, 05:32:24 صباحاً
** لننتقل الآن إلى أمر آخر في قائمة action...

أمر JavaScript

هذا الأمر لن يعمل معك إلا على صفحات الويب، أي يجب أن يكون العمل معروضا على هيئة Html.

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


لتظهر رسالة ترحيب

* اختر الأمر JavaScript.

** في المستطيل الأبيض (تحت كلمة JavaScript) اكتب ما يلي:

Alert("Hello Word");

*** شاهد النتيجة، ولكن استعرض العمل على هيئة Html وإلا لن يظهر لك.





العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 07, 2004, 05:34:32 صباحاً
أمر Mailto

عند اختار هذا الأمر من قائمة Action، سوف تظهر لك قائمة كالصورة التالية:



كل ما عليك، هو أن تضع عند To بريدك الإلكتروني (أو البريد الذي تريد)
وعند CC و BC بريد آخر إن أردت
وعند Subject ضع عنوان للرسالة
ويمكنك ترك المستطيل الأخير فارغا، أو تكتب به ما تشاء

** هذه المعلومات سوف تظهر عندما يضغط المستخدم على زر ما (مثلا) سوف تظهر في برنامج الـ outlook  الذي سيفتح بمجرد الضغط على الزر.

** وهذا الأمر أيضا لن يعمل إلا على صفحات الويب، امتداد Html.



سنكتفي بهذا..

غدا سيكون آخر أيام الدورة..

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




تدربوا جيدا..

السلام عليكم



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 08, 2004, 01:17:19 صباحاً
بسم الله الرحمن الرحيم

حكمة اليوم:

يقول السباعي رحمه الله:
لا ينمو العقل إلا بثلاث، إدامة التفكير، ومطالعة كتب المفكرين، واليقظة لتجارب الحياة
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 08, 2004, 01:18:18 صباحاً
نقل ملف سويش إلى برنامج Power Point


(1) أولا يجب تحويل ملف السويش إلى امتداد .swf ( امتداد ملف السويش الأصلي هو .swi)




(2) نفتح الملف الـ Power point الذي نريد تضمين السويش فيه، ثم ندرج شريحة جديدة.


(3) من القائمة الأساسية ← View (عرض) --- ثم --- Toolbars (أشرطة أدوات) --- ثم --- Visual basic، سوف يظهر شريط يشبه الآتي




(4) عند أيقونة Controls  نفتح قائمة التحكم، ثم نضغط عند أيقونة More controls (أشرطة تحكم إضافية)، ثم نختار Shockwave Flash Object



(5) سنلاحظ أن سهم الفأرة تحول إلى سهم على شكل +، والآن نرسم حجم المستطيل الذي نريد أن يظهر داخله عملك (ملف السويش)، مع ملاحظة إمكان تعديل الحجم لاحقاً.


(6) على المستطيل السابق نضغط على يمين الفأرة ← Propererties (خصائص)، سوف تظهر القائمة التالية:



(7) والآن نقوم بالتغييرات التالية:

Embed Movie: نغير حالتها إلى True

Loop: نغيرها إلى False ( إذا أردت أن يتكرر العرض عدد من المرات اتركها على True)

Movie: نكتب بدقة المسار الصحيح الذي يوجد فيه ملف السويش الذي نريد إدراجه (نقصد بالملف الذي على امتداد .swf بالطبع).

(8) عاين الفلم الذي أدرجته من عرض الشرائح. وغير حجم الفلم إذا شعرت بالحاجة إلى ذلك.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 08, 2004, 01:19:12 صباحاً
نقل ملف سويش إلى برنامج Front page

(1) نحول الملف إلى امتداد .swf كما شرحنا سابقا، مع ملاحظة أن يكون الملف محفوظ في نفس المجلد الموجود فيه ملف الـ Front page الذي نريد إدراج ملف سويش فيه.

(2) والآن يجب نسخ كود الملف نفسه، للصقه في صفحة الـ Front page، وذلك من قائمة File ثم  Export ثم HTML to Clipboard.

(3) افتح صفحتك في الـ Front page، ثم اذهب إلى انقسام



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

(4) تستطيع تغيير الحجم حسب المطلوب.



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: الفيزيائية في يوليو 08, 2004, 01:19:42 صباحاً
نقل ملف سويش إلى برنامج فلاش

(1) حول الملف إلى امتداد .swf

(2) افتح برنامج فلاش، ثم من عند قائمة file اختر import

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

وللأمانة العلمية، أرجو من جميع من أراد أن ينقل هذه الدروس أو شيئا منها أن يذكر المصدر.

أستودعكم الله الآن.



أختكم
الفيزيائية



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: ابو يوسف في يوليو 08, 2004, 05:30:10 صباحاً
السلام عليكم

اختي الكريمة الفيزيائية

جزاك الله كل خير

وجعل ما قدمته من دروس في ميزان حسناتك

شكرا لك
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: شروق في يوليو 08, 2004, 02:18:10 مساءاً
السلام عليكم ورحمة الله وبركاته
اختي العزيزه تتبعثر الحروف امامي فلا اجد ما اقول غير جزاك الله خير الجزاء على ما قدمت
فقد علمت ولك فضل المعلم على طالبه واديت حق الرساله فجعله الله في ميزان اعمالك يوم لا ينفع مال ولا بنون  :laugh:
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: حابب العلم في نوفمبر 27, 2004, 03:06:01 مساءاً
اريد ان اسال سؤالا برنامج السويتش لا يكتب بالعربية لدي  
فعنما اريد مثلا كتابة محمد بالعربية فانه يكتب لي   د م ح م  فماذا افعل:)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: mary في أكتوبر 25, 2005, 09:01:23 صباحاً
مشكورة على الشرح والله يعطيك العافية... :010:
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: greencity في فبراير 02, 2006, 07:10:24 مساءاً
احببت اشارككم في هذه الدورة و بهذا التصميم عن الدورة


http://www.geocities.com/ibb_medhat/swish.zip



تحياتي



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: greencity في فبراير 14, 2006, 02:02:36 صباحاً
مافي تعليق يا طلاب
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: ابو يوسف في فبراير 14, 2006, 02:13:46 صباحاً
السلام عليكم

المعذرة اخي الكريم مدحت فقد انتبهت الان فقط للتصميم

ولقد اثبتت انك مصمم بارع في الفلاش وفي السويش ايضا

زادك الله علما وبراعة

بالمناسبة

هل تجيد التصميم على برامج اخرى ايضا؟

:)
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: greencity في فبراير 15, 2006, 09:22:52 صباحاً
اجيد التصميم على السويش و الفوتوشوب و برنامج الدايركتر من ميكروميديا
و كمان الفرونت بيج



العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: زهرة الأيام في أغسطس 01, 2007, 12:35:05 صباحاً
شكراً
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: 4NET في سبتمبر 21, 2007, 02:27:33 صباحاً
مع أنني أجيد السويش لكن هذا لايمنع أن أشيد باأختي العزيزة الفيزيائية على شروحاتها المتميزة
العنوان: تعلم معنا التصميم بالسويش.. خطوة خطوة
أرسل بواسطة: TITAN في سبتمبر 21, 2007, 10:59:10 صباحاً
جزاكي الله خيرا برنامج رائع وتتعب كبير شكرا لكي وجزاكي الله خيرا  :110:  :203:  :)