I’ve seen a lot of drama over new site designs claiming to have been “inspired” by great site designs. I’ve also seen quite a few complete ripoffs. It seems that imitation being the best form of flattery has been taken to a new extent and that some great designers are getting their sites totally ripped off in the name of inspiration.
Not only are the site designers dishonored by a complete rip-off, but the designer attempting to design by “inspiration” gets their name smeared. The design community can be brutal ;) Honestly, some of these inspired designers have the best intentions. They are starting out and mean the best. I earnestly never want to see a good designer get their name smeared in the name of inspiration.
I thought I’d share with you how I have been inspired by sites, movies and products for my last redesign of Komodo Media, version 4. I hope that through this designers can learn to be inspired by all great art forms around them, but maintain a style of their own.
Base inspiration
Click on a thumbnail for a larger version.
It’s very obvious what Komodo Media version 4 is on the whole. Thematically, its very jungle and islandish in nature. From wood to leaves to toucans to outriggers, it feels like you are lost in a jungle. Thats the intent. My inspiration came from a mixture of a love of Swiss Family Robinson and Pirate/Jungle movies as a child as well as a few visits to the Enchanted Tiki Room in Disneyland.
Once I knew the theme, I went around the internet gathering all imagery that I felt represented this theme well. I didn’t want to clone them. No, I just wanted to surround myself by the kind of things that spoke “jungle” so that I could design in that style. It has become a pretty regular process now for me to gather a ton of screenshots or images of inspiration and surround my design with them as I design.
Inspiration in the details
Infinise Design
In earlier mockups of Komodo Media v4, I used tabs that were inspired by Infinise Design’s tabs. I loved the smooth rounded edges that were slightly non-typical in websites I’d seen around the block. I ended up moving to the recessed wood pill-shaped navigation that you see now.
Bear Skin Rug
In earlier versions of the my mockups, I used an accordion style post browser in the right sidebar featuring popular, random and recent posts as well as categories. Something always felt wrong with it and it seemed a bit too narrow as well. My tabbed based solution was inspired by Bear Skin Rug’s beautiful sidebar tall tab implementation. I just loved it.
Command-Tab
As I was working on my mockups for Komodo Media v4, a good friend and fellow designer, Collin Allen was working on the new version of his site, Command-Tab. I was fortunate enough to see mockups of his navigation and fell in love with his hammer icon for his primary navigation. The other icons were nice, but the hammer icon…oooh, I loved it. That one icon inspired a total reworking of my main navigation and helped to inspire my icon, inset in the wood, pill styled primary navigation.
The Guinness Toucan
I like to make my designs mean something, especially my own site. I love Guinness. I was trying to think of a classy way to work Guinness into the site that didn’t scream beer drinker or drunkard. That’s not my bag and its not me. I remembered an old ad campaign that Guinness used to run using a toucan and that was it – I was sold. I quickly reworked my version of the toucan using Fireworks. You can see the Guinness toucan flying in the header, squawking next to my twitter stream, perched atop the outrigger in the footer, and adorned the mail stamp when you use the contact form.
Apple Mail
It’s been said a time or two before. Working in a creative and well-designed environment inspires design. For the longest time, I couldn’t put my finger on it. Finally, I realized why I loved working on my Mac. Every part of the interface feels aesthetically right and those aesthetics inspire me. In this case, I loved Apple’s mail.app icon so much, I designed my contact page stamp to match.
Super Mario Galaxy
At the time of my redesign, I was playing Super Mario Galaxy quite a lot. I love the Mario series and this game was no exception. Once again, I love tying elements of me into my design. I decided to keep this one subtle as well and designed the 5th star rating on my blog posts to be the luma from Super Mario Galaxy.
Veerle’s Blog
I guess one could say that a lot of things about Veerle’s blog inspired this fourth design of Komodo Media. I’m not going to say yes or no to that, but I do know that one element of Veerle’s design inspired me: the calendar icon. So I took her great design concept and made it my own…island style.
Apple iTunes
I guess I’m an Apple tool, but once again I got inspired by another OSX program, iTunes. You’ll find the result of my inspiration in two places. First, the pill shaped search box, albeit a grainy inset wood is inspired by the search field in iTunes. Second, my trademarked uber-awesome foliage-O-meter dons a knob that many have recognized to look very similar to the volume knob in iTunes, with a very different purpose. Apparently I feel that knobs to control the density of the jungle is on par with volume level. *snicker*
Hicksdesign
I’m sure a ton of things about Jon Hicks’ site inspired me during the redesign, however one very obvious inspiration is typography. Gill Sans for headers? Check. Lucida Grande for content? Check.
Inspiration comes from many places and over time. I encourage you to dig deep and look all around you for inspiration for your design. Don’t limit yourself by merely copying a site. Be inspired by others’ work and adapt and rework it to make it your own, bringing recognition to your own skills and honor to whom you are inspired by.
It’s nice to see someone explain design decisions in a blog, rather than simply writing a ‘Here’s 20 cool designs’ type of post.
I love the fact that your inspirations came from all-over, and not just the web.
Cheers for the insight!
Nice stuff Rogie – if i had to summarize your site in one word before this post, id have probably thought of Disney tbh! Although Robin Hood is my fave!
Its essential designers get the right mix of inspiration and just plain stealing. I think you’ve probably covered it all in this post dude.
Getting away from the ‘puter screen i think is probably the biggest thing for me in being original. Inspiration can come from anywhere, litterally!
My own divlets (yodiv.com) are a direct nod to the doozers in fraggle rock. Shhh you heard it here first.
Great stuff as always Rogie!
You probably got most of your inspiration from your boss. I hear he’s a design super star.
Well, you already know what I think of your site from past comments, if I repeat myself it may cause your head to blow up.
But reading the inspiration, and shall we say, it is pretty detailed makes what I think all the more validated.
So, a bow to you sir.
Graham
Cool! Glad my stuff inspired you, even though I’ve yet to actually implement all of it :)
I do love me some mini icons!
This is awesome :) Great article mate!
interesting….
in my view this inspiration is an innovative!
M.A.Yoosuf
http://yoosuf.awardspace.com/
This is a great post, I spend lots of time trying to find out how sites are designed and the process that goes into them.
I also love that designers share this information because this is the most important part of inspiration, so many people want to copy that great design they saw but by telling people to search for other sites around that theme is great advice.
I am also very interested in the process of remediation in all aspects of design and film.
Thanks for the post!
I have to say, Rogie, your inspiration is the right kind. What most people call inspiration today is more like what my daughter calls tracing paper over coloring book.
You’ve clearly developed an internal listing of ELEMENTS that inspire you and you’ve worked them into a WHOLE on your own.
It’s interesting to note, too, that very little of your inspiration appears to come from the same design arena. In other words, you’re finding elements in print, movies, software, and other media whereas many people are getting inspiration for a website design only from other websites. That makes a HUGE difference in my opinion.
And for the record, I never had a clue where your inspiration came from until reading this post, and even now, it’s a strain to see direct similarities.
Well done.
Speaking of inspiration, the footer of my site was inspired by your beautiful Last.fm widget-thingy. Except since I am a big 80s geek, I used cassettes instead.
in order to get your random, tags etc box on your site, where did you find the JS for it? or is it bespoke?
very well said. inspiration shouldn’t only come from looking at websites it should come from everything!
Tasteful…intriguing images…easy to navigate… every click is like an adventure, I can’t wait to discover all the features of your site…
@Rebecca McNelly – Thanks a ton! I hope to soon be trying the coffee that you have recommended.
I very like your design in the Komodo Media. So My blog inspired by this site. i say thanks for that . I’m say so sorry because there are a few items of my blog ripped this site. But soon i will remove that.
@Yustian I don’t mind you being inspired at all. That is what I hope that my designs do as well as any other web craftsman’s work. Thank you for taking down the ripped work and I appreciate your promptness in this matter.
Hey Rogie,
I know I am a little late on this article, and you have heard this so many times before, but I was just so inspired. Not only is your website an extremely well designed site, but showing your workflow and how you get your inspiration has really helped me with future designs. I find myself picking out subtle elements that are ‘me’ and applying them to my designs. Thanks for being such an inspiration and great contributor to the design and development community. Rock on!
Regards,
Drew
nice article ^^
i love the fifth star :)
hello there, from a fellow uber-nerd who did indeed view your source code ;) I thought that bit was quite clever and cute, you made me laugh. Anyway I just wanted to say I have admired your site since I discovered it several months ago and that YOU are a source of inspiration to me. Keep up the wonderful work!
P.s. I agree, the fifth star is cute! It’s the details like that that make a good site great :)