مسابقة ابداع من فريق ديف ميكس

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

متابعى فريق ديف ميكس وأنشطته الاعزاء .. نقدم لكم نشاط جديد وهذه المرة بمشاركتكم انتم وهى مسابقة إبداع فى تصميم صفحات الويب باستخدام XHTML+HTML5+CSS+CSS3 مع مراعاة عدم استخدام أدوات أخرى مثل ال JavaScript ويكمن ابداعكم فى هذه المسابقة فى اختياركم للافكار المعبرة عن التصميم وسوف يتم التقييم على الافكار قبل الادوات من قبل مصممين ذات كفاءة عالية سوف يعلن عنهم لاحقا لذا ارجو التركيز فى هذه الاعمال التى سوف تقدم.

قواعد المسابقة:

للمسابقة قواعد بسيطة لو تم الالتزام بها سوف تعم الفائدة على الجميع باذن الله، وهى كالتالى:

1 – اهمها الالتزام بمواعيد تسليم التصميمات التى سوف ينوه عنها واى تأخير لن يتم قبول هذه التصميمات للاسف فهناك died-line للمسابقة لا يمكن تعديه.

2 – كان هناك قاعدة بالزام العمل فى فريق ولكن .. طلب الكثير بعدم التحتم عليها حيث ان هناك الكثير بمفردهم .. لذا فمن الممكن ان تشترك منفردا ولكن من حقك تكوين فريق لا يتعدى ال 4 افراد.

3 – ارسال الاعمال فور الانتهاء منها فى سرية تامة الى devmix2011@gmail.comحتى يتم عرضها على لجنة التحكيم دون عرضها على العامة لتقيمها قبل انتهاء ميعاد المسابقة الاصلي.. وعند الانتهاء سوف يتم عرضها مفتوحة المصدر كما فى المثال التالى:

fci_design1

Download Design

Designed By:

• IIIIIIIIIIIIIIIIIIIII
• IIIIIIIIIIIIIIIIIIIII
• IIIIIIIIIIIIIIIIIIIII
• IIIIIIIIIIIIIIIIIIIII

Evaluation From Here

يستطيع الجميع انزال التصميم بملفاته من Download Design ويقوم بعدها بوصضه التقييم فى مكان التقييم المبين فى لينك Evaluation واتنى يكون التقييم فعلا على الاعمال بعيدا عن المجاملات والصداقات وسوف تعرض كل الاعمال فى موضوع واحد ان شاء الله مفتوحة المصدر.. اما عن اعلان الفائز فسوف يكون بعد يوم من التقييمات واهداء الجوائز فى أول ايفينت للفريق ان شاء الله فى القريب العاجل ليكون تكريم امام الجميع.

---

لجنة التحكيم:

عندما فكرت فى عمل لجنة لتحكيم الاعمال المقدمة وتقييمها .. قررت اختيار احسن المصممين على الاطلاق المعروفين لدى الكثير منكم فلجنة التحكيم تتكون من 3 افراد هم:

مهندس محمود متولى – مهندس UI/UX فى شركة كلود نينرز.

مهندس تميم ابراهيم – مهندس تصميم صفحات ويب ومدير شركة TameemGroup .

مهندس مدحت داود – مطور صفحات ويب ومنظم المسابقة.

تم الاتفاق على ان التقييم لن يكون فقط على جمال التصميم او كفاءة التول بل سيتوسع التقييم الى الفكرة الابداعية التى وراء التصميم .. فكن مبدعا

---

نظام المسابقة: {المطلوب فى المسابقة}

المطلوب الاول: مطلوب عمل تصميم فى احد المواضيع التالية:

-تصميم موقع لمدينة علمية

-تصميم موقع لمكتبة

-تصميم موقع لصفحة شخصية لاي من الشخصيات (مهندس -دكتور – مدرس – بياع سندوتشات )

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

---

طريقة تسليم الأعمال:

كما نوهت من قبل سيتم ارسالها على devmix2011@gmail.com ولكن الان انوه عن ما سيتم ارساله ، مطلوب وضع كل الملفات فى ملف واحد مضغوط zip/rar وارساله وتسميته باسم المجموعة المقدمة واذا كان التصميم الاول واسم المجموعة مثلا FCI سيتم تسمية الملف fci_design1.zip وارساله على الفور وبالطبع لو كان الديزاين الثاني سيكون fci_design2.zip بهذه الطريقة يكون الموضوع اكثر تنظيما، وسوف يتم ارسال الاعمال من المتحدث باسم الفريق الذي سيسجل فريقه فقط وليس مطلوب ان كل فرد فى الفريق ان يسجل.

---

طريقة التسجيل:

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

التسجيل مفتوح من الان وحتى غدا 2 سبتمبر 2011 الساعة 12 منتصف الليل وبعدها يتم اغلاق التسجيل وتبدأ المسابقة ولمدة 4 ايام باذن الله.

نتمنى من الله ان يجعلنا سبب فى ان نساعد الناس فى العلم والتعلم .. بالتوفيق

Introduction To CSS3 [my article on devmix]

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

فى هذا المقال تقرأون

مقدمة بعض الاحصائيات عن دعم المتصفحات للسي اس اس 3 ما الجديد فى السي اس اس 3 ؟ ملاحظات لابد ان تأخد فى الاعتبار

Top

---

مقدمة الى الجحيم بهذه المتصفحات .. كلمة قالها جيفيري زيلدمان سنة 2001 ومن بعدها بدأت ثورة التطوير الحقيقي لمتصفحات الويب والسبب فى ذلك هو تحول مصممي صفحات الويب لاستخدام السي اس اس 1 فى اشياء اكثر من الالوان والخطوط واصبحت المتصفحات فقيرة لدعم الخصائص التى يرديها المصممون. فى 2006 بدأ الكلام عن دعم السي اس اس يقل حيث ان معظم المشكلات التى كانت تظهر ، تم حلها من قبل المتصفحات واصبحت المتصفحات تتطور بشكل اسرع خصوصا فايرفوكس وسفاري ، وفى نهاية الامر .. المتصفحات تتطور بتطور لغات الويب الخاصة بالديزاين مثلا السي اس اس والاتش تي ام ال. Top

---

بعض الاحصائيات عن دعم المتصفحات للسي اس س 3 لم تدعم كل المتصفحات السي اس اس 3 بشكل كامل وهناك ما يدعم بعض الخصائص ولا يدغم بعضها واليكم جدول بدعم المتصفحات لبعض الخصائص الجديدة فى سي اس اس 3 اذن لا يزال الدعم مستمر فى الاصدارات القادمة من المتصفحات Top

---

ما الجديد فى السي اس اس 3 ؟ Borders هناك الكثير والكثير جديد فى السي اس اس 3 مما سهل مهمة مصممي المواقع ومنها ميزة الحدود فتستطيع إختصار ما كنت تفعله في الإصدارة الثانية إذا كنت تريد عمل حواف دائرية لصندوق عن طريق الحدود في السي اس اس أو إستبدال الحدود بصورة من الصور كما هو موضوح بالصورة:

ففى الاصدار الثانى كنا نستخدم اربع صور مختلفة للحواف الاربعة داخل صندوق ملون عادي ولكن فى الاصار الجديد تستطيع ببساطة ان تفعل نفس الموضوع وبكفاءة اكبر عن طريق ميزة border-radius واللى تمكنك من عمل حواف دائرية بسهولة جرب لكود التالي

HTML code

</pre>
<div id="Box">
<h1>عنوان</h1>
نص مكتوب للتجربة</div>
<pre>

CSS code

#box{
text-align:right;
margin: 10px auto;
padding: 7px;
width: 238px;
height: auto;
background-color: #e6e9ed;
border: 1px solid #666666;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;
-opera-border-radius: 10px;
}

RGB Color system RGB بالتأكيد أسهل بكثير مما سبق ومن الجديد ايضا خاصية تغيير الالوان بصيغة ال انظر المثال التالى ايضا ينطبق نفس الشكل فى الانظمة الاخرى مثل (CMYK,HSL,HSLA) Fonts من الاشياء الجديدة والمفيدة جدا استخدام فونتس جديدة باستخدام ميزة جديدة اسمها @font-face وتستخدمها بالشكل التالى CSS code

@font-face {
font-family: "devmixfont";
src: url('atlandsketchesbb_reg.TTF');
}
h1 {
font-family: "devmixfont";
color: #3e87f5;
font-size:100px;
}

HTML code

</pre>
<h1>DevMix Team</h1>
<pre>
DevMix Team was founded in February 2011 and it is the best
teamwork in Mansoura Universty collected by students, we are the best

فتكون النتيجة كالتالى ملحوظة: تقدر تنزل اى فونت من هنا Shadow إضافة جديدة وجميلة تساعد على وضع ظل للنصوص والعناصر أو الصناديق الاتش تي ام ال أيضاً ، هذه الظلال يكون تكوينها عن طريق خاصية box-shadow و text-shadow ويمكن حساب قيمها بهذه الطريقة: مصدر الصورة هيا بنا نرى مثال ونتيجة له ، جرب الكود التالى HTML code

</pre>
<div id="Box">
<h1>فريق ديف ميكس</h1>
فريق تقني يقدم خدمات للمهتمين بمجال تكنولوجيا المعلومات .. رغم نشأته الحديثة فى فبراير 2011 الا انه اثبت كفاءته وكفاءة اعضاءه</div>
<pre>

CSS code

#box {
padding: 13px;
margin: 0 auto;
width: 450px;
text-align: left;
background-color: #e9ecf2;
-moz-box-shadow: 7px 7px 10px #9c9c9c;
-webkit-box-shadow: 7px 7px 10px #9c9c9c;
-o-box-shadow: 7px 7px 10px #9c9c9c;
}

وتكون النتيجة عمل ظل للصندوق كما فى الصورة التالية اما عن عمل ظل للكلام والذي يعطى تنسيقا متميز للكلام انظرالكود والنتيحجة التاليين CSS code

h1, p {
text-shadow: 3px 2px 7px #9f9f9f;
}

HTML code

</pre>
<h1>فريق ديف ميكس</h1>
<pre>فريق تقني يقدم خدمات للمهتمين بمجال تكنولوجيا المعلومات
 .. رغم نشأته الحديثة فى فبراير 2011 الا انه اثبت كفاءته وكفاءة اعضاءه

فتكون نتيجة هذا الكود كالتالى
يوجد الكثير من الخصائص الجديدة الاخرى والتى سوف يثم مناقشتها فى الدروس والمقالات القادمة باذن لله مثل

• Transitions
• opacity
• Multiple Backgrounds
• Animation
• and more …

Top

---

ملاحظات لابد ان تأخد فى الاعتبار
لم يدعم كل المنتصفحات كل الخصائص بنفس الطريقة لذلك فى كتابة السي اس اس 3 يعتبر اختلاف دعمهم للخصائص احدالعيوب والتى تكلفك كتابة الخاصية اكثر من مرة ولعلكم رأيتم اكثر من مرة فى الامثلة كتابة الخاصية ببعض الحروف قبلها انظر الصورة بكل متصفح وامامه الكلمة المختصرة المستخدمة فى السي اس اس 3 مع خصائصها

border-radius ومثال على خاصية الحدود الدائرية

-moz-border-radius:10px;
-o-border-radius:10px;
-webkit-border-radius:10px;
-khtml-border-radius:10px;
-ms-border-radius:10px;
-chrome-border-radius:10px;

وفى النهاية اتمنى ان اكون قد اوصلتك لبعض خصائص السي اس اس 3 المهمة وعرضت عليك مقدمة تجعلك تستخدم السي اس اس 3 اليوم قبل غدا وانتظروا باقى مقالاتنا فى القريب العاجل باذن الله ننتظر تعليقاتكم ومقترحاتكم .. بالتوفيق:)

كتبت فى الاصل فى مدونة فريق ديف ميكس

DevelopersMix’s Blog is Now Published

تم عمل مدونة خاصة بفريق ديف مكس لحين الانتهاء من عمل الموقع الخاص بالفريق وسوف تستمر هذه المدونة تنشر اخبار الفريق وانجازاته فيما بعد واتمنى من الجميع الا يبخل احد بالعمل من اجل القيام بالفريق لان الفريق محتاج اجتهاد كتير جدا مننا عشان نحقق كيان واحد لينا ونحقق هدفنا الاعظم فى تطوير صناعة البرمجيات وتكنولوجيا المعلومات فى مصر

ده لينك البلوج الخاصة بالفريق وتم عمل بوست باليوم الثانى للفريق اللى هو كا يوم الخميس اللى فات اتمنى التواصل دايما وادلاء كل المقتراحات

http://developersmix.wordpress.com/

وهناك ستجدون ايضا وسائل الاتصال بينا كلها وهى ايضا هنا كالتالى

Formal E-mail of the team: devmix2011@gmail.com

Google group for any inquiry: https://groups.google.com/group/devmix-team

Follow us on twitter: http://twitter.com/DevMixTeam

FaceBook group: http://www.facebook.com/DevMixTeam

بالتوفيق للجميع .. فى امان الله

 

we just get sterted – DevMix Team

السلام عليكم ورحمة الله وبركاته

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

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

بعدها كان فيه سيشن بسيطة اوى عن خدمات لسيسكو كانت قدمتها البشمهندسة مها البسيونى وكان فيه فيديو رائع فعلا ابهرني انا شخصيا

واخيرا وصلنا لسيشن بسيطة اوى كان هدفي منها اوصلكم ازاي نستخدم

Google reader in reading RSS feeds

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

اتمنى الجميع يعمل جيميل عشان نشترك جميعا فى الخدمة دي

اتمنى يكون اليوم عجبكم بجد رغم ان الشغل فيه مش كتير لكن اتمنى يكون ع الاقل معلومة واحدة استفدنا بيها وربنا يوفق الجميع

DevMix Contacts:

DevMix2011@gmail.com

DevMix Team Google Group

انتظر كل تعليقاتكم وآراءكم ومقترحاتكم

وانتظروا فى البوست القادم ان شاء الله خارطة الطريق للفترة الجاية

ايفينت الافتتاح – DevMix

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

ازيكوا واخباركم ايه ؟ يا رب تكونوا بخير جميعا .. ان شاء الله غدا الخميس 10 فبراير 2011 هو يوم افتتاح عمل فريقنا ديف-مكس اللى اعلنا عنه مسبقا .. بالنسبة للتفاصيل ان شاء الله هيكون ده فى شركة هارفيست بجوار موافى اللى فى الجلاء اللى مش عارف المكان ممكن يروح عند موافى ويسأل وان شاء الله هيوصل .. ان شاء الله هيكون فيه سيشن افتتاحي وهيكون فيه سيشن تانى تيكنيكال وهنتناقش مع بعض فى المشاريع اللى هنقوم بيها كلنا ونحاول نتقسم كمجموعات مع بعض باذن الله اما بالنسبة للمعاد ففى تمام الساعة 12 وجدول الشغل فى البوست الجاى ان شاء الله … اتمنى حضور الجميع على الاقل لان معظم الناس ماخرجتش فى الاجازة وهتكون فرصة كويسة للخروج والاستفادة فى نفس الوقت

بالتوفيق للجميع

هل موافقون على بدأ العمل فى الفريق الخميس القادم ؟

السلام عليكم ورحمة الله وبركاته

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

مستني اشوف رأيكم وارد على اسألتكم

فى امان الله