Graphics | WebScienceMan

Posts Tagged ‘Graphics’

Posted on January 29, 2009 - by Khaled

The Beauty and the Web: Thoughts about the importance of the visual aspect in Graphic and Web Design

TRUE BEAUTY!, originally uploaded by Pureen.

This was a part of a longer article but it got righteously chunked from it by the publisher to whom I submitted the paper. I chose to post it here as it contains some points that deserve to be shared, and probably discussed, with you.

Nowadays it is obvious that images are very important for humans. On the net Images and graphical interface and presentation are very important components of most of the websites.

Having a well designed site with attractive images that can express a given message will make a huge difference for your visitors and that will probably lead them to have a better opinion about your site and you. The internet is becoming more and more visual, people are making sales or hiring decisions based on the looks and how much your products (and images) can be incorporated and nice to see in their daily life.

So even if you’re a top notch programmer or developer you will need a nice usable front-end! You can have the best of the applications developed but you won’t go far if it does not look good or if it is not useable! If you can’t do it yourself seek help. Graphic designer, artists, User experience designers (UX), Human-computer interaction (HCI) guys are just there for this.

Of course there are multiple definitions and interpretations about beauty and beauty in Graphic/Web Design. But there are simple rules to always respect. For some Graphic design is a type of art while for others it is just a tool or a medium to embellish web sites, web applications, software or documents and to guide the consumer while using them.

Almost everywhere and at anytime visual images are there trying to drag our attention and to persuade us of something! Or may be to amuse and impress us! And any Graphic or artistic web designer try to communicate a message through their production and through a given style they chose.
Another important point is the choice of the right colors palette for the right production whether it is a Web site, a print document or anything else. Colors are very important as they mean something! Yes colors are significant! Just remember that even the flowers colors mean different feelings and mind-sets. The same rule applies for Web and Graphic design. Choose the right color for the right product! Do your research in this field. Don’t create dark Web sites for young teenage girls! Yet don’t create flashy pink business cards for a CEO of a big company! I know I am pushing it to the limit but this is just to caricaturize the mistakes that can be committed when it comes to choosing the right colors.

Try to always be creative and innovative and to align your elements carefully to render something that is coherent and “beautiful” to see.
Just try to put as much time on your images and graphics as you put on your copy and texts. This will have a concrete effect on the way you are perceived by your visitors and potential clients.

The above posters about graphic design are taken from Veerle’s Graphic design poster competition.
Don’t forget to subscribe via RSS or E-mail. Or just follow me on Twitter

Posted on January 20, 2009 - by Khaled

Easily Create “Obama style” graphics with Photoshop

Easily show your support! This tutorial will show you how to use Photoshop to quickly turn your photograph into a graphic that has the “Obama style”. WIth Obama the internet was used at its fullest so this tutorial seems to be something in tune with his campaign! especially that today is his inauguration day. Start with your photograph, set the mode to CMYK.

Hit ctrl+M to pop up the curves window. Set channel to black, output to 70 and input to 35.

Then go to filter > Blur > Smart Blur. Set Radius to 2, threshold to 50 and quality to high.

Revert back to RGB Mode. Go to Image > adjustments > Gradient Map. Set the first color at location 0% (blue color: #03334c ), the second color at location 25% ( red color: #d91a21), the third point of the gradient at location 60% (color: #70969e) and the last one at location 100% (color #fce3a6). and hit OK. You will obtain this: