Topic: Ripper Report - Graphics (Page 1 of 3)

Ok, to make things a bit easier, I have opened this separate topic where we can concentrate some more on the graphical aspect of this project.

If I understand right, the graphic team for this project consist of myself, Bodhi and POI. But naturally we will also work more closely with Synax and Veneficuz, who make up the HTML team.

This is all very much still in the brain storming part of the process, and I am opening this topic for people to be able to throw in ideas for the design, without interrupting the general discussion.

Here are a few things I have gathered from the discussion so far:

Overall feel: RR is to be a serious site, dealing with a serious problem. The layout should convey a feeling of professionalism.

Design Purpose: The core of RR is the content. The purpose of the design is to facilitate the communication of the content. Much of the content is dynamic, and this need to be taken into consideration for the design. Some keywords
-simplicity
-fast loading
-useability
-attractive
-professional
-easy to read
-function

Color Scheme: Our "client" suggested a color scheme based on dark brown and red. I suggested using a dark burgundy (brown) can match well with red. And adding grey, black and white for a complete color scheme. As seen in this picture.

The color scheme is not yet settled. Ideas are still welcome.

Logo Design:
The logo should be in the colors of the color scheme.
Ideas so far:

• a "claw mark" as to symbolize the rip. Some people questioned this approach, saying that it has little to do with stealing graphics on-line. The project management agreed with this, and it was decided that this might not be the best way to go (is this right?)
• Beekay suggested: an icon with a faded out copy of it underneath to represent lifting a graphic from the original.
• DG suggested to emphasize Ripper, and tone down the Report part. Play with typography, maybe write Report vertically?

Things to do with logo design: play around with typography and colors. Does the logo need any graphic? What graphics are good?

The graphics can be posted in this forum, and/or be uploaded to the graphics folder at ripperreport.com. All the ideas so far is posted there (ideas for logo, color scheme and a simple mockup I made) They can be viewed here: http://www.ripperreport.com/graphics/

Very nice start Zox...and I am very interested on how you guys take this further...I really like the Burgandy brown...but that is just me.

As for the Logo...I like DG's suggestion...because it is professional, and serious.

Keep up the good work...

You forgot to mention the logo idea you had with the Save Target As... screen cap in it. Personally, I thought that was a pretty neat idea and should also be considered (unless of course it IS a rip of IE).

ZOX: Great stuff. A clean, usable, fast loading design would suggest a layout with a fairly conventional design - nav area, content area, etc. should we have a third area for login in, and other information?

All thoughts and ideas are welcome while things are still fluid.

___________________
Emps

FAQs: Emperor

I like the color scheme you have there Zox, I don't see a need, personally, to mess with a good thing...

Professional is good, in that interest, perhaps leaving the logo itself graphic-less may be better. Though, no one says that we can't keep the "Save Picture As..." idea in the pot, but since that is part of an already designed browser, we can't really call it part of the logo, right? And certainly, add appropriate images within the site itself to break up monotany...

WS, does it matter to you, being the "client" if we break the name up into it's 2 base words? Or do you envision the name as a one word deal... Ripperreport vs. Ripper Report, see what I mean? 2 words would give us a little versatility in the design.

No, not at all. You see, I agreed to let you all work on this...and I know how fustrating it can be in the graphics area working 'hamstrung'...I'm not about to make that mistake...I have full confidence in all your abilities...creativity should not be crushed, only guided...and I think you all have all the guidelines you need. So plug away! Just remember the guidelines...

As there seems to be no objection, I suggest that we finalize the color scheme that I posted earlier in this thread.
Or if anyone has any other ideas, please bring them forward here soon.

I think that the color scheme can be "extended" in the way that the whole monochromatic spectrum is covered.
Then different shades of grey can be used for any shading, shadows, highlights etc. that might be used.

As for the logo design, DG posted a good example in the other thread. I agree with him that simple is better, and we should concentrate on the typography rather than graphics.

I have made some spin-off's on the logo DG posted, and you can see those here: http://www.webwhirlers.com/logoideas.gif
The top left one is DG's idea.

So, what is good and what is bad? Please post your feedback and/or your own ideas for a logo.

ZOX: Yep that colour scheme is great.

OK numbers running from top left in rows:

1. Good

2. Good

3. OKish

4. Good

5. Good

6. OK

7. OK

8. V. Good

9. OK

10. My least favourite

I think 8 jumps out as being my favourite although 1, 2 and 4 all come close and I like what you've done with 5 but that white might be a little too much on the contrast front.

___________________
Emps

FAQs: Emperor

I also like #8...but it is a bit dark...the logo should be visible...however, I like dropping the 'the'...nice. Ripper Report...yeah, that's nice.

Good work, Zox.

#5 also appealed to me...

WS: I quite like the idea of having it dark. Its not 'in your face' but you know it is there. Anyway we'll see what everyone else thinks.

___________________
Emps

FAQs: Emperor

Thank you for replies and comments.

Since you both liked #8, I have gone ahead and made some variations on that. They are here: http://www.webwhirlers.com/logoideas2.gif
just so you can see what it could look like with the lighter color, and also using the idea DG had.

More comments and ideas are welcome!

ZOX: Nice - I like the bottom ones. I'm wondering if the text on the one on the right is a little too high and possibly the spacing between the letters in report is too wide. I suppose I'd like to to see slightly shorter, more closely spaced and chunkier text if that makes sense

I like the idea that the font colour matches the background as though the letters are punched out.

Good work.

___________________
Emps

FAQs: Emperor

Zox:
In the first group, I really liked #5... the white across the red really brought the whole design out....

But I do like #3 on the second set... I've not had any time to play much this week, but you seem to have it in hand...

Yup...from the 'new' ones...definetly the last two...though I think the 3rd one is best...

Good work, Zox!

Zox -
I'll be in Boston from Thursday to Sunday, but will have access to check the forum, just not to do any real work.
If you can let me know today what you'd like me to start working on, send me an email via my address in my profile I can get started on something for you tonight.
I'll download your color map also tonight and play around a little with the suggested layout. Anything I come up with I can post here. I jes' need a little direction...

Bodhi, more ideas for the logo are still welcome, and you can also work on the layout.
The layout I posted was just a first mockup, you can completely disregard it and work on something with a completely different look if you want to. The more ideas we have, the better. The menu does not necessarily need to be horizontal etc.
We also need a layout for the forum - deciding how we want to incorportate our color scheme. We might also want to make our own icons, and from just looking at the server, it seems there are almost 50 of those needed.
I have no experience with the PHPBB, but I imagine it is easy to replace the images and such. Or are there any finished templates that we can/are planning to use?

As for the logo, I made a slight variation on #3 from the last set I posted.
Here it is:

I guess my idea was to make it look like the edges had been ripped off. I guess this is going back to the "rip" idea in some ways, and maybe this is not the way we want to go. But since I just made it, I thought I'd go ahead and post it.

ZOX: There has been something nagging at me about the logo as if it needed something to pick it up slightly and I think something like that may be what we are looking for. Its certainly more engaging and I think it needs something like this. Try a few variations on that theme like making the rip actually cut into the logo (if you are ripping a piece of paper starting from the left the trailing end would tend to taper so you might want to slightly truncate the bottom left hand corner) or possibly even place it slightly off centre (as though it has been ripped and badly stuck in somewhere else).

[edit: oh and the top and bottom look a little too straight, like an old bus or cinema ticket, they would tend to be subparallel just not that perfect so you might want to play with increasing the size of the area ripped piece surrounding the logo lettering]

Although mentioned in the main thread I'll also add that CPrompt has agreed to be the graphics #2 and so you should have a bit more help here now Good to have you onboard

___________________
Emps

FAQs: Emperor

Zox - I like that last logo idea a lot, and my personal feeling is you've got that in hand. I've had a look at the forum that's up, and so I'll play around with layout styles and whatnot to see what else groovy I can come up with.

C:/ - so nice to have you on board!

bodhi23: I wouldn't do too much until the sites layout, colour and style has been decided upon and bear in mind that there are limits to what we can do without heavily rewriting the codes. You might want to look at the buttons and give a thought to the smilies (there are lots of them). Have a look through the user manual to see if there is a list of the smilies somewhere.

___________________
Emps

FAQs: Emperor

Just thought I'd throw this up, trying to picture what Emps was explaining:

synax: Nice - I think the bottom right one is certainly along the lines I was thinking of - the edges look a little too jagged though (more like a piece of wood rather than paper if that makes sense). I'm off to tear up a some sheets of paper and see if that gives me any ideas

___________________
Emps

FAQs: Emperor

Ooo, I just noticed that (the woodiness of the tears). It's most evident in the top corners...Stupid me Oh well, I'm not supposed to be doing graphics anyways.

*slowly backs away*

okey dokey. I just got Emps' email. I rarely check my Yahoo! account so . . .

Anyway, I love the color scheme and the new logo is starting really come along. I am going to do somethings to the mock up as well as the logo.

I don't know though, I think that last logo that ZOX did is really good.

We'll see.

be patient with me. I just installed a new hard drive and come across a new problem every day. Right now my Norton is gone.

Later,
C:\


~Binary is best~

CPrompt: Good to have you onboard - have a play with a few ideas - we may go with one of the earlier designs but see what comes up.

synax: We are still throwing ideas around and I have you on hold for the moment so you, or anyone else, should feel free to throw their ideas and thoughts in (there might be something great that we are missing). Once ZOX has come up with a more finalised version (I'm sure that isn't proper English) we can get the roles more strictly defined.

___________________
Emps

FAQs: Emperor

Good to see you join us Cprompt! I am eager to see what you can come up with.

Good work on the logos Synax. Personally I think they say more "cool photoshop effect" rather than "professional logo" but it is a nice effect all the same
Maybe the most realistic would be something in between our two attempts?

Actually Emperor, I was thinking of an old bus ticket or something of that sort when I made it, mainly because the typography remided me of that. I guess taking that train of thought even a bit further would be to make it look a bit worn, and less "perfect". But then that does not really have all that much to do with ripping web sites, does it?

I don't mean to be a mindless idiot but, what is it that you would like me to work on?
Looks like ZOX is doing a fine job on the logo, is it the layout template that you would like for me to work on?

I'm just a little lost

Later,
C:\


~Binary is best~

ZOX - Well, probably not, but the whole "rip" thing is there...

Ooo.. smilies... ok. Hmm... I'll have to give that a think! As far as layout went, I was planning on creating some variation of what has already been posted, but just a mock up of it in PS to see what direction we might need to go in, depending on how the code is to be written... Certainly, I wouldn't be trying to make a final design or anything... But the smilies would be more fun...

C:/ What are your thoughts on the smilies?

I thought I would have more time the first part of this week, but there's a lot to get done preparing for a trip. So actual images aside, my brain is turning!

[This message has been edited by bodhi23 (edited 07-02-2002).]

CPrompt: Basically at the moment we are kicking around idea for a logo. So have a play with any ideas that you have.

I am wondering if we might get a better idea if we saw it in a mock up of a layout. I have one of those niggling feelings that it needs 'something' but I'm not sure what (its one of those things that I'll know it when I see it ). DG's ideas certainly made me feel that it was on the right track. Some other ideas I had were:

1. Horizontally split the background colour (possibly with the two different background colours we have been playing with). Pos. put the divide between the word ripper and the word report.

2. Perhaps have a split colour behind the logo with the lettering cut out so you can see the 2 colours through the gaps.

but I don't feel they are right.

Its ZOX's call on who gets to do what but I would advise people not to do too much on the graphics/layout front until we are happy with the look and feel (that way you won't have to redo things - wasting your time).

___________________
Emps

FAQs: Emperor

OK, here's an update of things so far.

The color scheme is hereby *finalized* (yay!)

Our highest priority right now is the logo. It's been coming along nicely, and this is what we have discussed/agreed upon so far:
- Simple and professional
- Play with typography
- We have not settled on any specific font to use, but we seem to agree that a heavy sans-serif font is to prefer. In the ideas DG and myself have posted we have mostly used Impact, and personally I feel this is a good choice. It is a no-nonsense font with fits with the idea of a "report".
- Do we want to keep it very simple (flat colors etc) or does it need some "spicing up"? (like the ripping effect, or the idea Emperor suggested). Personally I think it is easy to go too far with the "eye-candy" things, but if done in moderation it can be good.
- BeeKay suggested "to educate and protect.? as the site slogan. Do we want to incorporate this in the logo? (or whatever the slogan ends up being, since this one is not settled yet, is it?)

These are four ideas that we seem to have liked the best so far:

What they all have in common is that they use the brightest red (#AA0000) against a background of the dark burgundy (#440000). Among the colors in our scheme I think this combination is the most natural, as it gives a good contrast, but yet not too much (such as the bright red against a black background might give). The only exception is the white in the bottom right one. What is your opinions on this?
Another thing they all have in common is the general shape - rather compact, with the width being around twice the height.
Maybe this is a bit backward way to work, but I suggest that we settle to use the colors in this way (bright red on dark burgundy) and keep the dimensions somewhat like this that way I feel we can go ahead and start working on the site layout as well.
Like Emperor said, it can be good to get to see what the logos look like when incorporated in a design, and with the background color and apporoximate size settled, it is eash to switch between the logos in the design ideas.
So, go ahead and work on mockup designs, if that is what you want

As for the forum,
If I understand right, it is hard to make much of layout changes. But as long as we keep the design as it is, it should not be very hard to change colors and graphics, should it?
Bodhi, if you want to go ahead and work on smilies, that is fine with me. You can see a list of all the default smilies here: http://www.ripperreport.com/forum/posting.php?mode=smilies
Just remember that we have not decided on the background color of the forum. And like with everything else, we are aiming for something more professional, so smilies that are mooning or throwing up are not of highest prioroty

ZOX: Thanks for the update - personally that simple one on the top right is winning it for me but I'm very interested to see if anyone can throw an innovative twist in there

On the forum front I'll make you a forum admin so you can see what is easy and what isn't, e.g. it is very easy indeed to change the colours you just create a new 'skin' and then enter the colours in the appropriate form inputs. It should give you an easy way of playing with the colours on a broader canvas without having to go into mocking up a page design (although you are welcome to do that as well. of course ). Anyway if you are signed up I'll enable that now and we can continue this over in the forum thread.

___________________
Emps

FAQs: Emperor

ZOX is right about the smilies - there are quite a range and we might actually want to trim down the number. As they currently stand I don't think they disrupt the line height too much and I think we should try and keep that as an objective for any new ones.

___________________
Emps

FAQs: Emperor

Yeah, I really like the top right one too. I think that incorporating a slogan underneath it would add really nicely, or would be off to the side somewhere?

I think that ZOX is doing a great job on the logos and I am not really sure that I could do anything better. I will still do some work this weekend and upload some things on one of my servers.



Later,
C:\


~Binary is best~

hmm... I agree with C:/ on this one. I think trying to incorporate a slogan into the logo would be too much.

The more I look at the logos we have, the more I like the simpler ones. It's more professional looking. The top 2 are good. I think within an actual layout, they would be more striking.

Thanks for the smilie link, I'll play with those this weekend. Here I was, striving to think up something professional for them, and now I've been told I can't use the puking one I'd finally figured out... dang! I'll see what else I can come up with...

OK, I guess we are getting closer with the top right one then?

I have uploaded a psd file for this here: http://www.ripperreport.com/graphics/rrlogo3.psd if anyone is interested in playing around with it.

I have also added the slogan to the logo, and below are versions with and without that:


Any comments on this? Keep it or not? Or do in some other way?

Since much of the graphics is dependent on the logo being set, and the HTML is depended on the graphics, I feel we need to push this a little.
I agree with Emperor that this looks like a good choice, but at the same time I am curious for whatever else someone could come up with.
I say we make this our tentative logo, and think about if we want to fine tune it some. And whether or not we want to have the slogan in the logo.

ZOX: I agree. The addition of the motto works well and it can be tweaked at a later date but it gives us enough of a feel to start moving ahead with the layout ideas.

All ideas welcome still

___________________
Emps

FAQs: Emperor

ZOX: Just some supplementary thoughts:

1. Kerning: It varies between the three layers which seems to me at least to create a slightly unbalanced feel - would have a more concistent gap between the letters look better (I notice DG's logo does it).

2. Vertical heights - There are natural ratios that just feel right (time for the Golden Mean to be rolled out?) and something like a 3:2:1 ratio (which is what you have there) seems 'right'. Any thoughts on that?

Emps

___________________
Emps

FAQs: Emperor

hmmm. . . I think I like the slogan underneath like that, but I agree with Emps that it "kind" of seems off balance with the kerrning.

This is just my observation and I am not even sure if this makes sense but. . .

See how the slogan text spans all the way out to the edge? And then the "Report", while smaller text, it is lined up with the "Ripper". Is this what is making it seem a little off, or does that make absolutley no sense?

It just seems that the text is getting smaller from top to bottom and since it is sitting on top of one another, it looks unstable.

Anyway. . .

Later,
C:\


~Binary is best~

Like Emps and C:/ suggest, try to kern the text so it lines up with the other words of the logo and let's see what it looks like. I'm not sure if I like the slogan as part of the logo or not. I think it might be more powerful if it was separate in the layout. IMHO.

I think I've latched onto an idea for the slimies, if I can get one done today here at work, I'll post it for shredding. It's no major change to the default ones... Just a little style. I'll get one up ASAP.

Thanks again for the feedback.
I think what you write is true. It does feel a bit unsettling.
I have done a few more variations, where I use the same kerning for the lines, and just extended the letters vertically in the "report". I've kinda been taught that you should never distort fonts in this manner, but it looks good to me...

The ratio for the width and height of the red box is now exactly on the golden ratio (it was pretty close before, just a couple of pixels off)

I have three version, one without the slogan, and two with it in different ways. To me the one where it does not reach all the way out to the sides feels a bit unstable.
In some ways I think I agree with Bodhi that both the logo and slogan will be stronger if they are not incorprated into each other, but displayed on different areas of the page.



comments?

#2 looks the business - I know what CPrompt means about the motto being wider than the text above but it works (at least for me). Changing the kerning (despite it breaking the rules ) and fattening the motto (as a product of that change?) has made a big difference.

[edit: I wonder if a line under the motto would work]

___________________
Emps

FAQs: Emperor