WebDeveloper.com �: Where Web Developers and Designers Learn How to Build Web Sites, Program in Java and JavaScript, and More!   
Web Developer Resource Directory WebDev Jobs
Animated GIFs
CSS
CSS Properties
Database
Design
Flash
HTML
HTML 4.01 Tags
JavaScript
.NET
PHP
Reference
Security
Site Management
Video
XML/RSS
WD Forums
 Client-Side
  Development

    HTML
    XML
    CSS
    Graphics
    JavaScript
    ASP
    Multimedia
    Web Video
    Accessibility
    Dreamweaver
    General
    Accessibility
    Dreamweaver
    Expression Web

    General

 Server-Side
  Development

    PHP
    Perl
    .NET
    Forum, Blog, Wiki & CMS
    SQL
    Java
    Others

 Site Management
    Domain Names
    Search Engines
    Website Reviews

 Web Development
  Business Issues

    Business Matters

 Etc.
    The Coffee Lounge
    Computer Issues
    Feedback




Enhancing Designs - Chops

By Nick Ustinov My latest article on Airbrushed Interface raised very high interest among readers, and I was getting a lot of e-mails to describe the technique deeper. Here I continue airbrushed interfaces article series and introduce channel operations as a powerful tool. 1However, this article is targeted to advanced Photoshop users (and for Photoshop 4.0 only). You must know basics of Photoshop since if I explained it all here the article would be too long and hard to read.
If you use just Airbrush tool it's complex to control brightness of highlights etc. So here we will use layers for each highlight or shadow etc.
Key to success are properly shown lights. To draw realistic interface you should know how the lights are distorted and reflected on different materials (at least get some basic knowledge). You might want to read Shadows and Tones article (look under Practical Drawing Series) by Alex Birjukoff that gives some understanding on that.
Here are some examples of what you can achieve with chops and airbrush techniques. I made these images while working on this article.
2Main material we use here is plastic. It has soft shadows and reflexes. Reflex is a sort of highlight that is actually a reflection of surronding objects. The remote control on the example has shadows and a reflex but doesn't have a highlight area. One we will draw together should have shadows, highlight and a reflex.
First we create a channel that will containing the main outline. The good point would be to name every channel and layer we create so we don't mess up with that once we have many layers and channels.


HTML5 Development Center


Recent Articles