You are on page 1of 12

Veõ logo PFIEV baèng Inkscape

Giôùi thieäu veà Inkscape:


Inkscape laø moät chöông trình ñoà hoïa chuyeân duøng ñeå veõ caùc aûnh vector töông töï
CorelDraw, Adobe Illustrator.

AÛnh vector laø daïng aûnh maø khi phoùng to khoâng bò beå haït, ngöôïc laïi vôùi aûnh bitmap.
Hình aûnh trong loaïi aûnh vector ñöôïc taïo döïng töø söï phoái hôïp caùc hoïa tieát cô sôû, khoâng
nhö aûnh bitmap laø söï phaân boá caùc ñieåm aûnh mang caùc tính chaát maøu saéc, ñaäm nhaït khaùc
nhau. Baïn coù theå lieân heä khaùi nieäm vector naøy vôùi caùi maø baïn ñaõ hoïc trong Ñaïi soá tuyeán
tính veà khoâng gian vector, caùc cô sôû, caùc vector ñoäc laäp tuyeán tính.

AÛnh vector coù öu ñieåm khoâng bò beå haït khi phoùng to, nhöng coù khuyeát ñieåm (do baûn
chaát cuûa noù) laø khoâng phuø hôïp vôùi nhöõng hình aûnh coù caùc maûng chuyeån tieáp lieân tuïc.
Töùc laø, aûnh vector chæ phuø hôïp vôùi nhöõng hình aûnh vôùi caùc ñöôøng neùt, hình khoái phaân
bieät nhö logo döôùi ñaây, coøn vôùi aûnh thieân nhieân thì chæ coù aûnh bitmap theå hieän ñöôïc.

Cho tôùi baây giôø, ña soá caùc ñònh daïng aûnh vector (nhö cuûa CorelDraw, Adobe Illustrator …)
haàu nhö chæ toàn taïi trong khaâu thieát keá, khi öùng duïng vaøo muïc ñích cuï theå nhö ñöa leân
web, cheøn vaøo caùc taøi lieäu, chia seø aûnh thì vaãn phaûi chuyeån thaønh aûnh bitmap vì ngoaøi
chöông trình thieát keá ra, chaúng coù chöông trình naøo chòu hoã trôï chuùng (ngoaïi tröø moät soá
chöông trình xem aûnh hoã trôï ña ñònh daïng).

Tuy nhieân, coù moät ñònh daïng aûnh vector non treû ñaõ vöôït qua phaàn naøo nhöõng giôùi haïn
aáy. Ñoù laø ñònh daïng SVG (Scalable Vector Graphics). Nhöng coù moät ñieàu hôi teáu laø SVG
voán dó chaúng phaûi laø loaïi file binary nhö caùc ñònh daïng aûnh (noùi chung) khaùc, thöïc ra noù
chæ laø moät file …text vieát theo loái XML (Extensible Markup Language). Do vaäy, baïn coù theå
taïo ra noù thoâng qua baát cöù chöông trình text editor naøo (Notepad chaúng haïn), mieãn laø
baïn bieát veà code SVG (coù theå hoïc treân www.w3schools.com).

SVG ra ñôøi vôùi muïc ñích bieåu thò ñoà hoïa vector treân web maø maùy tính naøo cuõng coù trình
duyeät web neân SVG portable hôn caùc daïng aûnh vector kia. Tuy theá ñieàu ñoù vaãn chöa
hoaøn toaøn vì phaàn nhieàu maùy tính baây giôø vaãn coøn söû duïng trình duyeät Internet Explorer
laïc haäu vôùi version 6- chöa hoã trôï SVG, trong khi caùc trình duyeät khaùc nhö Mozilla
Firefox, Opera ñeàu ñaõ hoã trôï sôùm. Nhöng noùi gì thì noùi, töông lai cuûa SVG laø raát saùng suûa,
höùa heïn cuøng vôùi öùng duïng ngaøy caøng phoå bieán cuûa web vaø chuaån XML.

Thoâng tin theâm veà SVG naèm ôû http://www.w3schools.com/svg/svg_intro.asp.

Taïi sao töø naõy giôø chæ thaáy toâi noùi veà SVG maø khoâng thaáy ñaû ñoäng gì veà Inkscape? Vì
SVG chính laø daïng file maø Inkscape laøm vieäc. Söû duïng Inkscape trong baøi naøy nhö laø moät
caùùch coå vuõ cho vieäc söû duïng Inkscape, do tính tieän ích cuûa file SVG vaø do Inkscape laø
phaàn meàm nguoàn môû, mieãn phí (ñònh daïng SVG cuõng laø ñònh daïng môû, khoâng thuoäc
rieâng haõng naøo nhö caùc ñònh daïng cuûa CorelDraw, Adobe Illustrator).

Inkscape coù theå ñöôïc download töø website www.inkscape.org.. Vieäc caøi ñaët raát ñôn giaûn do
khoâng phaûi beû khoùa chi heát (mieãn phí maø), chæ coù OK vaø Next.

Naøo, baây giôø haõy môû Inkscape leân vaø baét ña


ñaààu baøi taäp thöù nhaát. Nhôù maximize cöûa soå
chöông trình leân nhaù (ñeå ñaûm baûo khoâng coù nuùt naøo bò che khuaát)

Tutorial 1: Veõ logo PFIEV


(PFIEV:
PFIEV: Programme de Formation d'Ingeùnieurs
ang theo hoïc)
Excellent au Vietnam: nôi toâi ñang

Ñaàu tieân haõy hình dung, tính toaùn


tröôùc hình daïng, kích thöôùc. Döïa
vaøo hình maãu, toâi ñaõ ño ñöôïc tæ leä
kích thöôùc nhö ôû hình döôùi (haõy
xem treân thöôùc, vôùi ñôn vò pixel).

Ñeå trôï giuùp cho vieäc veõ chính xaùc theo moät kích thöôùc ñònh tröôùc, Inkscape cung caáp
tính naêng goïi laø snap. Nhö ñaõ laøm quen hoài hoïc AutoCAD, caùc baïn coù theå hieàu Snap laø
söï baét dính, thu huùt troû chuoät vaøo moät ñieåm coá ñònh coù vò trí maø ta mong muoán ñöa
ñöôïc troû chuoät ñeán. Tuy nhieân, snap cuûa Inkscape khoâng gioáng nhieàu snap cuûa AutoCAD.
Haõy xem qua caùc kieåu snap cuûa Inkscape
baèng caùch vaøo File > Document Properties >
Snap:

Object Snapping: Snap döïa vaøo moät ñoái töôïng


ñaõ coù treân hình

Grid Snapping:: Baûn veõ seõ ñöôïc ñaët döôùi moät


maïng löôùi vaø snap döïa vaøo caùc nuùt löôùi. Löôùi
naøy chæ phuïc vuï cho snap khi thieát keá chöù
khoâng hieän ra trong baûn veõ keát quaû.

Guide Snapping: Snap döïa vaøo nhöõng ñöôøng


gioùng ngang doïc goïi laø guide.. Chuoät seõ bò baét
dính ñeå di chuyeån doïc theo caùc ñöôøng naøy
hoaëc bò baét vaøo giao ñieåm caùc ñöôøng. Cuõng
nhö Grid, Guide khoâng hieån thò trong baûn veõ
keát quaû.

So vôùi AutoCAD, snap cuûa Inkscape coøn laøm


vieäc vôùi ñieåm, caïnh cuûa ñoái töôïng maø ta
ñang duøng chuoät ñeå di chuyeån, co keùo.

Baây giôø ta haõy baét tay vaøo thöïc haønh vôùi kyõ naêng söû duïng snap, kyõ naêng maø neáu thieáu
noù thì coâng vieäc cuûa baïn seõ trôû neân nhoïc nhaèn bieát bao!

Döïng Grid: Vaøo menu View > Grid ñeå cho hieän Grid. Tieáp theo choïn ñoä Zoom laø 160%,
ñoä zoom naøy thuaän lôïi cho kích thöôùc maø toâi ñaõ tính ôû treân (vôùi maøn hình 800x600, choã
thay ñoåi ñoä zoom seõ bò che khuaát neáu cöûa soå khoâng ñöôïc maximi
maximize).
Döïng Guide:

Guide ñöôïc taïo ra ñôn giaûn baèng caùch baám chuoät vaøo
thöôùc (ngang doïc tuøy guide ngang hay doïc) roài keùo reâ
vaøo khung veõ. Boû Guide ñi baèng caùch baám vaøo Guide vaø
keùo vaøo thöôùc. Tuy nhieân ñöøng voäi möøng vì gian nan laø
ôû choã ñaët Guide vaøo ñuùng vò trí. Taïi thôøi ñieåm vieát baøi
naøy, Inkscape chöa cho nhaäp toïa ñoä nôi Guide caàn ñaët
neân toâi phaûi di dôøi Guide moät caùch thuû coâng. Ñeå bieát
Guide ñaõ ñeán ñuùng choã chöa, haõy vöøa di dôøi vöøa quan
saùt toïa ñoä chuoät nôi goùc döôùi beân phaûi: Heä toïa ñoä goàm truïc X höôùng ngang sang phaûi,
truïc Y höôùng leân vaø goác toïa ñoä naèm ôû goùc traùi phía döôùi.

Vôùi baøi naøy, ta ñaët caùc Guide doïc ôû vò trí (X) 125,
200, 225, 250, 300, 350, 375, 400 vaø 475, caùc Guide ngang ôû
vò trí (Y) 500, 450, 400. Haõy xem laïi hình minh hoïa thöù
2.

Phuø, vaäy laø ñoùng xong coïc roài ñaáy. Tieáp theo laø xaây nhaø.

Veõ ñöôøng cong ñaàu tieân beân traùi: Coù 2 caùch veõ ñöôøng
cong naøy, baïn coù theå choïn 1 trong 2 hoaëc phoái hôïp caû 22,
nhöng toát hôn haõy thöïc haønh heát cho quen tay.

Tröôùc tieân, haõy vaøo Document Properties kieåm tra xem caùc tuøy choïn veà snap
s ñaõ ñöôïc baät
leân chöa (khoâng caàn phaûi baät heát maø chæ caàn baät nhöõng caùi naøo thích hôïp thoâi, nhö saép
tôùi ñaây ta seõ chaám caùc ñieåm döïa theo grid vaø guide neân phaûi baät heát nhöõng caùi Snap
pointa vaø Snap nodes).

Caùch 1: Choïn coâng cuï Draw Bezier curves and


straight lines (Shift – F6), chaám moät ñöôøng vaøo
ñieåm coù toïa ñoä (125, 400). Do ta ñaõ döïng 2
ñöôøng guides giao nhau taïi ñaây neân vieäc
chaám ñuùng vaøo ñieåm (125, 400) trôû neân raát
ñôn giaûn, chæ vieäc ñöa chuoät laïi gaàn ñoù roài
click. Tieáp theo chaám vaøo 2 ñieåm (200, 450)
vaø (225, 500). Sau khi chaám vaøo ñieåm thöù 3
naøy, nhaán Enter ñeå keát thuùc döïng caùc nuùt.
Nhö vaäy ta ñaõ coù moät ñöôøng gaáp khuùc vaø se seõõ döïng ñöôøng cong döïa treân ñöôøng gaáp khuùc
naøy.
Giöõ ñöôøng gaáp khuùc coøn trong traïng thaùi ñöôïc
choïn, choïn coâng cuï Edit path nodes or control
handles (F2).

Chaám vaøo node giöõa

Troâng leân thanh coâng cuï phía treân, baám vaøo


Make selected nodes symmetric.

Node maø ta choïn seõ trôû thaønh moät tieáp ñieåm ñöôøng
cong vaø tieáp tuyeán qua noù laø moät ñoaïn thaúng 2 ñaàu
ñoái xöùng. Duøng chuoät di dôøi 2 ñaàu (ñieåm troøn maøu
traèng) seõ laøm ñöôøng gaáp khuùc uoán cong.
Trong tröôøng hôïp naøy, toâi nhaän thaáy raèng do hai ñaàu
luoân ñoái xöùng nhau neân ñöôøng cong maø noù taïo ra
khoâng coù ñöôïc daùng nhö toâi muoán. Ñeå coâng vieäc deã
daøng hôn, ta caàn söûa ñoåi moät chuùt coâng cuï cuûa mình
baèng caùch chaám laïi vaøo node giöõa (hình vuoâng) roài
baám choïn nuùt Make selected nodes smooth
smooth.

Baây giôø thì 2 ñaàu vaãn thaúaúng haøng vôùi nhau qua node
giöõa nhöng ta ñaõ coù theå thay ñoåi khoaûng caùch 2 beân
ñeå taïo ra ñöôøng cong coù daùng mong muoán.

Sau khi veõ xong ñöôøng cong, baám chuoät trôû


laïi vaøo coâng cuï ñaàu tieân (Select
Select and transform
objects) ñeå kieåm tra keát quaû.

2) Caùch 2:: Cuõng duøng coâng cuï veõ ñöôøng thaúng nhö
treân, nhöng laàn naøy veõ moät ñoaïn thaúng th
thay vì
ñöôøng gaáp khuùc, töø ñieåm (125, 400) ñeán (225, 500)

Choïn coâng cuï Edit path nodes,


nodes
choïn ñoaïn thaúng vöøa veõ roài baám
choïn nuùt Make selected segments
curves ôû thanh coâng cuï phía treân.
Ñoaïn thaúng baây giôø trôû thaønh ñöôøng cong vôùi 2 tieáp
tuyeán ôû 2 ñaàu. Haõy duøng chuoät di chuyeån caùc ñaàu tieáp
tuyeán cho ñeán khi ra ñöôïc ñöôøng cong mong muoán.

Vaäy laø xong ñöôøng cong beân traùi, baây giôø ta seõ döïng ñöôøng cong beân phaûi. Ñeå yù raèng,
ñöôøng beân phaûi laø aûnh ñoái xöùng qua truïc doïc cuûa ñöôøng cong beân traùi, do vaäy ta khoâng
caàn phaûi veõ maø chæ vieäc sao cheùp roài xoay chuyeån laïi cho thích hôïp.

Ñaàu tieân, baám choïn ñöôøng caàn sao cheùp, nhaán Ctrl+D hoaëc right-click > choïn Duplicate,
ta seõ coù moät baûn sao naèm choàng leân ñöôøng cuõ. Haõy baám choïn noù roài keùo sang phaûi:

Tieáp theo baám vaøo nuùt Flip selected objects


horizontally treân thanh cong cuï phía treân.

Hình cong ñaõ ñöôïc laät ngang, baây giôø ta chæ caàn
nöông theo caùc guide maø ñaët noù vaøo ñuùng vò trí.
Xong!
Tôùi ñaây coù leõ baïn ñaõ thaïo vieäc veõ caùc ñoaïn thaúng vaø döïa vaøo guide ñeå chaám ñieåm chính
xaùc roài, cho neân vieäc veõ caùc ñöôøng ngang doïc cho thaønh caàu cuûa chuùng ta raát ñôn giaûn,
toâi khoâng caàn phaûi trình baøy phaàn naøy maø nhaûy ñeán phaàn veõ ñoaïn cong giöõa cuûa caây
caàu luoân.

Theo nhö toâi ñoaùn, ñöôøng cong giöõa caàu khoâng phaûi laø moät ñöôøng cong töï do maø laø moät
cung troøn neân toâi seõ khoâng veõ nhö hai ñöôøng cong treân maø seõ veõ moät cung troøn ñi qua 3
ñieåm (225, 500), (300, 450) vaø (375, 500). Taát nhieân baïn coù quyeàn phaûn ñoái toâi vaø veõ theo
yù baïn, nhöng taïi sao ta khoâng thöû xem caùch veõ moät cung troøn noù nhö theá naøo nhæ? Seõ coù
lôïi laém ñoù.

Inkscape khoâng phaûi laø AutoCAD, cho neân baïn khoâng theå veõ cung troøn theo kieåu
AutoCAD laø choïn coâng cuï veõ cung troøn (arc), choïn 3 ñieåm maø cung troøn ñi qua roài baám
Enter ñöôïc. Inkscape khoâng coù coâng cuï veõ cung troøn, cuõng khoâng coù choã nhaäp toïa ñoä,
tính sao ñaây?

Noùi raèng Inkscape khoâng coù coâng cuï veõ cung troøn, nhöng thöïc ra khoâng phaûi vaäy.
Inkscape coù coâng cuï veõ elipse raát linh hoaït. Baïn coù theå duøng noù veõ ñöôøng troøn, sau ñoù co
keùo, co keùo theá naøo ñoù cho noù thaønh moät phaàn chieác baùnh (nhö bieåu ñoà troøn) hay thaønh
moät cung troøn. Chuùng ta haõy khaùm phaù nheù.

Vaäy laø ta seõ phaûi veõ moät ñöôøng troøn ñi qua 3 ñieåm coá ñònh, theá naøo nhæ? Coâng cuï elipse
chæ cho veõ ñöôøng troøn töø moät goùc ngoaïi tieáp, hoaëc töø taâm chöù ñaâu cho veõ qua ñieåm? Ta
phaûi duøng chuùt Toaùn hoïc ñeå giaûi quyeát vaán ñeà naøy thoâi.
Haõy nhôù laïi baøi toaùn xaùc ñònh taâm ñöôøng troøn ñi qua 3 ñieåm cho tröôùc. Bieát raèng taâm
ñöôøng troøn ngoaïi tieáp tam giaùc seõ coù taâm laø giao ñieåm caùc ñöôøng trung tröïc cuûa tam giaùc
ñoù neân ta seõ duøng nguyeân lyù naøy ñeå tìm taâm.

Ñeå yù raèng ta ñaõ coù tröôùc moät ñöôøng trung tröïc


laø caùi ñöôøng guide doïc ôû vò trí 300, nhö vaäy ta
chæ phaûi veõ moät ñöôøng trung tröïc cuûa caïnh
xieân beân phaûi thoâi.

Ñaàu tieân veõ caïnh xieân ñoù roài ñoåi maøu, ñoåi neùt
cho khaùc vôùi caùc ñöôøng khaùc ñeå ta nhôù raèng
ñöôøng naøy chæ laø taïm thôøi, seõ xoùa ñi sau. Choã
ñeå thay ñoåi tinh chaát cuûa noù laø goùc döôùi beân
phaûi cöûa soå, double-click vaøo ñoù seõ laøm hieän ra hoäp thoaïi Fill and Strock giuùp baïn thay ñoåi
caùc tính chaát mong muoán.

Ñeå taïo ñöôøng vuoâng goùc cuûa caïnh xieân, ta Duplicate (Ctrl+D) noù roài xoay 90° baûn sao
vöøa taïo naøy:
Ñeå yù raèng ñöôøng vuoâng goùc vöøa taïo ra naèm ngay choùc vò trí
ñöôøng trung tröïc (huù hoàn). Baây giôø ta chæ vieäc keùo daøi cho
noù caét ñöôøng guide – trung tröïc thöù nhaát thoâi.

Ñeå laøm vaäy, haõy vaøo Document Properties


(Shift+Ctrl+D) > Snapping, chæ choïn moãi Snap
bounding boxes to guides thoâi (quan troïng, neáu caùc
snap khaùc coøn baät, chuùng seõ aûnh höôûng ñeán
thao taùc saép tôùi cuûa baïn!). Sau ñoù zoom leân möùc
cao hôn (320% chaúng haïn) ñeå ngaém cho roõ roài
vöøa aán giöõ phím Ctrl (hoaëc Ctrl+Shift) vöøa duøng
chuoät keùo ñaàu treân cuûa ñöôøng trung tröïc veà phía
guide 300. Khi ñeán gaàn guide thì click roài thaû ra,
ñaàu muùt seõ töï ñoäng caém ngay ngaén vaøo guide,
choã caém aáy chính laø taâm ñöôøng troøn.

Baây giôø quay laïi möùc zoom cuõ (160%), môû


Document Properties leân vaø theâm 3 tuøy choïn
Snapping laø Snap nodes to object, Snap to object path vaø Snap to object nodes.

Ñeå veõ ñöôøng troøn, click chuoät choã taâm ñöôøng


troøn, chuoät cuûa baïn seõ ñöôïc baét dính vaøo ñaàu
muùt ñöôøng trung tröïc, töùc laø ngay taâm. Tieáp
theo, vöøa aàn giöõ Ctrl + Shift, vöøa keùo chuoät
cheùo xuoáng. Haõy caên khi ñöôøng troøn ñi qua 3
ñieåm mong muoàn thì thaû ra.

(Ctrl giuùp veõ ñöôøng troøn vaø Shift giuùp veõ töø
taâm)
Baây giôø thì ta bieán ñöôøng troøn thaønh voøng cung baèng caùch click chuoät vaøo daáu troøn phía
phaûi cuûa ñöôøng troøn roài keùo ngöôïc chieàu kim ñoàng hoà. Thaät kyø dieäu, ñöôøng troøn bieán ñoåi
nhö ta ñang gaáp chieác quaït vaäy.

Haõy ñeå yù 2 coâng cuï Open arc vaø Make


whole. Open arc cho pheùp chuyeån ñoåi
qua laïi giöõa cung troøn (baät) vaø hình
quaït (taét). Coøn Make whole giuùp bieán
trôû laïi thaønh ñöôøng troøn kín ban ñaàu.

Xong xuoâi, xoùa caùc ñöôøng taïm ñi, ta


coù logo gaàn hoaøn taát.

AØ, coù 2 ñöôøng doïc phía döôùi chöa ñuû daøi kìa, haõy
keùo noù leân chaïm vaøo cung troøn nheù. Tieáp ñeán,
queùt choïn taát caû caùc ñöôøng roài chænh laïi thoâng soá
Fill and Stroke (Shift+Ctrl+F) ñeå neùt daøy leân chuùt
(4 pixels).

Ñeå theâm caùc chöõ P.F.I.E.V beân döôùi, duøng coâng cuï Create and edit text objects (chöõ A),
choïn font Arial, côõ 36 roài click vaøo baûn veõ maø goõ chöõ. Cuoái cuøng saép xeáp laïi cho ngay
ngaén.

AØ, coøn khi löu baûn veõ, haõy löu yù caùc ñònh daïng nhö sau:
Inkscape SVG laø daïng SVG maø Inkscape duøng ñeå löu laïi coâng vieäc dang dôû, noù khaùc chuùt
vôùi loaïi SVG noùi ôû ñaàu baøi (Plain SVG) vì noù phaûi löu theâm nhöõng döõ lieäu cuûa vieäc thieát
keá nhö Guide, Snap, Layer v.v… Maëc duø Inkscape SVG coù theå duøng cho web ñöôïc nhöng
chæ neân duøng noù ñeå löu baûn thieát keá, coøn khi ñöa vaøo söû duïng thì neân chuyeån qua löu
döôùi daïng Plain SVG.

Tröôùc khi söû duïng baûn veõ vaøo nhöõng vieäc thoâng thöôøng khaùc nhö chia seû, cheøn vaøo taøi
lieäu, baïn neân export noù ra thaønh daïng aûnh Bimap (vaøo menu File > Export Bitmap), do
hieän taïi söï hoã trôï aûnh vector chöa phoå bieán. Khi export, neân choïn ñuoâi PNG hoaëc GIF
ñeå ñaûm baûo neùn aûnh toát. (Chuù thích: PNG vaø GIF phuø hôïp ñeå neùn aûnh maø caùc maûng,
caùc chi tieát phaân bieät raïch roøi, coøn JPG phuø hôïp neùn aûnh maø caùc maûng chuyeån tieáp lieân
tuïc hay phaân bieät khoâng roõ reät)

Nguyeãn Hoàng Quaân

ng.hong.quan@gmail.com

15/08/2007

You might also like