Graphics Artist for RepRap

I think this topic deserves a bit a more public place:



As you can see, Matt had the idea of adding buttons to the top bar of this forum. The most difficult part for us technicians: doing an excellent looking graphics. Ideally, one graphic with transparency between the buttons for the whole button-covered part of the bar.

Who's good in Gimp, Inkscape, Scribus and wants to leave a landmark in the RepRap universe? Please upload images right here, so we can cheer at you!

---

Generation 7 Electronics	Teacup Firmware	RepRap DIY

So are you asking for a PNG which has all the buttons in it and you are going to use an image map for the hyperlinks

Do you want the existing RepRap text as part of this image.

I'm not sure why you want to use just one image. It would be more search engine friendly if you didn't use graphics to contain text.

I've just save off the logo (I cut the attached image from your existing text) one with the white background and one with the background removed (however its still antialiased to white around the edge and I don't think these is an easy way to get rid of the antialiasing.

Can you just modify the html of the header line so that it has the logo graphic then the text for each item ?

Edit. Something like this [jsfiddle.net] (but with the image scaled smaller and the text changed size to match, and some general finessing of margins etc etc etc)

Edited 2 time(s). Last edit at 11/21/2013 10:41PM by rogerclark.

I tried to preserve the green color. (meh)


I ditched the color in favor of a cleaner look. (This is my vote.)

I have attached the svg and a render of the one image strip you requested. If this isn't exactly what you want we can modify from here.


For fun!

Quote

So are you asking for a PNG which has all the buttons in it and you are going to use an image map for the hyperlinks

Yes, exactly this is the plan. A single image is served faster than four distinct ones.

... writing this, images are reloaded from the server every 2 months only (unless you hit the "reload" button), so distinct images wouldn't hurt much, either.

Quote

It would be more search engine friendly if you didn't use graphics to contain text.

If you find a sufficiently reliable way to render in the right font, this should be possible, too. It's just a piece of HTML and possibly CSS which gets inserted. Currently, there's this:

<div id="logo">
    <a href="http://forums.reprap.org/">
        <img src="http://forums.reprap.org/templates/emerald/images/logo.png" alt="Phorum" border="0" height="25" width="111">
    </a>
</div>

together with this CSS:

#phorum #logo {
    height: 46px;
    background-color: #78ad78;
    vertical-align: bottom;
    background-image: url('templates/emerald/images/top_background.png');
}

@nichloas.seward: looks good already! Do people recognize these texts as buttons? Do you want them to be recognized as such?

---

Generation 7 Electronics	Teacup Firmware	RepRap DIY

This isn't as clean as the white one above but it is close. They definitely look like buttons. I have attached the svg and the rendered strip.

What do you think?

#phorum #logo {
    height: 49px;
    background-color: #78ad78;
    vertical-align: bottom;
    background-image: url('templates/emerald/images/top_background.png');
}

#phorum #logo img {
    margin: 3px 0 0px 16px;
}

This should drop the image in nicely.

Edited 1 time(s). Last edit at 11/22/2013 11:33AM by nicholas.seward.

I like both the one with white text, and the one with the buttons. Either one looks good to me! (Although upon reflection I think the buttons are actually my favorite).

How about both? I mean, the button to the forum is just a convention, because we _are_ already in the forum. The other ones are meaningful.

Where should IRC and magazine buttons link to? IRC to the wiki IRC page?

Magazine? No idea.

---

Generation 7 Electronics	Teacup Firmware	RepRap DIY

I was thinking IRC and Magazine.

#phorum #logo img {
    margin: 7px 0 0px 16px;
}

Only change needed in css.php

Haha! The change was posted at almost the same instant I upload the last post.

Quote

The change was posted at almost the same instant I upload the last post.

Looks like you were observer of the live event. For such small things I'm usually bold enough to do it right on the hot iron.

---

Generation 7 Electronics	Teacup Firmware	RepRap DIY

You're probably aware of this, but just in case the IRC and Magazine links are not activated.
Tks for adding the links +1

The links are working now. It looks great! Thanks everyone!