இங்க்ஸ்கேபில் கண்ணாடி தோற்ற குறியுருவம் உருவாக்குதல்

 

கட்டற்ற மென்பொருள் வரைகலை(graphics) உலகில் இங்க்ஸ்கேப் மிக மிக பிரபலமான ஒன்று. என் வேலைகளின் ஒரு பகுதியாக அடிக்கடி வெவ்வேறு காரணங்களுக்காக குறியுருவம் (icon) உருவாக்க வேண்டிய சூழல் ஏற்படும். பொரும்பாலும் கண்ணாடி தோற்றம் கொண்ட குறியுருவம் (icon) உருவாக்க தான் பல விண்ணப்பங்கள் வரும். ஆச்சரியப்படும் விதமாக அந்த தோற்றத்தை இங்க்ஸ்கேப் மூலம் எளிதாக செய்து விடலாம்.

 

இங்க்ஸ்கேபின் தோற்றமும் அதன் சாதாரண செயல்பாடுகளும் உங்களுக்கு தெரிந்தது தான் என்று நான் எடுத்துக்கொள்ள போகிறேன். இல்லை எனில் இந்த கட்டுரையை www.freesoftwaremagazine.com/columns/inkscape_tutorial_creating_simple_ribbon படிக்கவும். ஆம் என்றால் இங்க்ஸ்கேப்பில் ஒரு புதிய ஆவணத்தை திறக்கவும். இந்த கட்டுரையின் SVG மூல ஆவணம் பதிவிறக்கம் செய்ய இங்கே (ஆங்கிலத்தில்) www.equitasit.co.uk/uploads/files/inkscape_glass.svg Creative Commons BY-SA உரிமத்தில் வழங்கப் பட்டுள்ளது. இக்கட்டுரையில் நிறங்களை RRGGBBAA வகையில் கூறியுள்ளேன்.

 

  • ellipse கருவியை பயன்படுத்தி Ctrl ஐ அழுத்திக் கொண்டு ஒரு வட்டம் (இதை வட்டம் 1 எனலாம்) வரையவும். அதன் அளவை 200 x 200 px ஆக இருக்கட்டும்.
  • இதன் stroke width ஐ 18 px ஆக வைத்துக் கொள்ளுங்கள்.
  • இந்த stroke கிற்கு linear gradient ffffffff முதல் 777777ff ஆக கொள்ளவும். அந்த gradient இன் repeat ஐ reflected ஆக வைத்துக் கொள்ளவும். gradient இன் வெள்ளை நடுப்பகுதியையும் grey பகுதியையும் வட்டத்தின் அடியில் நிலைபடுத்தவும்.

 

  • fill ஐ radial gradient ஆக 004000ff முதல் 60cc60ff. இள நிறத்தை stroke gradient இன் வெள்ளை முனையிலும் கருந்தோற்ற நிறத்தை வட்டத்தின் அடிப்பகுதியிலும் நேர்படுத்திக் கொள்ளவும்.

 

  • வட்டம் 1 ஐ நகலெடுத்து அதன் fill அனைத்தையும் நீக்கிவிடவும். (இதை வட்டம் 2 எனலாம்)
  • stroke width ஐ 2px ஆக கொண்டு, அளவை வட்டம் 1 றுடைய stroke ன் உள் பகுதியில் பொருத்திக் கொள்ளவும் (ஏறதாள 167 x 167 px)
  • புதிய வட்டத்தின் stroke ஐ single linear gradient ஆக கருப்பு மேலும் வெள்ளை கீழும் இருக்குமாறு 000000ff(கருப்பு) முதல் ffffffff(வெள்ளை) வைத்துக் கொள்ளவும்.

  • மேலும் ஒரு வட்டம் (இதை வட்டம் 3 எனலாம்) 140 x 113 px அளவில், அதன் மேல் பகுதி வட்டம் 1 ன் fill ல் பொருந்துமாறு உருவாக்கிக் கொள்ளவும்.
  • இதன் fill ஐ radial gradient ஆக ffffffff (வெள்ளை) முதல் ffffff00 (transparent) கொள்ளவும்.
  • gradient ன் நடுப்பகுதியை மேல் பக்கத்தில் வைத்துவிட்டு, அதன் opacity ஐ 70%-திற்கு கொள்ளவும்.

  • வட்டம் 3 ஐ நகலெடுத்து, அதை செங்குத்தாக மறிக்கவும்/கவிழ்கவும் (இதை வட்டம் 4 எனலாம்). அதன் அடிப்பகுதியை, வட்டம் 1 ன் fill லுடைய அடிப்பகுதியில் பொருத்தவும்.
  • opcacity ஐ 30% ஆகவும் blur ஐ 1.5 ஆகவும் கொள்ளவும்.
  • வட்டம் 2 ஐ நகலெடுத்து வட்டம் 1 ன் வெளி வரை வருமாறு பெரிதாக்கவும். அதன் gradient மறு திசையில் செல்லுமாறு வட்டத்தை மறித்து, stroke ஐ 1px அளவிற்கு கொள்ளவும்.

இப்போது முக்கியமான கண்ணாடி வட்டம் தயாராகிவிட்டது. இனி சிறிது எழுத்துகளை அதில் சேர்க்கலாம். இது கட்டாயமில்லை என்றாலும், பெரும்பாலான குறியுருவங்களுக்கு (icon) ஏதேனும் எழுத்துகள் சேர்ப்பது தேவையாகிறது.

 

  • ஒரு text object ஐ serif font (நான் Nimbus Roman No9 L பயன்படுத்தினேன்) கொண்டு உருவாக்கவும். அதன் fill ஐ ffff00ff (மஞ்சள்) ஆக்கி, பின் text ன் அளவை மாற்றி வட்டத்தின் நடுபகுதியில் பொருந்துமாறு செய்யவும்.
  • இதை அப்படியே நகலெடுத்து fill ஐ 000000ff (கருப்பு) ஆக மாற்றவும்.
  • இந்த கருப்பு எழுத்தை பின்னோக்கி நகர்த்தி இடப்பக்கம் சிறிது மேலாக தூக்கி நிறுத்தவும்.
  • இந்த text object களை சேர்த்து ஒரே குழுவாக்கி, பின்பக்கமாக வட்டத்திற்கு ஒரு நிலை மேலாக நிற்குமாறு செய்யவும்.

 

இனி இறுதியாக சிறிது நிழல் மட்டும் சேர்க்கலாம்.

 

  • இறுதியாக ஒரு வட்டம் உருவாக்குங்கள். அதை 000000ff (கருப்பு) கொண்டு நிரப்பி, அதன் அளவு 115 x 15 px இருக்குமாறு செய்து. அதை நாம் உருவாக்கிய குறியுருவத்திற்கு (icon) கீழே அதை தொடாதவாறும், சரியாக நடுப்பகுதியில் வருமாறும் அமைக்கவும்.
  • opacity 50% மாகவும் blur 9 ஆகவும் இருக்கட்டும்.

 

அவ்வளவு தான், இதோ இறுதி குறியுருவம் (icon) தயார். reflective highlight spots, சில light reflections போன்றவைகளையும் வட்டம் 1 ன் stroke ல் சேர்க்கலாம்.

%d bloggers like this: