Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

product RED

macrumors newbie
Original poster
Jul 28, 2008
3
0
Hi,


I want to build a complete social networking website for practice. I already have the backend (php and mysql) and set up the frontend (html, css, js). However, I can't seem to find some good resource for making the web graphics? Backgrounds, banners, buttons, icons, etc. Anybody know of a good book or tutorial that helped them with this?

Any help is very much appreciated.

Thanks.
 
I assume you have some kind of program (Photoshop) that will help you do this? If thats the case, just do Google searches for tutorials and you'll come up with a plethora of results.
 
Adobe Fireworks, Flash and Dreamweaver all have tutorials available in book form or video. Layers Magazine print edition and website are a good source.
 
I'm not really sure what you mean i.e. getting to grips with illustrator/pshop etc or for inspiration.. either way, the key to good design is to simply immerse yourself in examples of good design. I tend to bookmark any & everything i see that looks cool, adds new functionality or I might think is useful in the future, it's all about inspiration.
In my experience it all begins with the logo as this paints the general aesthetic style for the rest of the site. From there it's about limiting your palette and font choices to create a seamless and well-formed concept.

logo/icon design:
http://www.fuelyourcreativity.com/50-kick-ass-logos-for-inspiration/

this may also be of help:
http://www.noupe.com/design/40-killer-typographic-posters-photoshop-effects-and-tutorials.html

corporate layouts:
http://www.smashingmagazine.com/2007/04/26/11-almost-perfect-business-layouts/

more generalized layouts:
http://www.smashingmagazine.com/2007/03/05/45-fresh-clean-and-impressive-designs/

usability and HCI:
http://www.smashingmagazine.com/2007/10/09/30-usability-issues-to-be-aware-of/

Hope that helps :D
As I said, it's all about immersing yourself in good design but also about understanding your target demographic and designing for them.
You say you've laid out the front-end which is good, but i'd be flexible in adjusting it's layouts as aesthetics and functionality are intrinsically linked so you can't really do one without the other.
 
Take a look at apple.com's navigation bar. Is that just good understanding of Photoshop or excellent sense of design/color?

Also, it seems like there a TON of tutorials out there for making "Web 2.0" style graphics.

Thanks to everyone who replied!
 
Take a look at apple.com's navigation bar. Is that just good understanding of Photoshop or excellent sense of design/color?

Also, it seems like there a TON of tutorials out there for making "Web 2.0" style graphics.

Thanks to everyone who replied!

Apple's nav is just preloaded rollovers with a gradient.. nothing special in the slightest although it is well executed. The AJAX search suggestion engine with thumbnails on the other hand is really quite impressive!
 
I was also looking for something to help me out too. Not so much the Photoshop aspect of it, but the design part i.e color, layout; just getting that good sense of design.

Any recommendations?
 
I was also looking for something to help me out too. Not so much the Photoshop aspect of it, but the design part i.e color, layout; just getting that good sense of design.

Any recommendations?

That's why we study it. It isn't as easy as just telling someone how to create graphics, balance, composition, etc.

It's just something that you need to experiment with and have fun with. Otherwise, nobody can necessarily "teach" you how to implement color layout and a good sense of design without having the knowledge of the foundations. Designers like myself, have studied this since day one in college and have worked in the field for quite sometime now.

NO offense, but just give it a whirl and play around. Have fun with it.
 
That's why we study it. It isn't as easy as just telling someone how to create graphics, balance, composition, etc.

It's just something that you need to experiment with and have fun with. Otherwise, nobody can necessarily "teach" you how to implement color layout and a good sense of design without having the knowledge of the foundations. Designers like myself, have studied this since day one in college and have worked in the field for quite sometime now.

NO offense, but just give it a whirl and play around. Have fun with it.

Is there a book or something that can teach me the foundations?
 
Is there a book or something that can teach me the foundations?

I'm sorry. I wasn't clear. I meant the foundations of art, art history, design & design history, typography, etc. There is soooooooo much to learn, that I'm afraid one single book won't cover it all. This is why I am over $30,000 in debt—man my diploma was an expensive piece of paper!

Anyway, my only suggestion is if you're wanting to learn about graphic design, learn as much as you can about typography. It goes way beyond what font is used for what, etc. I mean about the history of typography, etc. Perhaps I'm being biased here, but that's just what I recommend.

There are MANY resources out there—local library, book store, magazines, etc.

If you're simply wanting to design/create graphics for the web, without the use of funky/grunge typography or whatever, then just have fun. Use the pen tool in Illustrator and go to town!

Vector illustrations are the BEST!
 
I'm sorry. I wasn't clear. I meant the foundations of art, art history, design & design history, typography, etc. There is soooooooo much to learn, that I'm afraid one single book won't cover it all. This is why I am over $30,000 in debt—man my diploma was an expensive piece of paper!

Anyway, my only suggestion is if you're wanting to learn about graphic design, learn as much as you can about typography. It goes way beyond what font is used for what, etc. I mean about the history of typography, etc. Perhaps I'm being biased here, but that's just what I recommend.

There are MANY resources out there—local library, book store, magazines, etc.

If you're simply wanting to design/create graphics for the web, without the use of funky/grunge typography or whatever, then just have fun. Use the pen tool in Illustrator and go to town!

Vector illustrations are the BEST!

Typography is key.

Try getting your site to look perfect without any graphics at all.
For web design, look at "Don't Make Me Think" by Krug. That'll probably be the most straight forward book for strictly web design.

But if you can get a graphic design history book: do it!
 
Typography is key.

Try getting your site to look perfect without any graphics at all.
For web design, look at "Don't Make Me Think" by Krug. That'll probably be the most straight forward book for strictly web design.

But if you can get a graphic design history book: do it!

DEFINITELY!!! We used A History of Graphic Design by Phillip Meggs. I never resold it after graduation and still use it today!
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.