البحث في الموقع

اتبع خطوات هذا المقال لتتعلم كيفية تصميم أيقونة بطارية في برنامج إنكسكيب. من قائمة الملف File اختر خصائص المجلد Document properties ثم من النافذة المنبثقة، أزل علامة صح عند عبارة Show page border لتخفي إطار الصفحة. ارسم شكلا بيضاويا بالعرض والبعد الذي ستكون عليه البطارية من الأعلى. اجعل قيمة شفافية الشكل Opacity للمنتصف من لوحة التعبئة والحدود Fill and stroke، ثم كرّر الشكل مجددا عن طريق اختياره بالزر الأيمن ثم اختيار Duplicate واسحب النسخة المكرّرة للأسفل، بمقدار ارتفاع البطارية، مع الضغط على Ctrl أثناء السحب للمحافظة على محاذاته للنسخة الأصل. فعّل من الشريط العلوي خيار الكبس والالتقاط Enable Snapping ومنه فعّل خيار التقاط المسار Snap to Path ثم بأداة الرسم المنحني Bezier tool ارسم مضلعا منطلقا من حواف الشكلين البيضاويين الجانبيين، بحيث تنقر بالسهم عند كل موضع ستنشئ منه عقدة Node إلى أن ينتهي المضلع من حيث بدأ. أزل الحدود عن المضلع المستطيل من تبويب رسم الحدود Stroke paint، ثم أضف له تعبئة من تبويب Fill، ومن نفس التبويب قلّل شفافية الشكل للمنتصف. قم بتحديد القطع الثلاثة (الشكلين البيضاويين والمستطيل) عن طريق أداة التحديد مع الاستعانة بزر Shift ثم قم بتكرارهم. من شريط القوائم العلوية اختر من قائمة المسار Path أمر التوحيد Union، ثم أعد القطعة الموحدة لأقصى الخلف عن طريق خيار Lower selection to bottom من الشريط العلوي لأداة التحديد. بينما ما زالت القطعة الموحدة محدّدة، ضع لها حدا من تبويب رسم الحد، ثم من تبويب سمة الحد Stroke style اجعل قيمة عرض الحد 50 واجعل كلا من خيار الترابط Join وخيار الغطاء Cap مستديران. قم بتحويل الحد إلى مسار عن طريق خيار Stroke to Path من قائمة المسار، ثم من نفس القائمة قم بتجزئة الحد بخيار Break apart حتى تظهر التعبئة التي اختفت وسط المسار، ثم وحّدْهما معا بينما ما زالا محدّدين عن طريق خيار التوحيد Union. حدّد الشكل البيضاوي السفلي مع المستطيل ووحدهما معا عن طريق Union. كرّر الشكل البيضاوي العلوي ثم اختره هو والشكل الموحد توًا، ومن قائمة المسار اختر أمر الفرق Difference. حدّد القطعة الاسطوانية أسفل الشكل البيضاوي العلوي بأداة التحرير Node tool ثم اسحب مؤشر الفأرة حول العقد الثلاثة العلوية، وحرّكها قليلا للأسفل عن طريق أسهم التحكم، أو اسحبها بمؤشر الفأرة مع الضغط على Ctrl أثناء السحب للمحافظة على محاذاتها. بأسهم التحديد كرّر نفس القطعة ولوّنها باللون الأحمر، ثم كرّرها مجددا ولوّنها باللون الأخضر. اسحب القطعة المكرّرة الخضراء إلى الأعلى قليلا مع المحافظة على اتجاهها بالضغط على Ctrl ثم حدّد كلا القطعتين، ومن قائمة المسار اختر Difference. كرّر القطعة الحمراء الناتجة من الخطوة السابقة مرتين مجددا واسحبهما للأعلى مع الضغط على Ctrl أثناء السحب، ثم قم بتسوية المسافة بينها عاموديا من لوحة المحاذاة والاصطفاف Align and distribute. قم بتوحيد القطع الثلاثة من قائمة المسار عن طريق Union واختر القطع الثلاث الموحدة أولا ثم القطعة التي تقع خلفهما تاليا ومن لوحة المحاذاة والاصطفاف قم بمحاذاتها أفقيا. ارسم مستطيلا يغطي القطع الحمراء الموحدة ويترك منها طريفا يسيرا في جهة اليسار، ثم حدّد القطع الحمراء مع المستطيل واختر الأمر Difference. حدّد القطع الحمراء مع الشكل الاسطواني الذي يقع خلفها مباشرة ثم من قائمة المسار اختر Difference مجددا. قم بتكرار الشكل الاسطواني الأزرق ولوّنه بلون مخالف وليكن الأحمر واسحبه للأعلى فوق الشكل البيضاوي بقليل مع الضغط على Ctrl أثناء السحب. من أسهم التحديد اختر السهم العلوي المتوسط واسحبه للأسفل مع الضغط على Ctrl للمحافظة على أبعاد الشكل إلى أن تصل للحجم المناسب. اختر أداة التحرير Node tool ثم حدّد العقد الخمس العلوية واسحبها للأسفل مع الضغط على Ctrl. كرّر القطعة الحمراء ثم اخترها هي والشكل البيضاوي العلوي ومن قائمة المسار اختر Difference. ثم اختر القطعة الحمراء الأصل مع الشكل الأزرق المحيط بالشكل وقم بتوحيدهما. حدّد كلا القطعتين القاتمتين وسط الشكل ووحدهما معا عن طريق Union ثم قم بتحديد القطعة الموحدة مع البطارية ومن قائمة المسار اختر Difference. أزل شفافية الشكل ولوّنه باللون المناسب لتكتمل عندنا أيقونة البطارية. النتيجة النهائية: المقال مستفاد من فيديو بعنوان: Inkscape for Beginners: Vector Battery Icon Tutorial لصاحبه Nick Saporito.

أفضل طريقة للتعلق ببرنامج ما وتعلّم العمل عليه هو الانغماس في مشروع على هذا البرنامج. هذا الدرس يغطي الخطوات البسيطة لتصميم رمز أيقونة RSS مع مختلف التقنيات اليدوية التي ستساعد المبتدئين على تطوير مهاراتهم للعمل على هذا البرنامج مستقبلًا. إن برنامج أدوبي إليستريتور هو برنامج تصميم رسومات فكتور، لذلك لا يهم حجم الأيقونة التي سنصمّمها لأننا نستطيع تكبيرها وتصغيرها بدون التأثير على دقّة الرسم. على عكس فوتوشوب حيث أن جميع الخطوط والأشكال ذات هيكل هش وكذلك الألوان وذلك لأنها مصنوعة من الحسابات الرياضية النقطيّة بدلًا من الاعتماد على تصميم البيكسل الأساسي. افتح برنامج إليستريتور وأنشئ ملفًّا جديدًا. انقر مُطوّلًا على أداة المستطيل لتظهر قائمة أدوات الأشكال واختر أداة المستطيل مستدير الزوايا Rounded Rectangle. ارسم الشكل على لوح الرسم مع الضغط على مفتاح Shift وذلك لرسم مربع ويمكنك الضغط على مفاتيح الأسهم على لوحة المفاتيح لزيادة أو تخفيف استدارة الزوايا للمربع. هناك اختلاف آخر بين إليستريتور وفوتوشوب في أسفل شريط الأدوات حيث أن مربعي الألوان في فوتوشوب يدلّان على لوني المقدمة والخلفية بينما في إليستريتور المربعان يمثّلان لون العنصر والثاني لون الحدود. قم بإزالة لون الحدود ثم اضغط على مربع لون العنصر واذهب إلى لوحة التدرجات اللونية وأضف تدرجًا لونيًّا من البرتقالي الداكن إلى البرتقالي الفاتح عموديًّا عبر الشكل. حدّد الشكل المرسوم ثم اذهب إلى القائمة: Object > Path > Offset Path أدخل القيمة 1mm- في الخيارات. انقر على زاوية الشكل الجديد ودوّره بزاوية 180 درجة لتصبح جهة التدرج اللوني معكوسة. اختر أداة الدائرة وارسم دائرة في مكان ما على لوح الرسم. أزِل لون العنصر الداخلي وأبقِ على لون الحدود الأسود ثم اجعل سماكة هذه الحدود 16pt من لوحة الحدود. استخدم أداة التحديد المباشر Direct Selection Tool (السهم ذو الرأس الأبيض) وحدّد النقطتين السفلية واليسرى من الدائرة. انقر على مفتاح Delete في لوحة المفاتيح لمسح هاتين النقطتين ويبقى من الدائرة فقط ربع دائرة. انسخ هذا الربع بالاختصار CMD+C ثم ألصقه في المقدمة بالاختصار CMD+F. صغّر حجم النسخة الجديدة مع الضغط على مفتاح Shift للمحافظة على نسبة الأبعاد. عدّل حجم حدود الشكل الأصغر ليكون 16pt كما الشكل الأصلي. اضغط على الاختصار CMD+R لإظهار المسطرة ثم اسحب زوجين من الأدلّة لتحاذي أطراف أرباع الدائرة. استخدم التقاطع بين الأدلة كأساس لرسم دائرة صغيرة بحيث ننتهي من تصميم رمز RSS. حدّد ربعي الدائرة وذلك لتحويلهما من مجرد حدود إلى أشكال جامدة عبر الذهاب إلى القائمة: Object > Expand واختيار خيار الحدود Stroke فقط. حدّد أشكال الرمز الثلاثة ثم أضِف تدرّجًا لونيًّا من الرمادي إلى الأبيض عموديًّا وأضِف حدودًا لهذه الأشكال بلون رمادي وبقيمة 1pt. اضغط على الاختصار CMD-G لجمع هذه الأشكال الثلاثة في مجموعة واحدة، ثم عدّل الحجم بشكل مناسب لوضعها ضمن المربع البرتقالي. حدّد المربع البرتقالي الداخلي ثم اضغط CMD+C لنسخه وألصقه في المقدمة عبر CMD+F ثم لوّنه باللون الأبيض. ملاحظة أخرى حول الاختلاف بين فوتوشوب وإليستريتور هو أن في إليستريتور يمكن وضع عدد كبير من العناصر في طبقة واحدة مرتبة فوق بعضها البعض ويمكن التحكم بكل عنصر على حدة إذا ما أردنا بينما لا يمكن القيام بذلك في فوتوشوب. ارسم شكلًا بيضويًّا كبيرًا مسطّحًا يغطي الجزء العلوي من المربع. حدّد هذا الشكل مع المربع الأبيض الذي رسمناه للتو واختر Intersect من لوحة Pathfinder. خفّف التعتيم Opacity للشكل الجديد الناتج عن العملية السابقة إلى نحو 15% ليبدو كلمعان أعلى شكل المربع. أنهِ هذا التصميم عبر رسم دائرين صغيرتين متفاوتتين بالحجم في زاوية المربع لتبدو مثل انعكاس إضاءة. استخدم نسبة التعتيم 15% مجدّدًا للحصول على مظهر متناسب. ها قد حصلنا على رمز فكتور RSS بسيط وأنيق في عدد من الخطوات البسيطة ولكنها تغطي مجموعة مهمة من أدوات إليستريتور الهامة. ترجمة -وبتصرّف- للمقال: Beginner Illustrator Tutorial – Create a Vector RSS Icon لصاحبه: Chris Spooner.

باتباعك للخطوات التالية ستحصل على أيقونة لخريطة يمكنك استخدامها بالطريقة التي ترغب بها. خطوات رسم أيقونة خريطة نزيل إطار الصفحة عن طريق اختيار قائمة الملف File نختار خصائص المستند Document properties ثم من النافذة المنبثقة أزل العلامة عند عبارة Show page border. نكبر مساحة العمل من قائمة العرض View اختر Zoom ثم Zoom 1:1 لنتمكن للعودة لها – أي المساحة – بالضغط على رقم 1 من لوحة المفاتيح، في حال اضطررنا للتصغير أو التكبير . نرسم مستطيلا بزوايا حادة وذلك بتحريك الدائرة الوهمية في حافة المربع للأعلى في حال لم تكن كذلك، أو بالضغط على رمز الزاوية الحادة من الشريط العلوي. نكتب قياس الطول والعرض للمربع في خانتيهما في الشريط العلوي حيث يمثل الحرف w العرض وقيمته 450 ويمثل الحرف H الطول وقيمته 300 ثم نقلل شفافية الشكل Opacity من شريط التعبئة والحدود Fill and stroke من تبويب التعبئة Fill إلى المنتصف. نرسم مستطيلا رفيعا بحيث يقطع المستطيل الأول بالعرض ونقوم بتدويره بالضغط على المستطيل مرتين من أجل إظهار أسهم التدوير. نكرر المستطيل الرفيع مجددا عن طريق تحديده ثم بالزر الأيمن نختار Duplicate وندوره بحيث يشكل علامة شبيهة بحرف T المقلوب وبحيث يشكل زاوية قائمة مع المستطيل السابق. نختار كلا المستطيلين الحديثين ومن قائمة المسار Path نختار Union لتوحيدهما معا. نلون المستطيل الأصل بالأحمر مؤقتا لتمييز ما نقوم بعمله، ثم نكرره مجددا ونختاره هو والمستطيلين المتعامدين ومن قائمة المسار نختار التقاطع Intersection لإزالة الزوائد الخارجة عن إطار المستطيل. نكرر الشكل المتعامد مجددا ثم نختاره هو والمستطيل الأصل ومن قائمة المسار نختار الفرق Difference . نختار المستطيل ومن قائمة المسار نختار Break apart لتجزئته حيث أزلنا منه في الخطوة السابقة المساحة التي كانت تشغل الخطين المتعامدين. بهذا نكون قد حصلنا على الشكل الأساسي للخريطة ويبقى لنا تلوينها وطيها، نزيل الشفافية ونجعل قيمتها 100، ثم نختار القطعتين العلويتين ونلونهما باللون الأخضر ونلون القطعة السفلية باللون الأزرق، بينما نلون الخطين المتعامدين باللون الأصفر من الشريط السفلي. ملاحظة: يمكن معرفة قيم الألوان التي اخترناها في التصميم من لوحة التعبئة والحدود. نحدد جميع أجزاء الخريطة ونجمعها من اختصار التجميع Group في الشريط الأعلى، ونصغر مساحة العمل بالضغط على علامة – من لوحة المفاتيح، وفي حال رغبنا بتكبير مساحة العمل نضغط على علامة +. نكرر الشكل مرتين ونحركهما تحت الشكل الأول مع الضغط على Ctrl أثناء السحب حتى تكون محاذية لبعضها البعض. نرسم مستطيلا جديدا حاد الزوايا بعرض 150 وارتفاع 300 ونكرره ثلاث مرات، ثم نختار النسخة الأولى ثم نختار الخريطة الأولى ومن لوحة المحاذاة والاصطفاف Align and distribute نختار محاذاة الحافة اليسرى ثم نقوم بمحاذاتهما أفقيا. ملاحظة: تأكد من تحديد خيار Last selected في لوحة المحاذاة والاصطفاف ليقوم بمحاذاة الشكل المختار أولا مع آخر ما قمنا بتحديده. نختار النسخة الثانية من المستطيلات ونحاذيها مع الخريطة الثانية أفقيا وعاموديا، ثم نختار الثالث ونحاذيه مع الخريطة الثالثة مع الحافة اليمنى ثم نحاذيهما أفقيا. نختار جميع الأشكال الموجودة في الشاشة بما في ذلك الخرائط والمستطيلات ثم من الشريط العلوي نختار فك التجميع أو بالضغط على الزر الأيمن نختار UnGroup. نأتي للخريطة الأولى ونكرر المستطيل الذي فوقها مرتين، ثم نختار المستطيل مع القطعة الخضراء ومن قائمة المسار نختار Intersection، ثم نختار المستطيل الثاني مع الخطوط الصفراء ثم نكرر نفس الأمر من قائمة المسار وهكذا نفعل الشيء نفسه مع القطعة الزرقاء مع حذف القطعة الخضراء الزائدة بتحديدها ثم من لوحة المفاتيح نختار زر الحذف Delete. نكرر نفس الخطوات السابقة مع الخريطة الثانية والثالثة إلا أننا سنكرر المستطيل أربع مرات مع الخريطة الثانية لنأخذ التقاطع من كلا القطعتين الخضراوين يمين ويسار المستطيل. نجمع أجزاء كل قطعة من الخريطة ونضعها بجانب بعضها البعض ولسنا بحاجة لمحاذاتها بل يكفي أن نجعلها تقريبا في نفس المستوى. نختار الجزء الأخضر العلوي من القطعة اليمنى واليسرى دون اختيار الوسطى ثم من لوحة التعبئة والحدود من تبويب Fill نحرك الشريط عند الحرف L لجهة اليسار ليعطينا لونا أقتم. نكرر نفس الخطوات مع اللون الأصفر واللون الأزرق. نحدد أجزاء كل قطعة من الخريطة في مجموعة مع بعضها بحيث يكون عندنا ثلاث قطع للخريطة في ثلاث مجموعات. نختار القطعة اليسرى ثم نحددها مجددا لتظهر لنا أسهم الاستدارة ونسحب السهم المتوسط الأيمن قليلا للأعلى. نفعل الشيء نفسه مع القطعة المتوسطة إلا أنا سنحرك السهم للأسفل بدلا من الأعلى، ثم نختار القطعة اليمنى ونحرك السهم للأعلى بنفس مقدار القطعة اليسرى تقريبا. من الشريط العلوي نتأكد من تفعيل الكبس والالتقاط Enable snapping منه نفعل Snap cusp nodes ليتم التقاط حواف عقد الشكل، ثم نقرب القطعة اليمنى ثم القطعة اليسرى للقطعة الوسطى ونلاحظ أنها تلتقط حوافها. نكرر جميع أجزاء الخريطة ونفك تجميعها ثم من قائمة المسار نختار Union لتوحيد جميع الأجزاء ثم نلونه باللون الرمادي من الشريط السفلي ثم نعيدها للخلف للأخير من الشريط العلوي. ومن لوحة التعبئة والحدود نختار تبويب سمة الحد Stroke style ونختار عرض الحد 35 ونختار الخيارات الحادة في كل من Join و Cap. مع كون الشكل ما زال محددا نختار من قائمة المسار Stroke to Path لتحويل الحد لمسار ثم نختار Break apart ثم مع التأكد من كون جزئي الشكل ما زالا محددين نختار Union. نكرر القطعة الرمادية مجددا، ثم نرسم بأداة الرسم المنحني Bezier -مع كون الجذب والالتقاط ما زال مفعلا- في طرف القطعة مضلعا ثم نختار القطعة الرمادية المكررة مع المضلع ومن قائمة المسار نختار Intersection ونلون القطعة الناشئة بلون أقتم من شريط L في تبويب التعبئة. ثم نعيد القطعة خطوة واحدة للخلف من الشريط العلوي. نعيد تكرار نفس الخطوات مع فرق رسم المضلع في الجهة اليمنى من الشكل. نحدد جميع أجزاء الشكل ونضعها في مجموعة عن طريق الاختصار Ctrl+g لنتمكن من التصغير والتكبير للحجم المناسب. وبهذا نكون وصلنا للنتيجة النهائية المقال مستفاد من فيديو بعنوان: Inkscape Tutorial: Vector Map Icon لصاحبه Nick Saporito.

في هذا الدرس سنتعلم كيفية تصميم أيقونات خطّية بخطوط فكتور وباستخدام الأشكال الأساسية في برنامج إليستريتور لتستخدمها في واجهة الموقع أو على حاسوبك أو حتى في هاتفك المحمول. سنبدأ بتصميم أيقونة كاميرا رقمية. افتح برنامج إليستريتور ثم ابدأ ملفًّا جديدًا واستخدم أداة المستطيل Rectangle Tool لرسم مستطيل. ستلاحظ في هذا الدرس أننا لن نستخدم أبعادًا محدّدة بل سنعتمد على الرؤية الفنّية في التصميم ولكن بإمكانك التقيد بأبعاد محددة. ولاختصار الوقت قمتُ بجعل لون الحدود بلون معين وأزلت لون التعبئة. استخدم أداة التحديد Selection Tool وانقر على دائرة الزوايا ثم اسحبها لتجعل زوايا المستطيل منحنية. استخدم أداة الدائرة Circle Tool لرسم دائرة وحتى تحصل على الدائرة بشكل صحيح اضغط على مفتاحي Alt و Shift معًا أثناء رسم الدائرة حيث ستحافظ على مركزيّة الرسم وعلى أبعاد الدائرة الصحيحة. استخدم الأدلّة الذكية لتساعدك في هذا التصميم. ارسم دائرة أخرى بذات الطريقة الأولى مع البدء من مركز الدائرة القديمة واجعل الدائرة الجديدة أصغر بقليل. كرّر ذات العملية ولكن هذه المرّة ارسم دائرة بنصف حجم الدائرة السابقة. استخدم أداة الخط Line Tool لرسم خط قُطري ومع الاستعانة بالأدلّة الذكية لن يكون ذلك صعبًا. سيُمثّل هذا الشكل شكل العدسة المغلقة للكاميرا الرقمية. استخدم أداة المستطيل مستدير الزوايا Rounded Rectangle Tool لرسم فتحة الإضاءة الفورية (الفلاش) واجعل الزوايا بنصف قطر صغير وذلك عبر استخدام مفاتيح الأسهم أثناء سحب الفأرة ورسم الشكل. ارسم دائرةً صغيرةً تعادل بحجمها ارتفاع المستطيل الصغير المجاور وسنقوم بذلك بمساعدة الأدلّة الذكيّة مجددًا. ارسم مستطيلًا مستدير الزوايا في القسم العلوي الأيسر من الكاميرا بحيث يكون نصفه ضمن جسم الكاميرا والآخر خارجها. ارسم مربّعًا صغيرًا مستدير الزوايا بنفس ارتفاع المستطيل المجاور. اجعل لون تعبئة جسم الكاميرا بالأبيض ثم حدّد المستطيل والمربّع الصغير الخارجين من جسم الكاميرا وأرسلهما للخلف بالاختصار CMD+Shift+[. ارسم مستطيلًا صغيرًا في الركن الأيسر السفلي من الكاميرا. انسخ هذا المستطيل مرتين عبر Ctrl+C و Ctrl+F وضع النسختين على نفس المحور العمودي للشكل الأصلي. ارسم دائرةً صغيرةً يبلغ قطرها ارتفاع المستطيل الصغير الذي رسمناه للتو وباستخدام الأدلة الذكية ضع الدائرة بحيث يكون نصفها خارج المستطيل. انسخ الدائرة بذات الطريقة التي نسخنا فيها المستطيلات الصغيرة. حدّد جميع المستطيلات الصغيرة الثلاث والدوائر الصغيرة الثلاث أيضًا واختر الخيار Merge من لوحة Pathfinder لدمج جميع هذه الأشكال معًا. وبهذا نكون قد انتهينا من تصميم شكل الكاميرا الرقمية. والآن سنتجه لتصميم شكل آخر وهو القلم الذي سيرمز إلى المقالات أو الدروس. ارسم مستطيلًا نحيفًا بارتفاع كبير (استخدمتُ هنا لونًا مغايرًا وبإمكانك اختيار الألوان التي تناسبك). انسخ Ctrl+C وألصق في المقدمة Ctrl+F هذا المستطيل مرتين وحرك النسختين لتصطف جميع المستطيلات بجوار بعضها البعض. ارسم مستطيلًا مستدير الزوايا عرضيًا في الجزء العلوي من المستطيلات الثلاثة وليكن نصف قطر زوايا المستطيل صغيرًا. ارسم مستطيلًا آخر مستدير الزوايا وهذه المرة فليكن نصف قطر الزوايا كبيرًا واجعل نصفه السفلي يغطي المستطيل العرضي السابق ثم أرسل هذا الشكل للأسفل باستخدام الاختصار CMD+Shift+[. استخدم أداة القلم Pen Tool لرسم مثلّث يُشكّل رأس القلم وللحصول على مثلث مثالي استخدم الأدلة الذكية لمساعدتك على تحقيق الأبعاد المثالية لهذا المثلث (لا أنفك أذكر استخدام الأدلّة الذكية في كل مرّة ولكن استخدامها في الرسم اليدوي وبدون التقيّد بأبعاد محددة يسهّل عملية التصميم بشكل مذهل). ارسم دائرةً متوسطة الحجم مركزها هو نقطة رأس المثلث السفلي. ضاعف شكل المثلث ثم حدّده مع شكل الدائرة واستخدم الخيار Intersect من لوحة Pathfinder لقص الجزء المشترك بين الشكلين. وهكذا سيبدو القلم بعد الانتهاء من رسمه. حدّد كل أشكال القلم ثم دوّره باستخدام لوحة Transform بزاوية 45- درجة. هذا هو الشكل النهائي للقلم. والآن سنرسم أيقونة سنجعلها تبدو كشخصين للدلالة على الجمع وسنغيّر لون الخط إلى أخضر. ابدأ برسم مثلث كبير باستخدام أداة المضلعات Polygon Tool واجعل قاعدته للأسفل. استخدم أداة الدائرة مع الضغط على مفتاحي ALT و Shift لرسم دائرة مركزها رأس المثلث. ارسم دائرةً أخرى أكبر قليلًا من الدائرة الأولى تتشاركان ذات المركز. حدّد الدائرة الكبيرة والمثلث ثم انقر خيار Minus Front من لوحة Pathfinder لإزالة مساحة الدائرة المتداخلة مع المثلث من المثلث. حدّد هذا الشكل مع الدائرة ثم انسخ Ctrl+C ثم ألصق في المقدمة Ctrl+F ثم حرّكها لليسار قليلًا وبعدها صغّر حجمها قليلًا. انسخ الدائرة الكبيرة مجدّدًا ثم ألصقها في المكان في المقدمة ثم كبّرها بشكل طفيف مع استخدام مفتاحي ALT و Shift للمحافظة على موقع مركز الدائرة ونسبة الأبعاد. حدّد الدائرة الكبيرة الجديدة والدائرة الصغيرة على اليسار ثم استخدم Minus Back من لوحة Pathfinder لتقص شكل الدائرة الكبيرة من الصغيرة. كرّر ذات العملية مع شكل أعلى الجسم الكبير من نسخ ولصق وتكبير. مجدّدًا كرّر عملية تحديد شكلَي الأجسام واذهب إلى الأمر Minus Back من Pathfinder وذلك لقص الأشكال من بعضها. وبهذا يصبح هذا الشكل جاهزًا للاستخدام. لقد تعلمت في هذا الدرس الطريقة الأساسية لتصميم أيقونات خطيّة باستخدام الأشكال الأساسية وبإمكانك الآن تصميم أشكال أخرى من الأيقونات باستخدام ذات الأسلوب المستخدم في هذا الدرس. ويمكنك استخدام هذه الأشكال الآن كأيقونات بسهولة، يمكنك أن تجعل ألوان التعبئة بيضاء أو تتركها بدون تعبئة ومن الممكن حتى تغيير ألوان الخطوط ولا ننسى أنه بإمكاننا أن نعدّل حجم هذه الأشكال بدون أن تتشوّه لأنها ببساطة رسومات فكتور، كل ما عليك القيام به الآن هو أن تصدّر Export هذه الأشكال إلى صورة PNG وتستخدمها.

تُعتبر الأيقونات الخطّية عنصرًا مكمِّلا للتّصاميم المسطّحة، وفي درسنا هذا سنقوم بتصميم مجموعة من تلك الأيقونات والتي يمكن استعمالها مثلا في التّطبيقات الخاصّة بالطّقس. فقط حاول أن تتابع الدّرس خطوة بخطوة وسَتكتشف بساطة الأدوات التي سنستخدمها لعمل مجموعة من الأيقونات الأنيقة. رسم أيقونة السحابةسنبدأ أوّلا بتصميم أيقونة السّحابة. نقوم بفتح برنامج أدوبي اليستريتور ونرسم ثلاث دوائر من لوحة الأدوات، نحاول أن نجعلها متشابكة فيما بينها كما تظهر في الصّورة: نقوم بتحديد كل الدّوائر ثم نستخدم لوحة Align لنتأكّد من أنّها جميعا على نفس الأساس كما في الصّورة: نقوم برسم مستطيل أسفل الدّوائر بحيث يغطّي جميع الفجوات التي نشأت بينها، ثم نستخدم أداة التّوجيه الذكية (alt+U) حتى تساعدنا في تعديل محاذاة المستطيل مع الدّوائر. بعدها نستخدم أداة Pathfinder لدمج جميع الأشكال وذلك بتحديد الخاصية Unite: نقوم بحذف لون التعبئة الأبيض مع زيادة عرض stroke حوالي 5pt، بعدها نحاول تنعيم زوايا الشكل الذي تحصّلنا عليه باستخدام الخاصية round cap وإعدادات corner الموجودين في لوحة stroke: رسم أيقونة الشمسفي جزء آخر من مساحة العمل، نرسم دائرة صغيرة بنفس خصائص stroke السّابقة، ثم نضيف بعض الخطوط الصّغيرة فوقها: ننسخ الشّكل (alt+c) ونضعه فوق الأصلي مباشرة (alt+shift+v)، ثمّ ننقل النسخة ونضعها أسفل الدّائرة. ننسخ ونلصق الخطّين ونقوم بتدوير النسخة بزاوية 90 درجة ( لا تنسى أن تضغط على الزر shift حتى تحافظ على نفس التناسق): نكرّر عمليّة النّسخ واللّصق أكثر من مرة مع تحديد الزاوية بـ 45 درجة لتشكيل مجموعة من الخطوط المتباعدة بانتظام، ثمّ نضع كل تلك الخطوط في مجموعة واحدة: نحدّد كلا من الدائرة والخطوط ثم نقوم بمحاذاتهما مرة على المحور العمودي ومرة على الأفقي (استخدم الخاصية align) لنتمكن من وضعهم في المركز: جمع الأيقوناتواحدة من مميّزات التّعامل مع الأيقونات هي أنّه يمكننا إعادة استعمالها لتنسيقها مع أيقونات أخرى. وهنا يمكننا عمل أيقونة "الجو المتقلّب" عن طريق إضافة أيقونة الشّمس إلى أيقونة السّحاب، ونقوم بتدوير أيقونة الشّمس قليلا لخلق التوازن بين الأيقونتين: نقوم باستخدام أداة المقص Scissors tool لقطع مسار دائرة الشّمس لترك فجوة صغيرة بين العنصرين، ثم نحدّد الجزء المتبقي ونحذفه: نحدّد الخطوط التي تمثل أشعة الشمس ونفكّكها، ثمّ نحذف الجزء الذي لا نحتاجه: المزج بين أيقونتين منفصلتين (أيقونة الشّمس وأيقونة السّحابة) وخلق تناسق بينهما لتشكّيل أيقونة جميلة تعبّر عن "الجو المتقلّب": نستخدم نفس الطريقة لإنشاء أيقونات أخرى، كإستعمال سحابتين لعمل أيقونة تعبّر عن الجو المغيّم: عادة تُستخدم أيقونة القمر أو الهلال للتعبير عن "ليلة صافية" ويُمكننا عملها عن طريق مضاعفة دائرة الشمس التي سبق ورسمناها واستخدام خصائص أداة Pathfinder للحصول على هلال: يمكننا رسم نوع آخر من الأيقونات عن طريق الجمع بين أيقونتي الهلال والسّحاب وذلك لخلق أيقونة تعبّر عن طقس مغيّم في الليل. كما يمكننا أيضا إضافة اللّمسات التي سبق لنا واستخدمناها أثناء رسم أيقونة "الجو المتقلب" كترك مسافة بين شكل الهلال والسّحابة: نقوم برسم خطّين الأول صغير والثاني أكبر منه، ونضعهما أسفل السّحابة بزاوية 45 درجة للتعبير عن "جو ممطر"، نضاعف الخطين ونسحبهما مع الضّغط في نفس الوقت على المفتاح alt، ولتكرار الخطوط بنفس التناسق نضغط (alt+d): يمكننا أيضا رسم أيقونة تعبّر عن حالة "المطر الخفيف" وذلك بحذف بعض الخطوط السّابقة التي كانت تعبّر عن "مطر غزير": نرسم بعض قطع الثّلج الصغيرة وذلك برسم خطّين صغيرين متقاطعين. نضاعف الشّكل الذي تحصّلنا عليه عدة مرات مع اختيارمقاس الزّاوية بـ: 45 درجة، ثمّ نحدّد القطع ونقوم بتدويرها عشوائيا كما في الصورة الموضّحة: الأيقونات التي تعبّر عن "ثلج خفيف"، "عواصف رعدية" و"الصّقيع (حبّات البرد)" يُمكننا عملها عن طريق إحداث بعض التّغييرات على الأيقونات السّابقة أو الجمع بينهم: مجموعة الأيقونات النهائية تحتوي الحزمة النّهائية على مجموعة من الأيقونات والتى تمثّل أنواعا مختلفة من حالات الطّقس. ترجمة -وبتصرّف- للدّرس How To Create a Set of Vector Weather Line Icons لصاحبه Iggy.