A Day Late & Half a Pixel Short

Victorian FanBoi

Available in 1440 X 900 and 2560 X 1440

Hiding Stuff in the Wrong Place

I discovered the Matting operations under the Layers menu in Photoshop thanks to the tutorial at the end of this mini rant. Everything else under that menu can be accessed by right clicking on layers, the layer panel or shortcuts.  I must admit I’ve not opened that menu for years.  Interesting to see this little gem hiding under there.

I assume that since Filters change pixels those Adobe people want to keep it separate from Transforms which move pixels.  However its always been a bit odd for me to go into the edit menu to change something about one of my layers. Likewise, it feels weird to go into the Layers menu to defringe a mask.

I feel like all the things that effect the appearance of the layer you have selected should be under the filter menu. Layer styles too.  The current arrangement makes totally logical sense when you’re looking at it on paper and trying to put things into groups, but when I’m using the application there’s no difference in my head between Edit > Transform > Warp and Filter > Distort > Whatever, yet they live in totally different places.

Silly Adobe.  Also, yeah, I know I’m crazy.

Anywho, heres the tutorial:

http://graphicssoft.about.com/od/photoshop/l/blrbps_2fwks.htm

Ringtones

A new song they’re playing on the radio reminds me of a song I had set as my girlfriends ringtone back in the day.  When I heard it play on the radio all these memories came rushing back to me, even though this is a different song, by different people.  Kind of cool what a few chords can do.

Ringtones are funny things.  I used to hear the song play whenever she was NOT with me.  I wanted to hear my phone play that song.  So much anticipation!

But at the end of the day, its a song that she never heard.  She doesn’t have the same association to it, or rather, has the same for a different song.

Instead of “Our Song” its kind of like we both had our own songs for each other.

Designing the NetNewsWire 3.2 icon

Here’s the process I went through making the NetNewsWire 3.2 icon. Everyone knows it’s tradition for 0.2 releases to get a new icon, so when Brent asked me to make him one I was excited.

It all started off with some sketches on the free paper I got from the Pickwick Hotel at WWDC. I decided early on that I didn’t want the icon to have a planet. I wanted to change the shape and make it more unique.

Note about first sketches:

RSS logo maybe? Nah.

Brent with a Pilsner glass?  Nah.

This is me playing with other shapes. All I’m trying to do here is get the idea floating around in my brain. I’m trying to find a good outline.

I decided on this design. I was happy at this point, but Brent seemed to think it needed a little more work (O rly? Grayscale 3D vector art isn’t good enough?). At first I was going to have it pointing down, but quickly changed direction — it felt impotent and sad pointing down. I did these outlines in Adobe Illustrator using 3D rotate and revolving an outline. Once the shapes were made I could twist and turn them any way I wanted.

I ended up deciding it was best to have it pointing up. I liked the shape better and it felt happier. Here’s me exploring that icon shape a little more. This is what I ended up with in Illustrator, before turning it over to Photoshop.

This pic has most of the shapes complete, but without all the love added. Brent’s only requirement was for it to look cool, so I worked with a lot of textures, shading, and light. Every little object and surface has some bit of texture in it, even if its just a little bit of noise.

Around this point, I decided to also start working on the iPhone version. So they could both be floating around in my head at the same time. I took the idea of the blue solar panel grids and threw it into an icon. A fine background for something, but not an icon by itself.

This was the point I decided to do those cool swirls. It started out as the RSS logo, then departed slightly. I enjoyed working for different platforms while creating these icons. It gave me a new set of constraints and made me think about the problem differently. I could take some of those things and put them back together with the desktop icon to make them both better.

I made a 2D satellite that complimented the desktop icon and threw it on the icon I made earlier.

The solar panel was too busy, so I put it in an orbit around the earth.

I went back in and made the big version of the iPhone icon, and made all the littler versions of the desktop icon. Each one gets massaged a little, layers get thrown away, things are redrawn. It eventually gets down to the 16 X 16 pixel ones. They’re so cute and little! This is where good color choice and shape pay off the most.

If I had just shrunk down the 512 version of the icon it would have looked like the mini icon on the right. While it’s technically an accurate scale of the bigger icon I made, it blurs and confuses the shapes I’m trying to get you to understand. The one on the right is much easier to look at, and looks cooler at that size.

The last step was to create a version without the orange signal for when a badge is displayed on the icon. The clash of orange and red was atrocious, this makes it much better.

Many thanks to Brent and the rest of the Sheep for their advice throughout the process. If anybody has questions or comments, email (address in website footer) or tweet at me: @BradEllis

Brad’s Desk Oct. 2009

Daring Fireball: How Should Mac Apps Be Distributed?

Hipster Brad

NO! THE ONE TO THE RIGHT!

VoodooPad’s Bucket Spills

Billy Mays Keyboard