Medan du utformar ett teckensnitt som fungerar effektivt i olika storlekar med omsorgsfullt utformad brevskärning är en färdighet som kan ta flera år att finpussa, kommer det här snabba och roliga projektet att visa dig hur du kan skapa egna handstilfonter med Inkscape och fontastic.me, vilket ger du ditt eget unika typsnitt. Huvudsyftet med fontastic.me är att skapa ikonfonter för webbplatser, men du kan skapa ett teckensnitt med bokstäver som du kan använda för att producera rubriker eller små mängder text.
Om du inte är bekant med dessa är Inkscape en gratis och öppen källkods vektorlinjeprogram som finns tillgänglig för Windows, OS X och Linux. Fontastic.me är en webbplats som erbjuder en mängd olika ikonfonter, men låter dig också ladda upp din egen SVG-grafik och konvertera dem till ett teckensnitt gratis.
För denna handledning ska vi spåra ett foto av några skrivna bokstäver, men du kan enkelt anpassa den här tekniken och rita dina brev direkt i Inkscape. Detta kan fungera speciellt bra för dem som använder ritningstabletter.
Importera ett foto av din skriftliga typsnitt
Du behöver ett foto av några tecknade bokstäver om du vill följa med och om du inte vill skapa din egen, kan du ladda ner och använda a-doodle-z.jpg som innehåller huvudstegen A-Z.
Om du ska skapa din egen, använd en mörk färg bläck och vitt papper för stark kontrast och fotografera de färdiga bokstäverna i bra ljus. Försök också att undvika alla slutna mellanslag i bokstäver, som "O", eftersom detta kommer att göra livet mer komplicerat när du förbereder dina spårade bokstäver.
För att importera fotot, gå till Arkiv> Importera och sedan navigera till fotot och klicka på Öppna-knappen. I nästa dialogruta rekommenderar vi att du använder alternativet Bädda in.
Om bildfilen är mycket stor kan du zooma ut genom att använda alternativen i undermenyn Visa> Zoom och sedan ändra storlek på den genom att klicka en gång på den för att visa pilhandtag i varje hörn. Klicka och dra ett handtag medan du håller Ctrl eller Command-tangenten och den behåller dess ursprungliga proportioner.
Nästa kommer vi att spåra bilden för att skapa vektorgrafikbokstäver.
02 av 05Spåra fotot för att skapa vektorlinjebrev
Det är en bra idé att granska processen för att spåra bitmapgrafik innan du börjar.
Klicka på fotot för att se till att det har valts och gå sedan till Sökväg> Spårbitmapp för att öppna dialogrutan Spårning av bitmapp. Här lämnade vi alla inställningar till deras standard och det gav ett bra, rent resultat. Det kan hända att du behöver justera spårningsinställningarna, men det kan vara lättare att skjuta ditt foto igen med bättre belysning för att skapa en bild med starkare kontrast.
I skärmbilden kan du se de spårade bokstäverna som vi har dragit bort från originalbilden. När spårningen är klar kommer bokstäverna att placeras direkt över fotot, så de kan inte vara mycket uppenbara. Innan du går vidare kan du stänga dialogrutan Trace Bitmap och klicka på bilden för att välja den och klicka på Delete-tangenten på tangentbordet för att ta bort den från dokumentet.
03 av 05Dela upp spårningen i enskilda bokstäver
Vid denna tidpunkt sammanfogas alla bokstäverna, så gå till Path> Break Apart för att dela upp dem i enskilda bokstäver. Observera att om du har bokstäver som består av mer än ett element, kommer dessa också att delas upp i separata element. När det gäller vårt exempel gäller detta för varje brev, så det är vettigt att gruppera varje brev tillsammans i detta skede.
För att göra detta klickar du bara på och drar en markeringsmarkering runt ett brev och går sedan till Objekt> Grupp eller Tryck Ctrl + G eller Command + G beroende på tangentbordet.
Självklart behöver du bara göra det med bokstäver som innehåller mer än ett element. Innan vi skapar brevfilerna, ska vi omforma dokumentet till en lämplig storlek.
04 av 05Ställ in dokumentstorlek
Du måste ställa in dokumentet i en lämplig storlek, så gå till Arkiv> Dokumentegenskaper och i dialogrutan, ställ in bredden och höjden efter behov. Vi sätter våren till 500px med 500px, men idealiskt skulle du ställa in bredden annorlunda för varje brev så att de sista bokstäverna passar ihop mer snyggt.
Därefter skapar vi SVG-bokstäverna som ska laddas upp till fontastic.me.
05 av 05Skapa enskilda SVG-filer för varje brev
Fontastic.me kräver att varje bokstav är en separat SVG-fil, så du måste producera dessa innan du trycker på.
Dra alla dina bokstäver så att de ligger utanför sidokanterna. Fontastic.me ignorerar några element som ligger utanför sidområdet, så du kan lämna dessa bokstäver parkerade här utan problem.
Drag nu första bokstaven in i sidan och använd draghandtagen i hörnet för att omforma det efter behov.
Gå sedan till Arkiv> Spara som och ge filen ett meningsfullt namn. Vi ringde mina a.svg - se till att filen har suffixet .svg.
Du kan nu flytta eller ta bort första bokstaven och placera andra bokstaven på sidan och gå till Arkiv> Spara som igen. Du måste göra det för varje brev. Om du är tålmodig kan du justera sidans bredd när du går för att bättre matcha varje bokstav.
Slutligen kanske du vill överväga att producera punktsättning, men du vill definitivt ha en mellanslag. För ett mellanslag, spara bara en tom sida. Om du vill ha stora och små bokstäver måste du också spara alla dessa också.
Nu kan du besöka fontastic.me och skapa din typsnitt. Du kan lära dig lite om den här processen i en medföljande artikel som förklarar hur man använder fontastic.me för att skapa ditt teckensnitt.
