Videos tagged with Photoshop

We’ve all got ‘em. Those old faded, torn, scratched dusty photos that have seen better days. I found such a photo in my grandmother’s house and while most would have just pitched it, I decided to see if I could resurrect it in Adobe Photoshop CS2. While the end result was not perfect (still a work in progress), it’s a million times better than it was and is now in a pres...

Removing a background from an image is probably one of the most requested techniques in Photoshop. Luckily there are numerous ways to do it in Adobe Photoshop CS2. In this Podcast I’ll explore two ways to do it. One is pretty basic and the other one requires a little more finesse.

When you’re working on a website, the last thing you feel like doing is creating a separate graphic on every page where you want a header to be. However, if you want to use your own fonts, styles and special effects, you have to do it with a graphic. There would be no guarantee that the viewer of your site would have the same fonts as you do. Using GoLive and Photoshop you can create the ...

Make HTML pages in Photoshop and Dreamweaver. In this episode we show you how to slice a site design, and then export the resulting images and HTML. This is an ideal method for creating newsletters, as the resulting HTML is tables-based, and better suited to email clients.

We're back in Photoshop this week because I wanted to talk a little bit about a very specific skill that I think is important for all designers. That is the Pen Tool and using it to hand-draw clipping paths. There are a variety of ways to make selections in Photoshop, but drawing a real vector path is the most tried-and-true and highest quality way to do so. Mastering this tool will make you a ...

This week I take you through the creation of simple webpage to display your recent 'Tweets' from Twitter from start to finish. This covers the design in Photoshop, to including the javascript stuff provided by Twitter to the markup, to the CSS to style the page.

This episode is a prequal to episodes 12, 13, and 14. We go back to a blank Photoshop document and re-create it. There is no HTML/CSS in this episode, just pure Photoshop work.

We wrap up the mockup conversion here in Episode Three. We create the "article area" and the "sidebar" (semantic class naming!), and then we clear the float. We use Firebug to steal the typography from the live CSS-Tricks. Then we fix up the header a little bit in Photoshop and use CSS Image Replacement for the logo.

In Episode Two of this series, we continue on with the structure of the site. In Photoshop, we create the three different states of the menu, then slice them up and use the CSS sprites technique to create the rollover and "on" states for the tabs. We then create the main content area and footer.

There has been LOTS of great feedback on the first series of Converting a Photoshop Mockup into HTML/CSS. So let's do it again! Every website is different will require different conversion technqiues so there will be plenty to learn this time around that will be different from last time. The mockup we will be using here is a mini-version of the current version of CSS-Tricks itself!