We start designing the top level (main) navigation of the site. We’re starting with the desktop size screen (at an admittedly arbitrary width) but we’re not worried that the navigation will have any problem adapting to a small screen.
We decide that icons are a pretty cool thing to use to visually distinguish nav links from each other. The last designed used images, but we’ll be smart and use an icon font. We’ll get more into that in the next video.
Organization of the Photoshop layers starts to happen. This is something we’ll have to stay on top of throughout the design process to keep our Photoshop sanity!
The shadowed top navigation links are somewhat inspired by my Kindle Fire. The browser on that has tabs which have a very strong shadow beneath them onto the next tab. It doesn’t look “real”, but I like it.
Around minute 11:44 – you could alt+drag the effects from layer on to another layer. This will duplicate the same layer styles and speed things up!
Thanks for the tip. I was watching the video and saying to myself I remember there was a faster way to do that.
Alternatively, you can also copy the layer style from one layer, select all the layers you’d like to apply the effect to (either using shift or cmd, depending on the proximity of the target layer) and apply the style to those selected layers via the contextual menu. This is even faster than dragging, and can be more accurate, as you can often (as I have sometimes done) accidentally drag the layer instead of the effect applied to it. This is also extremely effective when you’re working with large, complicated files and need to apply styles to layers which are nested deeply, far below the source layer, or out of range of an easy drag-&-copy.
I was going to say the same thing – copy layer style from one layer, select multiple other layers in one go and hit paste layer style :)
I like to use the Smart Object feature in PS for things like the navigation tabs or buttons. You create one tab, convert it to a smart object, then duplicate the smart object. The really nice thing about this route, is that when you change some layer styles of the smart object, all other duplicated layers inherit that change. No need to copy and paste layer styles on every update.
Smart Objects are almost like a ‘Module’ Chris! ;)