Nagpapakita kami sa iyo ng seleksyon ng mga libreng serbisyo para sa mga taga-disenyo. Ito ang unang opsyon, plano naming palawakin ito sa hinaharap sa pamamagitan ng pagdaragdag ng mga bagong seksyon at tool.
Mga font
- Ang Google Fonts ay ang paboritong library ng font ng lahat. Binibigyang-daan kang pumili at mag-download ng iba't ibang mga font para sa lahat ng okasyon.
- 1001 Libreng Mga Font - library ng font. Ito ay may madaling pag-navigate - ang mga font ay pinagsunod-sunod sa parehong alpabeto at ayon sa uri. Mayroong isang seksyon ng mga font ng Ruso.
- Ang Fontstruct ay isang online na taga-disenyo ng font. Isang napakasimpleng tool na magpapahintulot sa iyo na lumikha ng iyong sariling font. Maaari kang gumuhit hindi lamang gamit ang karaniwang mga parisukat, kundi pati na rin sa iba pang mga hugis - mga tuldok, bilugan na sulok, atbp. Para sa isang baguhan, ito ay isang mainam na tool upang subukan at makita ang typography sa pagkilos.
- Ang Font Squirrel ay isa sa pinakamalaking library ng font. Bilang karagdagan, maaari kang mag-upload ng isang larawan at makuha ang mga pangalan ng mga font na ginamit dito. Mayroong isang tindahan ng font, at kahit isang tindahan ng damit na may mga logo.
- Ang Type light ay isang full-feature na font editor. Binibigyang-daan kang lumikha, mag-edit at mag-convert ng OpenType, TrueType at PostScript na mga font. Kailangang ma-download at mai-install. Ang libreng bersyon ay may limitadong pag-andar kumpara sa libreng bersyon. Ngunit sapat na upang lumikha ng isang simpleng font.
- Ano ang Font ay isang online na serbisyo para sa pagpili ng mga font ng website. Dina-download namin ang font file, ipahiwatig ang url ng site at tingnan kung ano ang magiging hitsura ng na-download na font sa site. Maginhawang serbisyo.
- 1001 Font – library ng mga font (higit sa 15,000). Madaling nabigasyon - maaaring mapili ang font ayon sa laki, uri, tema, disenyo, atbp. Binibigyang-daan ka ng menu na i-customize ang output, na ginagawang posible na makita ang bawat font sa iba't ibang mga opsyon: laki, istilo, atbp.
- Ang Font Flame ay isang online na serbisyo para sa pagpili ng isang pares ng mga katugmang font. Gumagana ito nang napakasimple - sa pangunahing pahina mayroong isang sheet na may dalawang inskripsiyon na ginawa sa iba't ibang mga font. Kung nagustuhan mo ito, i-click ang "Pag-ibig" kung hindi mo gusto, i-click ang "Kapootan". Pagkatapos ay maaari mong tingnan muli ang mga napili. Ang pag-click sa pangalan ng font ay magbubukas ng Google Fonts.
- Typecast – pagpili ng font para sa prototype. Makikita mo kung ano ang magiging hitsura ng font sa anumang device. Kinakailangang tukuyin ang iba't ibang uri ng teksto - mga pamagat, panipi, atbp. Maaari kang pumili ng isang typeface, laki, istilo, at set ng mga indent. Makikita mo ang iyong pahina sa hinaharap sa mga font na iyong na-install. Ang isang malaking plus ay ang pagpili ng layout (isang column o ilan, iba't ibang block arrangement).
- Wordmark - nagbibigay-daan sa iyong piliin ang font na naka-install sa computer ng user para sa text, logo o pamagat. Kapag naglagay ka ng text sa isang field, ipinapakita ito sa iba't ibang font. Maaari mong piliin ang laki, magparehistro, ipakita sa itim at puti o vice versa. Ang mga opsyon na gusto mo ay na-publish sa Twitter o sa Facebook - sa pagpili ng user. Maaaring ipadala sa pamamagitan ng email.
Stock Photos
- Ang Unsplash ay isang patuloy na ina-update na stock ng mga larawan. Ang mga koleksyon ay nahahati sa mga tema. Makakahanap ka ng kahit ano mula sa "African Americans" hanggang sa "Nature". Ang bawat larawan ay may sariling rating, maaari mong makita ang pinakamahusay o bago.
- FoodiesFeed – mga larawan ng pagkain. Ang mga larawan ay nahahati sa mga kategorya. Maaari mong piliin ang pinakamahusay, eksklusibo, mga icon, mga mockup, atbp.
- Libreng Refe Photos - isang malaking listahan ng mga larawang "Tunay na buhay". Pangunahing landscape at nature photography. Hindi maginhawang nabigasyon, ang lahat ng mga larawan sa pangunahing pahina ay lilitaw kapag nag-i-scroll.
- Little Visuals – mataas na kalidad na mga larawan ng mga landscape at gusali. Maaari kang mag-download ng archive ng pinakamahusay na mga larawang nai-post sa buong linggo. Ang mga larawan ay may label na may mga hashtag, ngunit hindi nakategorya.
- Ang Freeography ay isang malaking library ng mga libreng larawan. Ang lahat ng mga larawan ay nahahati sa anim na tema: mga tao, grimaces, lungsod, bagay, kalikasan at hayop. Maaari kang maghanap sa pamamagitan ng mga salita.
- Death to the Stock Photo – mga stock na larawan. Hindi pwedeng tumingin at pumili lang. Pumipili sila isang buwan nang maaga at hinahayaan kang i-download ito pagkatapos ipasok ang iyong email. Ang archive ay tumitimbang ng humigit-kumulang 11 MB. Ang pinakamahusay na mga larawan at isang link sa pag-download ay ipinapadala sa pamamagitan ng email.
- Superfamous – isang malaking koleksyon ng mga larawan mula sa hindi pangkaraniwang anggulo. Ang set ay maliit ngunit kawili-wili.
- Ang Pattern Library - mga pattern at texture. Ang set ay medyo malaki, ang mga template ay hindi karaniwan. Ang mga ito ay pinalitan ng pag-scroll, at unti-unti. Makikita mo kung ano ang magiging hitsura ng template sa buong screen o bahagi nito.
- Bagong Lumang Stock – mga antigong larawan mula sa archive. Mayroong ilang mga libreng larawan, ngunit ang mga bago ay regular na lumalabas.
- Pexels – isang malaking bilang ng mga larawan para sa lahat ng okasyon. Hinati sila ayon sa paksa, napakadaling hanapin.
- Jay Mantri - malaking hanay ng mga larawan. Walang klasipikasyon tulad nito, maaari mong tingnan ito sa pamamagitan ng buwan.
Stock graphics
- Brusheezy – mga libreng brush, template, texture at higit pa para sa Photoshop. 12 kategorya, bawat isa ay may mga subcategory. Malaki ang pagpipilian.
- Iconfinder – mga icon, parehong bayad at libre. Maaari kang mag-download sa mga format na ICO, PNG, ICNS, SVG.
- Ang Brushez ay isang malaking koleksyon ng mga brush para sa Photoshop. Bilang karagdagan sa kanila, mayroon ding mga primitive ng vector, mga form, mga template, mga estilo. Ang bawat seksyon ay nahahati sa mga subsection. Halimbawa, mayroong higit sa 20 mga kategorya para sa mga brush.
- Ang Vecteezy ay isang library ng mga vector graphics, kabilang ang mga larawan at mga guhit. Ang isang malaking bilang ng mga kategorya at isang malaking bilang ng mga graphics.
- Ang Iconbird ay isang serbisyo sa paghahanap ng icon sa wikang Ruso. Maaari kang magpasok ng isang paksa at makakuha ng isang hanay ng mga icon, o maaari kang mag-browse ayon sa kategorya.
- Ang Icons8 ay isang serbisyo sa wikang Ruso na nag-aalok ng higit sa 42,000 mga icon sa iba't ibang mga paksa.
Infographics
- Ang Vizualize ay isang online na serbisyo para sa paglikha ng "About Me" infographics. Mahalagang lumilikha ng isang graphical na resume.
- Ang Canva ay isang simpleng tool para sa paggawa ng anumang disenyo. Binibigyang-daan kang magdisenyo ng presentasyon, poster, mag-post sa mga social network, aklat, liham, materyales at marami pang iba. Ginagawa ang lahat batay sa mga template, nagbabago ang teksto. Ngunit mayroong maraming mga template na mapagpipilian.
- Easelly – paglikha ng mga infographics batay sa mga template. Binibigyang-daan ka ng built-in na online na editor na baguhin ang disenyo, ilagay ang mga karagdagang elemento, at baguhin ang teksto.
- Ang Infogram ay isang online na serbisyo para sa paglikha ng mga infographic at interactive na diagram. Hindi lahat ng function ay available, kailangan mong bumili ng account.
- Ang Visage ay isang simpleng tool para sa paglikha ng anumang visual na nilalaman (mga chart, infographics, mga larawan sa blog, atbp.). Maraming mga template, simpleng editor. Ang ilang mga tampok ay binabayaran.
- Ang Gliffy ay isang online na serbisyo para sa paggawa ng mga diagram. Gumagana ang editor sa prinsipyo ng Microsoft Visio.
- Ang Visme ay isang online na tool para sa paglikha ng mga presentasyon at infographics. Higit sa 1000 mga template. Pinapayagan ka ng editor na magdagdag ng teksto (heading, listahan, quote at regular), animated na teksto at mga widget. Sa isang libreng account maaari mong i-download ito bilang isang JPG file.
- Piktochart - Lumikha ng mataas na kalidad na mga graphics - mga presentasyon, infographics o mga naka-print na materyales. Nag-upload ng PNG, JPG na may iba't ibang laki.
- Ang Drawio ay isang maginhawang online na serbisyo para sa paglikha ng mga diagram. Maaari kang mag-save sa dropbox at mga katulad na serbisyo, o sa disk.
- Venngage – madaling paglikha ng mga infographic, poster, ulat, materyales para sa mga social network, atbp. Sa libreng bersyon, nagbibigay lamang ito ng link sa publikasyon. Kailangan mong magbayad para sa pag-download.
- Ang Cacoo ay isang online na serbisyo para sa pagguhit ng mga diagram at sitemap. Marahil ang pinakamahusay sa mga tuntunin ng mga kakayahan. Isang malaking bilang ng mga tool at template. Maaari kang mag-export sa PNG, PDF, SVG, PPT, atbp.
- Ang Creately ay isang online na serbisyo sa diagramming. Magagamit lamang para sa publikasyon. May bayad ang pag-download.
- Ang Lucidchart ay isang online na serbisyo para sa paglikha ng mga diagram at mga guhit. Posibleng mag-import ng diagram ng Microsoft Visio. Ine-export sa PDF, PNG at JPG. May bayad na functionality.
Mga kulay
- Color Hunt – pagpili ng mga kumbinasyon ng kulay. Maaari kang pumili ng hanggang apat na kulay. Mayroong mga handa na solusyon na mapagpipilian.
- TinEye – sinusuri ang site at nagpapakita ng listahan ng mga mapagkukunan na gumagamit ng larawan mula sa site.
- ColorZilla – nagbibigay-daan sa iyo na lumikha ng mga kulay at gradients. Nagpapakita ng mga katangian ng css para sa kanila.
- Adobe Color CC – paggawa ng mga color scheme.
- Colicious – pindutin ang spacebar at bumuo ng bagong kulay.
- Colorscheme - pagpili ng mga scheme ng kulay. Mayroong isang bersyon sa Ingles at Ruso. Binibigyang-daan kang pumili ng mga kulay para sa site. May fine tuning at nagpapakita ng color code. Sa huli, pinapayagan ka nitong tingnan ang pahina sa napiling scheme ng kulay. Ang pinakamalaking kalamangan ay ang pagtingin sa gamut sa mga tuntunin ng paglihis ng pang-unawa ng kulay. Pinapayagan ka nitong pumili ng iba't ibang mga modelo ng kulay. Sine-save ang Gimp, CSS, PNG, atbp. sa palette. May color converter para sa pag-convert mula sa isang color model papunta sa isa pa.
- Ang Paletton ay isang tool para sa paglikha ng mga kumbinasyon ng kulay. Walang pinagkaiba sa Colorscheme.
- Pictaculous – Sinusuri ang palette ng isang PNG, JPG o GIF na imahe. Mag-upload ng larawan at kumuha ng set ng lahat ng kulay na naroroon dito.
- Hex Color Tool – tool sa pagpili ng kulay. Gamitin ang mga slider upang ayusin ang kulay, at maaari mong piliin ang liwanag. Ang napiling kulay ay ise-save. Maaari kang pumili ng isang palette.
- Ang (Un)clrd ay isang browser plugin na nag-aalis ng lahat ng kulay at iniiwan ang site sa black and white.
- BrandColors - ang pinakamalaking koleksyon ng mga opisyal na code ng kulay ng tatak. Piliin ang pangalan ng brand at i-download ang mga pangalan ng mga kulay nito, kasama ang css file.
- Colortyper - pagpili ng mga kulay mula sa isang hindi pangkaraniwang anggulo. Ang screen ay nagpapakita ng maraming kulay na mga simbolo na nagsalubong. Ang resulta ng intersection ay isang bagong kulay. Mukhang kawili-wili.
Inspirasyon
- Dribbble - Ang pinakamalaking komunidad ng mga designer. Trabaho, komunidad, komunikasyon - maaari kang makahanap ng anuman dito.
- Freebbble - mga template at disenyo mula sa Dribbble. Ang ilang mga bagay ay maaaring ma-download nang libre, ang ilan ay maaaring mabili. Makakahanap ka ng mga template para sa CMS, mga designer, mga icon, mga mockup, mga dinisenyo na template ng website at marami pa.
- Muzli - Pang-araw-araw na inspirasyon sa disenyo. Isang mapagkukunan para sa mga taga-disenyo na may mga halimbawa ng mga pinaka-hindi pangkaraniwang gawa.
- Awwwards - ang pinakamahusay na pag-unlad ng mga designer. Inayos bilang isang site ng pagboto ng komunidad. Ang site ng araw, buwan, taon, atbp. ay napili.
- Ang Design You Trust ay isang komunidad ng mga designer na nagbabahagi ng mga pinakabagong trend, balita, portfolio, disenyo at malikhaing anunsyo.
- Talagang Magagandang Email - Isang malaking koleksyon ng mga email na mahusay ang disenyo. Pumili ng template at kunin ang html, css at js code nito. Maaari mong baguhin ang teksto, mga larawan, atbp.
- Fubiz – mga publikasyon mula sa larangan ng disenyo at pagkamalikhain. Makakahanap ka ng mga litrato, disenyo, graphics, video, atbp. Lahat ay nahahati sa mga kategorya.
- Ang Designspiration ay isang koleksyon ng mga disenyong inspirasyon ng Pinterest. Isang malaking bilang ng mga ideya at halimbawa - palalimbagan, logo, titik at marami pang iba.
- Ang Behance ay isang koleksyon ng mga portfolio mula sa mga propesyonal. Maaari kang mag-iwan ng bakante o resume.
- Mga pattern ng mobile – library ng mga screenshot ng iOS at Android. Ang lahat ay nahahati sa mga seksyon. Makakahanap ka ng maraming ideya.
- Ang One Page Love ay isang gallery ng pinakamahusay na mga disenyo ng web page. Maaari kang bumili ng mga template at tema. Mayroon ding mga libre.
- Ang Uispace ay isang mapagkukunan para sa mga taga-disenyo. Maaari kang mag-download ng psd, sketch, font, mockup, atbp. nang libre.
Mga graphic editor
- DAZ 3D - 3D na pagmomodelo. Magrehistro at i-download ang desktop application.
- Ang Gimp ay isang libreng analogue ng Photoshop. Binibigyang-daan kang mag-customize ng modular grid, gumawa ng mga gabay, magtrabaho sa mga layer, magdagdag ng mga effect, atbp. Ito ay isang magandang libreng kapalit para sa Photoshop. Mapapalawak ito - maaari kang mag-download ng mga karagdagang plugin.
- Blender - 3D na pagmomodelo, animation, pag-render, tunog, video. Binibigyang-daan kang lumikha ng mga laro. Mabilis na lumalagong editor, napakasikat.
- Ang Aviary ay isang online na serbisyo sa pag-edit ng larawan. Maraming mga opsyon, kabilang ang Red-Eye Effect, pagbabago ng laki, atbp.
- Ang Pixlr ay isang online na photo editor at isang hiwalay na graphics editor. Ang huli ay mukhang Photoshop. Nagse-save sa disk.
- Ang BeFunky ay isang online na serbisyo sa pag-edit ng larawan. Mga effect, frame, graphics, retouching at marami pang iba. Mayroong interface sa wikang Ruso.
- Ang Inkscape ay isang kumpletong open source vector graphics editor. Sinusuportahan ang mga kakayahan ng format ng SVG - nagtatrabaho sa mga hugis, contour, teksto, vectorization ng raster graphics, atbp. Bilang karagdagan sa pagproseso ng mga imahe ng vector, pinapayagan ka nitong lumikha ng template ng website at i-cut ito - naroroon ang isang modular grid. Binibigyang-daan kang gumuhit ng mga background, banner, vector logo, atbp.
- Ang IconEdit2 ay isang napakasimpleng programa para sa pagguhit ng mga icon. May mga filter. Binibigyang-daan kang mag-export ng larawan para sa Android at Apple. Maaari mong ayusin ang lalim ng kulay, paikutin at ayusin ang icon. Sinusuportahan ang translucency, maraming mga imahe sa bawat ICO file, at anti-aliasing sa lahat ng mga tool sa pagguhit.
- Ang Falco GIF Animator ay isang programa para sa paglikha ng frame-by-frame na animation at mga animated na icon. Maaari kang mag-download ng maraming iba't ibang mga programa sa mapagkukunan.
- Ang Krita ay isang propesyonal na open source desktop editor. Magagamit para sa iba't ibang OS.
- Ang Boxy-SVG ay isang vector graphics editor na katulad ng Adobe Illustrator, Sketch at Inkscape.
- Ang Photopos ay isang multifunctional na programa, na may mga function ng isang photo editor, isang graphic editor at isang application para sa paglikha ng computer graphics.
- Ang 5Dfly ay isang libreng batch na application sa pagproseso ng larawan. Maaaring gumawa ng mga slide show gamit ang PowerPoint. Maaari mong i-download ang PDF converter nang hiwalay.
- Ang PaintStar ay isang libreng editor ng imahe. Ang interface ay halos kapareho sa Paint, ngunit may higit pang mga pagpipilian. Mga layer, halimbawa.
- Ang PhotoScape ay isang simpleng editor ng larawan. Mayroon itong mga function para sa pagsasaayos ng liwanag at kulay, white balance, backlight correction, mga frame, balloon, mosaic mode, pagdaragdag ng text, pagguhit ng mga larawan, pag-crop, mga filter, pag-alis ng red-eye, colorization, brush, clone stamp, effect brush, atbp.
Sa html, ang laki ng font ay gumaganap ng isang mahalagang papel. Binibigyang-daan ka nitong maakit ang atensyon ng gumagamit sa mahalagang impormasyong nai-post sa pahina ng site. Bagaman hindi lamang ang laki ng mga titik ang mahalaga, kundi pati na rin ang kanilang kulay, kapal at maging ang pamilya.
Mga tag at katangian kapag nagtatrabaho sa mga html na font
Ang wika ng hypertext ay may malawak na hanay ng mga tool para sa pagtatrabaho sa mga font. Pagkatapos ng lahat, ang pag-format ng teksto ay ang pangunahing gawain ng html.
Ang dahilan para sa paglikha ng wikang HTML ay ang problema sa pagpapakita ng mga panuntunan sa pag-format ng teksto sa mga browser.
Tingnan natin ang mga tag na ginagamit upang gumana sa mga font sa HTML at ang kanilang mga katangian. Ang pangunahing isa ay ang tag . Gamit ang mga halaga ng mga katangian nito, maaari kang magtakda ng ilang mga katangian ng font:
- kulay - nagtatakda ng kulay ng teksto;
- laki – laki ng font sa mga karaniwang unit.
Ang mga positibong halaga ng katangian mula 1 hanggang 7 ay sinusuportahan.
- mukha – ginagamit upang itakda ang pamilya ng font ng teksto na gagamitin sa loob ng tag . Maraming mga halaga ang sinusuportahan, na pinaghihiwalay ng mga kuwit.
Ang text lang na matatagpuan sa pagitan ng mga bahagi ng nakapares na tag ng font ang naka-format. Ang natitirang bahagi ng teksto ay ipinapakita sa karaniwang default na font.
Gayundin sa html mayroong isang bilang ng mga ipinares na tag na tumutukoy lamang sa isang panuntunan sa pag-format. Kabilang dito ang:
- - nagtatakda ng bold na font sa html. Tag katulad ng pagkilos sa nauna;
- — ang laki ay mas malaki kaysa sa default;
- — mas maliit na laki ng font;
- — italic text (italics). Katulad na tag ;
- — tekstong may salungguhit;
- na-cross out;- — ipakita lamang ang teksto sa maliit na titik;
- - sa upper case.
Plain text
Naka-bold na text
Naka-bold na text
Higit sa karaniwan
Mas mababa kaysa karaniwan
Italiko
Italiko
May salungguhit
Naka-cross out
Mga kakayahan sa katangian ng istilo
Bilang karagdagan sa mga inilarawang tag, may ilang higit pang mga paraan upang baguhin ang font sa html. Ang isa sa mga ito ay ang paggamit ng katangian ng generic na istilo. Gamit ang mga halaga ng mga katangian nito, maaari mong itakda ang estilo ng pagpapakita ng font:
1) font-family – itinatakda ng property ang font family. Posibleng maglista ng maraming halaga.
Ang pagpapalit ng font sa html sa susunod na halaga ay magaganap kung ang nakaraang pamilya ay hindi naka-install sa operating system ng user.
Pagsusulat ng syntax:
font-family: font-name [, font-name[, ...]]
2) laki ng font - ang laki ay nakatakda mula 1 hanggang 7. Ito ay isa sa mga pangunahing paraan upang madagdagan ang font sa HTML.
Pagsusulat ng syntax:
laki ng font: ganap na laki | kamag-anak na laki | ibig sabihin | interes | magmana
Maaari mo ring itakda ang laki ng font:
- Sa mga pixel;
- Sa ganap na termino ( xx-maliit, x-maliit, maliit, katamtaman, malaki);
- Sa porsyento;
- Sa mga puntos (pt).
Laki ng font:7
Laki ng font:24px
Laki ng font: x-malaki
Laki ng font: 200%
Laki ng font: 24pt
3) font-style - nagtatakda ng estilo ng pagsulat ng font. Syntax:
font-style: normal | italic | pahilig | magmana
Mga halaga:
- normal – normal na spelling;
- italic – italic;
- pahilig - ang font ay nakahilig sa kanan;
- inherit – namamana ang ispeling ng parent element.
Isang halimbawa kung paano baguhin ang font sa html gamit ang property na ito:
font-style:inherit
font-style:italic
font-style: normal
font-style:pahilig
4) font-variant - kino-convert ang lahat ng malalaking titik sa malalaking titik. Syntax:
font-variant: normal | maliliit na takip | magmana
Isang halimbawa kung paano baguhin ang font sa html gamit ang property na ito:
font-variant:inherit
font-variant:normal
font-variant:small-caps
5) font-weight - nagbibigay-daan sa iyo upang itakda ang kapal ng teksto (saturation). Syntax:
timbang ng font: bold|mas matapang|mas magaan|normal|100|200|300|400|500|600|700|800|900
Mga halaga:
- bold – itinatakda ang html font sa bold;
- mas matapang - mas matapang na may kaugnayan sa normal;
- mas magaan - hindi gaanong puspos kumpara sa normal;
- normal – normal na spelling;
- 100-900 – itinatakda ang kapal ng font sa katumbas ng numero.
font-weight: bold
font-weight:mas matapang
font-weight:mas magaan
font-weight: normal
font-weight:900
font-weight:100
html font property at kulay ng font
Ang font ay isa pang property ng container. Sa loob mismo, pinagsama nito ang mga halaga ng ilang mga katangian na nilayon para sa pagbabago ng mga font. syntax ng font:
font: font-size font-family | magmana
Ang halaga ay maaari ding itakda sa mga font na ginagamit ng system sa mga label sa iba't ibang mga kontrol:
- caption - para sa mga pindutan;
- icon – para sa mga icon;
- menu - menu;
- message-box – para sa mga dialog box;
- maliit na caption – para sa maliliit na kontrol;
- status-bar – font ng status bar.
Maraming naisulat tungkol sa disenyo ng uri, lalo na tungkol sa kasaysayan ng paglikha nito. Nabasa namin ang tungkol sa maraming mga diskarte para sa paglikha ng mga font. Ngunit saan, eksakto, tayo dapat magsimula? Kung ikaw ay isang taga-disenyo o ilustrador at ang disiplinang ito ay bago sa iyo, kung gayon saan ka dapat magsimula?
Nakakita kami ng kapaki-pakinabang na impormasyon na aming nakolekta mula sa maraming mga mapagkukunan at nagpasya na pagsamahin ang lahat ng ito.
1. Magsimula sa isang maikling
Ang paglikha ng isang font ay isang mahaba at maingat na trabaho, kaya napakahalaga na magkaroon ng isang malinaw na pag-unawa sa kung ano ang dapat na font na ito.
Ang pagbuo ng isang maikling ay tiyak na mangangailangan ng pananaliksik at pag-iisip. Paano gagamitin ang iyong font: kakailanganin ba ito para sa isang partikular na proyekto o para sa personal na paggamit? Mayroon bang problema na malulutas ng iyong font? Magkakasya ba ang iyong font sa isang hanay ng mga katulad na disenyo? Ano ang ginagawa nitong kakaiba?
Mayroong maraming mga pagpipilian. Maaaring gumawa ng mga font, halimbawa, partikular para sa mga akademikong teksto o para sa mga poster. Kapag alam mo kung paano magagamit ang iyong font, handa ka nang magsimulang magdisenyo.
2. Pangunahing pagpili
Mayroong ilang mga desisyon na dapat tandaan. Magiging sans serif o serif font ba ito? Ito ba ay sulat-kamay na teksto batay o higit pang geometriko? Idinisenyo ba ang font para sa teksto at angkop para sa mahahabang dokumento? O baka ito ay magpapakita ng teksto sa isang malikhaing istilo at mas maganda ang hitsura sa mas malaking sukat?
Clue: Ipinapalagay na ang disenyo ng mga sans serif na font ay mas mahirap para sa mga nagsisimula, dahil ang mga kakayahan ng naturang mga font ay mas tiyak.
3. Mga pitfalls sa mga unang yugto
Mayroong ilang mga pitfalls:
- Maaari kang magpasya na magsimula sa pamamagitan ng pag-computer ng sulat-kamay, na maaaring maging kapaki-pakinabang na pagsasanay sa pagsasanay. Ngunit dahil napaka-indibidwal ng sulat-kamay, maaaring hindi gaanong matagumpay ang iyong font dahil sa pagiging tiyak nito.
- Hindi mo dapat gamitin ang mga kasalukuyang font bilang batayan. Sa pamamagitan ng bahagyang muling paggawa ng isang font na pamilyar na sa lahat, hindi ka gagawa ng mas mahusay na font at hindi ka magpapaunlad ng iyong mga kasanayan.
4. Gamitin ang iyong mga kamay
Mayroong maraming materyal sa kung paano gumuhit ng mga font gamit ang mga programa sa computer, ngunit lubos naming inirerekomenda na iguhit mo muna ito sa pamamagitan ng kamay. Ang pagsisikap na gawin ito sa isang computer ay magpapahirap sa iyong trabaho.
Subukang lumikha ng magagandang mga hugis ng unang ilang mga titik sa papel, at pagkatapos lamang simulan ang computer work. Ang mga kasunod na titik ay maaaring idisenyo batay sa mga umiiral na hugis, ayon sa mga pangunahing tampok.
Clue: Sa pamamagitan ng kamay maaari kang gumuhit ng mas makinis, mas tumpak na mga kurba. Upang gawin itong mas maginhawa, huwag matakot na paikutin ang sheet ng papel sa paraang kailangan mo.
5. Anong mga karakter ang sisimulan
Ang paggawa muna ng mga partikular na character ay makakatulong sa iyong itakda ang istilo ng iyong font. Kung gayon, ang mga simbolo na ito ay gagamitin bilang mga gabay. Karaniwan, ang "mga control character," ayon sa tawag sa kanila, sa Latin ay n at o, at ang malalaking titik ay H at O. Ang salitang adhension ay kadalasang ginagamit upang makatulong na subukan ang mga pangunahing sukat ng font (ngunit isinulat ng ilan ang salitang ito bilang adhencion dahil ang mga titik s ay maaaring maging lubhang mapanlinlang).
6. Ilipat ang font sa iyong computer
Mayroong maraming mga paraan upang ilipat ang isang guhit sa isang computer. Inirerekomenda ng ilan ang pagsubaybay sa mga programa, ngunit mas gusto ng marami na gawin ang gawaing ito nang manu-mano upang magkaroon sila ng ganap na kontrol sa mga punto at hugis.
Maraming mga programa ang nangangailangan ng malinaw at makulay na disenyo, kaya kapag nagustuhan mo ang iyong font, subaybayan ito ng isang pinong panulat at punan ang mga hugis gamit ang isang marker.
Clue: Kung naproseso mo ang iginuhit na font tulad ng inilarawan sa itaas, maaari ka lamang kumuha ng larawan ng pagguhit at magtrabaho kasama nito.
7. Pagpili ng programa
Maraming taga-disenyo ang gustong gumamit ng Adobe Illustrator. Ito ay mahusay para sa pagguhit ng mga indibidwal na hugis at pag-eksperimento. Ngunit sa paglaon ay nagiging halata na hindi ito angkop para sa paglikha ng mga font. Gusto mong magtrabaho kasama ang isang programa na nagbibigay-daan sa iyo na magtrabaho kasama ang puwang ng titik at paglikha ng salita.
Ang isang mahusay na programa ay ang FontLab Studio, ngunit ang bagong software tulad ng Glyphs at Robofont ay nakakakuha ng higit at higit na katanyagan. Ang mga program na ito ay hindi mura, ngunit ang Glyghs ay may "mini" na bersyon sa Mac App Store na may ilang nawawalang feature, na hindi maganda dahil ang mga feature na iyon ay mahalaga para sa mga nagsisimula.
8. Paggamit ng mga programa
Huwag kalimutang iposisyon ang mga sukdulang punto ng mga hugis ng titik (itaas, ibaba, kanan, kaliwa) upang mas makontrol ang proseso.
9. Mga salita
Kapag natapos mo na ang lahat ng gawain sa pagpapakinis ng mga hugis, tingnan kung ano ang hitsura nito sa buong teksto. Gawin itong layunin na suriin kung ano ang hitsura ng font sa isang linya, talata, at iba pa. At huwag maghintay hanggang magawa mo ang buong alpabeto.
Isa sa pinakasikat na mga programa sa disenyo ng font. Available sa Windows at Mac.
Ang programa ay magagamit sa Windows, may isang madaling gamitin na interface at perpekto para sa mga nagsisimula.
Isa pang malakas na editor ng font mula sa FontLab na nagbibigay-daan sa iyong lumikha ng mga bagong font o baguhin ang mga dati nang font. Available sa Windows at Mac.
Gumagana ang program na ito sa Windows, Mac, Unix/Linux at naisalin na sa maraming wika. Pinapayagan ka rin nitong lumikha ng mga bagong font at mag-edit ng mga umiiral na.
OpenType font editor, available sa Windows at Mac OS X. Medyo simple at naglalaman ng sapat na bilang ng mga function.
Isa pang libreng tool kung saan maaari kang lumikha ng mga tuldok na font.
Isang libreng pagsubok ($9 bawat pag-download ng font) online na tool na hinahayaan kang lumikha ng mga font mula sa sulat-kamay na teksto.
Isa pang online na tool (halos $10 din para i-download) na nagbibigay-daan sa iyong lumikha ng font mula sa sulat-kamay na teksto.
Isang libre at medyo malakas na editor ng font. Mahusay para sa mga nagsisimula at sa mga hindi gustong gumastos ng pera sa pagbili ng software.
Available ang app na ito sa iPad at Windows 8. Nagbibigay-daan ito sa iyong lumikha ng font mula sa isang sketch at mag-edit ng mga kasalukuyang font.
Libreng tool para sa isang limitadong oras. Gamit ito maaari kang lumikha ng mga font at i-download ang mga ito.
Isang libreng online na tool na nagbibigay-daan sa iyong lumikha ng TTF at OTF na mga font mula sa sulat-kamay na teksto.
Mayroong libre at premium na bersyon. Ang programa ay tumatakbo sa Windows, Linux, Mac OS X at BSD.
Sa tutorial na ito ng artikulo sasabihin ko sa iyo kung paano lumikha ng iyong sariling font para sa isang website gamit ang mga icon na ikaw mismo ang lumikha. Ang kailangan lang natin para dito ay isang programa para sa paglikha ng mga vector graphics (Adobe Illustrator o Inkspcape) at pag-access sa Internet Kaya, magsimula na tayo! Maaari mong i-download ang lahat ng mga imahe, icon at css font na ginamit para dito sa dulo ng artikulo.
Para sa tutorial na ito gagawa kami ng isang bagay na simple. Para sa unang icon, gumuhit kami ng isang regular na bituin. Para sa pangalawang icon - isang agila na may letrang W sa loob. Ito ay medyo madali upang gumuhit at maaari kang lumikha ng anumang mga hugis at kumbinasyon. Gumamit ako ng ilustrador para sa mga layuning ito.
Pagkatapos mong matapos ang bahaging malikhain, dapat na i-save ang iyong nilikha sa SVG na format. I-click ang “Save As” at piliin ang uri ng file bilang SVG. Ngayon ay maaari kang magpatuloy nang direkta sa paglikha ng font.
Para sa mga layuning ito, ginagamit namin ang sikat at libreng serbisyong IcoMoon.
Ang unang bagay na kailangan mong gawin ay lumikha ng isang bagong proyekto, kaya mag-click sa menu sa kaliwang sulok sa itaas at i-click ang "Bagong Proyekto". Susunod, nilo-load namin ang aming mga yari na svg file pagkatapos mag-click sa button na "Import Icons". Pagkatapos makumpleto ang mga hakbang na ito, dapat mong makita ang isang imaheng tulad nito sa iyong monitor:
Ngayon ay mayroon na kaming kakayahang baguhin ang code para sa bawat icon (sa aming kaso ito ay magiging e600 at e601), ang pangalan ng aming font, ang CSS prefix, at iba pa. Ginagawa ang lahat ng ito sa "Mga Kagustuhan". Gayundin, makikita natin ang pagkilos ng font sa pamamagitan ng pag-click sa link na "Paganahin ang Mabilisang Paggamit" - na magbibigay-daan sa amin na makakuha ng pansamantalang link sa aming font, pati na rin ang opsyon na tingnan ang code sa CodePen.
Pagkatapos mong i-configure ang lahat, i-click ang button na “I-download” sa ibaba ng page at i-download ang archive. Sa archive na ito makikita mo ang iyong font sa ttf, eot, svg at woff na mga format + isang demo page na may font.
Paggamit ng mga icon sa site
Ngayon, ang kailangan lang namin ay isama ang CSS font gamit ang @font-face, at tukuyin ang iba pang mga parameter (lahat sila ay nakasulat sa css file sa archive na iyong na-download.
@font-face ( font-family: "wdm-eagle"; src: url("//yourwebsitename.com/fonts/wdm-eagle.eot"); , ( font-family: "wdm-eagle"; magsalita: none; font-style: normal; font-variant: normal; -smoothing: grayscale; ) .wdm-star:before ( content: "\e600"; ) .wdm-eagle:before ( content: "\e601"; )
Ngayon ay magagamit na natin ang ating font sa HTML code tulad nito:
Pagtukoy sa pangalan ng klase para sa tag makuha namin ang aming icon.
Pagod ka na ba sa pang-araw-araw na monotony ng paggamit ng mga regular na font? O baka mayroon kang ilang malikhaing ideya para sa iyong sariling font at estilo nito? Kung oo, gusto naming sabihin sa iyo na dahil may tiwala ka at sapat na malikhain, oras na upang simulan ang pagbisita sa mga libreng site kung saan maaari mong buhayin ang lahat ng iyong mga ideyang nauugnay sa font. Oo, tama, dahil maraming mapagkukunan sa Internet para sa mga graphic designer kung saan maaari kang magdisenyo at magdisenyo ng iyong sariling mga font. Sa hinaharap, maaari mong gamitin ang mga ito sa iyong sariling mga proyekto o ibahagi ang mga ito sa iba. Kapansin-pansin na may malaking pangangailangan para sa mga bago at kapana-panabik na uri ng mga font sa ngayon. Maniwala ka sa akin, kailangan lang ng graphic na mundo ng mga mahuhusay na developer ng font, at kung magaling ka dito, maaari ka ring kumita ng karagdagang pera mula dito.
Nag-aalok kami sa iyo ng isang listahan ng 10 libreng mapagkukunan na may mga tool upang matulungan kang maging malikhain at lumikha ng mga bagong malikhaing font.
Ang Bird Font ay isang online na tool para sa paglikha at pag-edit ng mga vector graphics. Nag-aalok ang serbisyo ng mga setting ng pag-import at pag-export para sa True Type Font (TTF), Embedded OpenType Font (EOF) at Scalable Vector Graphics (SVG). Sa site maaari mong tuklasin ang maraming mga posibilidad at mga tool para sa paglikha ng iba't ibang mga imahe ng vector. Ang pinakasikat sa kanila ay ang curve orientation, contextual linking substitution, kerning, object rotation, background change at marami pang iba.
Ang site ay partikular na idinisenyo para sa paglikha ng mga font at nag-aalok ng isang epektibong platform para sa kanilang disenyo. Ang mapagkukunan ay magiging kapaki-pakinabang para sa mga mahilig mag-eksperimento sa mga font at lumikha ng mga bagong uri. Sa FontStruct, maaari kang lumikha ng mga font gamit ang iba't ibang mga geometric na hugis, tulad ng mga tile o brick mesh. Bilang karagdagan, dito mahahanap mo ang mga yari na bagong uri ng mga font. Ang mga font na ginawa gamit ang FontStruct ay tinatawag na FontStructions at maaaring i-install o i-load sa isang True Type Font (.ttp) na file. Magagamit din ang mga ito sa Photoshop, Mac/Windows application o sa mga website at blog. Ito ay isang site na talagang sulit na suriin.
Ang Glyphr Studio ay isang disenyo ng font at programa sa pag-edit at tool na nag-aalok ng maraming kawili-wiling tampok. Sa Glyphr Studio, maaari kang lumikha ng sarili mong mga ligature ng character at glyph gamit ang iba't ibang tool sa pag-edit ng vector tulad ng panulat at pointer. Isa sa mga signature benefits nito ng serbisyo ay ang pag-import ng SVG code mula sa Inkscape at Illustrator Ang tool ay nag-aalok ng dual screen mode para sa madaling pagdidisenyo at pag-edit. Sa iba pang mga bagay, sinusuportahan ng Glyphr Studio ang mga font file gaya ng True Type Font (TTF), Embedded OpenType Font (EOF), at Scalable Vector Graphics (SVG) na mga file ng font.
Ang site ay isang tool na nakabatay sa browser para sa pagdidisenyo at pag-edit ng mga font ng bitmap. Binibigyang-daan ka ng serbisyong mag-download o mag-upload ng mga font sa kanilang gallery sa isang True Type Font file.
Ang MyScriptFont ay isang mahusay na online na tool para sa paglikha ng mga vector font batay sa iyong sariling sulat-kamay. Ang kailangan mo lang gawin ay i-download ang template sa PDF o PNG na format at pagkatapos ay i-print ito. Susunod, isulat ang teksto dito sa pamamagitan ng kamay, i-scan ito at i-upload ito sa website (sinusuportahan ng programa ang JPG, PNG, PDF at iba pang mga format). Maaari mo ring gamitin ang Paint para magsulat ng text. Hindi tulad ng iba pang katulad na mga tool, pinapayagan ka ng MyScriptFont na tingnan at i-download ang iyong sulat-kamay na font sa Open Type at True Type na mga format nang libre. Maaaring gamitin ang mga sulat-kamay na font sa mga graphics program, greeting card, logo, personal na liham at higit pa.
Ang FontForge ay isang online na platform para sa paglikha ng mga libreng font. Mayroon itong madaling gamitin na interface ng gumagamit at isang built-in na programa para sa paghahambing ng iba't ibang mga font. Sa FontForge, maaari kang lumikha at mag-edit ng mga font sa iba't ibang mga format, kabilang ang PostScript, SVG, True Type, Open Type at higit pa. Gayundin, sa iyong serbisyo ay ang buong teksto ng aklat-aralin, na tumutulong sa propesyonal na pagsasanay sa paglikha ng mga font.
Ang FontArk ang hinahanap ng bawat taga-disenyo ng font. Ang pag-access sa serbisyo ay libre lamang para sa isang limitadong oras, ngunit ito ay talagang sulit na samantalahin. Ang FontArk ay isang browser-based na programa at henerasyon ng mga tool ng font na may built-in na fluid grid system. Ang disenyo at mga tool sa pag-edit ng FontArk ang nagpapaiba sa site sa mga kapanahon nito. Nag-aalok ito ng mga user sa real time, ilang mga glyph, mga tool para sa pag-edit ng mga character at pagdidisenyo ng mga font, pati na rin ang mga logo. Bukod dito, nag-aalok ito ng maraming iba pang mga tampok at sumusuporta sa maraming wika.
Ang PaintFont.com ay isa pang mahusay na tool para sa pag-convert ng sulat-kamay na teksto sa mga vector font. Ang site ay may malawak na hanay ng mga yari na character na inuri sa mga kategorya tulad ng mga ligature, matematika at bantas. Nag-aalok ang tool ng mga glyph at simbolo mula sa iba't ibang wika: Japanese, German, Turkish, Hebrew, Spanish at iba pa.
Maaari kang lumikha ng mga font o mag-upload at baguhin ang iyong sarili gamit ang mga custom na tool sa Fontastic. Nag-aalok ang serbisyo ng ilang mga tampok tulad ng pagdaragdag o pagpapalit ng mga kulay, pagdaragdag ng mga anino, pagpapalit ng zoom, at pag-sync sa maraming device. Naglalaman din ang site ng malaking koleksyon ng mga icon ng vector na maaaring magamit para sa pagpapatupad sa alinman sa iyong mga proyekto sa disenyo. Ang mga ito ay pinagsunod-sunod sa ilang mga kategorya para sa kumpletong kaginhawahan. 
Ang serbisyong ito ay maaaring tawaging isang perpektong lugar para sa mga propesyonal na taga-disenyo ng font at mga baguhan lamang. Ang serbisyo ay may higit sa 20 mga parameter na nagbibigay-daan sa iyong mag-eksperimento sa mga built-in na glyph. Dito rin makikita mo ang ilang mga function sa pag-edit at disenyo, na palalawakin sa hinaharap. 
Ilan pang mapagkukunan na maaari mong makitang kapaki-pakinabang:
FontPunk.com ay isang libreng online na tool para sa pagdaragdag ng mga istilo at visual effect upang lumikha ng isang visually appealing font para sa isang advertisement, flyer o website.
FontConverter.org– libreng online na font file converter.
Font Squirrel ay isang libreng online na mapagkukunan na may koleksyon ng mga web font na lisensyado para sa komersyal na paggamit.
Konklusyon
Ngayon alam mo na ang pagdidisenyo ng iyong sariling mga font ay napakadali kung mayroon kang tamang mapagkukunan. Para sa mga do-it-yourselfers at hobbyist, ang mga mapagkukunang ito ay kapaki-pakinabang para sa pag-aaral ng mga praktikal na kasanayan tulad ng kerning, pagsasaayos ng mga curve, pag-aaral ng mga pagkakaiba-iba ng istruktura, at glyph packaging.
Ang disenyo ay isang malawak na karagatan, na lumalaki araw-araw. Ang mga bagong uri ng font ay ginagawa araw-araw, araw-araw man o sa pamamagitan ng paggawa ng mga custom na pagbabago sa mga kasalukuyang font. Pinapahusay ng mga font ang visual appeal ng textual na nilalaman at iyon ang dahilan kung bakit ang mga designer ay patuloy na naghahanap ng mga bagong estilo ng font upang gawing bago at makabago ang kanilang trabaho hangga't maaari.
