Graphically challenged

May 14, 2010 16:12

Seeing as I'm not working at the moment, I thought I should make the most of the free time I have to update my website. It's not been touched for the past 12 months at least so it's seriously overdue one. The thing is, when I was doing the Trans Youth Worker job, one of my tasks was to update the organisation's Trans website. It was totally craptastic in a multitude of ways (no real information for one thing and what info it did have was US-based and mostly for MTFs) so it really needed a complete overhaul. I spent a lot of time writing code and making graphics for it. As much as I enjoyed doing that, one of the downsides was that my own site fell by the wayside because after spending several hours coding a page for work's website, the last thing I wanted to do was spend more timing coding for my own!

Now that I'm not doing that job either, working on my website has regained it's appeal. I've started on the writing side of my site first because it's a bit smaller and needed less doing on it. One of the pages I really wanted to sort out was the Links one. It's basically a list of other sites that my writing is on and so that it's not just a page of text, I've included each site's logo. However, all the images are different sizes and there's not much else on it so it looks dreadful. I had a bit of a think and thought that it would look better if all the logos were the same size for a start. So, I fired up the GIMP and set to.

One of the sites I'd listed was LJ because I have a writing journal on here. The original logo I was using was this one:


I wanted a version of it that had the pencil icon next to the name as the logos for all the other sites were that shape. A quick Google brought up this version:


As well as being the right style, it was also a good size. And as a bonus, it had rounded corners too! Using that as a template, I made all the other logos the same size and with the rounded corners. They all looked much better that way but I wondered if I could make them look a bit more exciting. The buttons I'd made for the Trans website had a grey metal-style border which seemed like a possibility. After some playing around to strip the border off and make it the right size, I had this:

which then went very nicely onto the logos to give this:

Much better! I was well chuffed, I can tell you. Certainly a great improvement already on the original image I was using. But I wondered if I could make it even better. I quite like the glassy look icons that I've seen on various other sites so had a Google to see if I could find any instructions. I did, but I also found that the person who wrote them had made up 3 InstaGlass gradients for the GIMP as well. Bonus! I installed them and after playing around to find the right look, I now had a nice glassy layer to add to the images. Well, once I'd got the it scaled so it only covered the logo and not the border and rounded all the corners to match. And this is what it looked like once all that was done:


And with that I was satisfied. I'm quite pleased with what I've managed to do there, and I'm not easily impressed. I know I cheated a bit by using the InstaGlass gradient rather than making up my own but it was so much quicker!

Kind of a shame I couldn't make a living out of doing websites and graphics, I don't think I'm too bad at it and I do enjoy it.

in which nathaniel is arty, my website

Previous post Next post
Up