
Episode 056 - Web Badges
by heathenx
In this screencast I will demonstrate how to make small web badges for your web page to promote of your favorite project. I’ll be using Inkscape v0.45

Online Video:
Download
Tags: web badge
This entry was posted
on Friday, March 21st, 2008 at 9:08 am and is filed under Uncategorized.
You can follow any responses to this entry through the RSS 2.0 feed.
You can leave a response, or trackback from your own site.
March 21st, 2008 at 9:10 am
[...] Episode 056 I demonstrate how to draw a web badge. I have a few of these things plastered on my personal [...]
March 22nd, 2008 at 6:46 pm
I was under the impression that you’ve been using Ubuntu this entire time, not Suse. Am I wrong?
March 24th, 2008 at 7:17 am
I use Windows, Ubuntu and openSUSE on a regular basis but I rarely screencast on any of my Ubuntu machines. This particular screencast was recorded on my Windows machine at work. I sometimes screencast during my lunch break or after hours if I get the itch to do one.
My preference is to use openSUSE but it doesn’t really matter what OS I use to screencast on because it isn’t about the OS anyway…it’s about Inkscape. If I had a Mac then I would screencast on that too.
Confusing, huh?
March 28th, 2008 at 11:51 pm
These remind me of the userbars I use to make in the gimp.
April 3rd, 2008 at 8:04 pm
why the picture so different?
April 4th, 2008 at 9:04 pm
Nice!
Thanks to you and Richard I am finally quite comfortable with Inkscape and I am now using it to help with my little business, Thanks again!-Patrick
April 5th, 2008 at 6:10 pm
Thanks for the next great tutorial. If I could suggest the content of the next screencast - I would love to see some tips about brand new features of Inkscape 0.46. I mean especially filter effects and live paths - those seem to be very powerfull but I’ve found them hard to use and poorly documented.
April 25th, 2008 at 4:16 am
Thanks for the whole screencasters site and the tutorials. I’m just discovered them and have a lot of material to see and digest.
I think there is a flaw in this particular tutorial. The font silkscreen is designed to be pixel-aligned when resized to a height of 5 pixels. However, you break this alignment when manually alter the kerning. Doing this way, each letter does not begin at pixel boundary, which causes aliasing (it can be observed when you zoom to 200% in the bitmap viewer). This is why the text is so difficult to read.
If you do not insist in the text being inside the red boundary (why is this? We still have plenty of space in the light gray rectangle), you better do not alter the kerning, and simply shift 1px to the left the whole text, in order to have it right-aligned with the light gray rectangle. Doing so, no aliasing occurs in the font and the resulting bitmap has better legibility.
Another tip: instead of using the alignment buttons, and pixel displacements in order to place the elements, I prefer to activate the grid snap, and set the grid spacing at 1pixel. This way I can move more freely the shapes, and still being pixel-aligned.
April 25th, 2008 at 7:27 am
Excellent tips JLD. When making these buttons in the future I will keep those things in mind.