PDA

View Full Version : Good Designers Copy, Great Designers Steal



bahattab
18-12-2007, 12:15 PM
http://www.atyafonline.com/vb/imgcache/454.png (http://www.sitepoint.com/)
Empowering Web Developers Since 1997


SitePoint Sponsor






Article

Home (http://www.sitepoint.com/) » Design and Layout (http://www.sitepoint.com/cat/design-and-layout) » Design Principles (http://www.sitepoint.com/subcat/design-principles) » Good Designers Copy, Great Designers Steal
Highlight On (http://javascript%3Cb%3E%3C/b%3E:highlighton%28%29;) Highlight Off (http://javascript%3Cb%3E%3C/b%3E:highlightoff%28%29;) Print (http://www.sitepoint.com/print/copy-great-designers-steal) Email (http://www.sitepoint.com/email/copy-great-designers-steal)

Cameron Moll

http://www.atyafonline.com/vb/imgcache/455.png Cameron Moll is a freelance new media designer, with a passion for functional Web design, clean markup, and savvy print design. Some say this (http://www.cameronmoll.com/about/cameronmoll_bio.pdf) sums things up quite nicely. Others say his web site (http://www.cameronmoll.com/) does the trick.
Cameron Moll has written 2 articles for SitePoint with an average reader rating of 8.7.
View all articles by Cameron Moll... (http://www.sitepoint.com/articlelist/280)


Good Designers Copy, Great Designers Steal

By Cameron Moll

June 9th 2003
Reader Rating: 8.7

Pablo Picasso, the first living artist to be featured in the Louvre, influenced the artistic world in a uniquely original way. So why is he known for saying “Good artists copy, great artists steal”?

It’s true. Picasso really said, “Good artists copy, great artists steal.” Or at least, since his death in 1973, everyone believes he said that.
But why? Why would someone as original as Picasso say something as ironic as that? And what did he mean? Google Picasso’s quote, and you’ll find plenty of opinions and interpretations as to what he really meant.

My intent here, then, is to uncover one possible interpretation. This interpretation involves three levels of design, each of which:

involves some aspect of copying or stealing,
shows increasing design maturity, and
adapts Picasso’s quote to modern graphic design.

Three Levels of Design

To help you understand my reasoning, I’ve segmented this interpretation into three levels. Are these the only three levels of design? Of course not. They’re only a guide to help improve your design maturity as related to copying and stealing.
I’ve included short case studies to effectively demonstrate the primary concept at each level -- at least, that’s the intent. You be the judge as to whether or not they’re effective examples.
http://www.atyafonline.com/vb/imgcache/456.png


Level 1: Copy, Don’t Create

I'm all for being as original as possible, but a beginning Web designer (or any designer, for that matter) should start out by copying other well-created designs.
Gerry McGovern, Web copywriting guru, makes the same argument for writers:
One of the simplest tricks that professional writers learn can greatly ease the process of getting ready to write: look for a model of the kind of article you need to do, then dissect it, analyze it—and copy it. . . . Novice writers often make two mistakes: they think they need to be entirely original, and they think they need to wait for “inspiration.” Take it from the pros: for most kinds of writing, originality and inspiration are overrated.
Replace the instances of “writers” and “writing” in Gerry’s quote with “designers” and “Web design” and the message is the same: copy, don’t create.
Surprisingly, there’s a positive side effect to copying: conventionality. Building on the same foundation as other sites -- specifically, layout and information architecture -- often leads to intuitiveness and familiarity for the end user. By no mistake do BarnesAndNoble.com (http://www.bn.com/) [1] and Amazon.com (http://www.amazon.com/) [2] have similar navigation structures.
Additionally, if your career is anything like mine, you hardly ever enjoy the luxury Michelangelo relished as he expended four long years completing the Sistine Chapel ceiling. Often, we have only four months -- more likely, four weeks. So, in a commercial art environment such as Web design, copying is almost mandatory, given the time constraints and budget limitations we face.
Case Study
The source:
http://www.atyafonline.com/vb/imgcache/457.png
The result:
http://www.atyafonline.com/vb/imgcache/458.png
IDI’s corporate Website, created over two years ago, exemplifies Level 1 design very appropriately. Most of us working on the project at the time -- including myself, the Art Director -- had less than two years of Web design experience. We needed a polished source to act as the foundation for the layout of our site.
After hours of searching, we found that Nike’s Canada Website was the perfect fit. The design style was technically appealing. The layout architecture was simple, yet strong. The only thing lacking was additional text to draw visitors in.
So we took Nike’s design and ran with it. You don’t have to struggle to see the adapted result is close to the original source.
Level 2: Steal From Yourself

Simply put, one of the best sources from which you can steal is yourself.

Think about it. You probably have a folder on your hard drive that contains dozens of designs that were never used or completed. You’ve created designs that have been a success with clients. And more importantly, your distinctive design style is probably a selling point for many of your clients.
Why not tap into some of the great work you’ve created that was either unused or never fully completed? Or even better, reinvent some of your work that was highly successful in establishing your personal style?
Case Study
The source:
http://www.atyafonline.com/vb/imgcache/459.png
The result:
http://www.atyafonline.com/vb/imgcache/460.png
The final design for the ARRAY (http://www.sitepoint.com/glossary.php?q=%23#term_72) [3] Website was the result of discarded design usage. The QuicksiteBuilder layout was created a few years ago, but never made it past the comping stage (notice the filler text and Rubberball watermark on the comp graphic).
Instead of starting at ground zero with the ARRAY Website -- which did make it to production -- I chose to create the layout using elements from the unused QuicksiteBuilder comp design. QuicksiteBuilder and ARRAY are similar products, making a ‘steal’ the ideal solution. The style established by the photo of the woman, the headline and sub-headline, and the three column highlights were all a direct result of personal stealing.
Level 3: Steal From Discrete Sources

A good design friend of mine, Jesse Bennett (http://www.31threedesign.com/) [4], adorns his signature on message board posts with a quote by Albert Einstein: “The secret to creativity is knowing how to hide your sources.”
Perhaps the easiest way to ‘hide’ your sources is simply to use sources that are already hidden.
“Picasso hardly meant that great artists steal popular designs whose original source is known to everyone,” says Wes George, writer for The Mac Observer and financial Mac nut.
“What Picasso did mean was that great artists rummage through the great junk heap of lost, bypassed, and forgotten ideas to find the rare jewels, and then incorporate such languishing gems into their own personal artistic legacy… Picasso implied that great artists don't get caught stealing because what they appropriate they transform so thoroughly into their own persona, that everyone ends up thinking the great idea was theirs in the first place.”
Level 3 entails the difficult process of searching through magazines, books, Websites, historical artifacts, cultural compositions and other rich design sources to locate those unused and forgotten ideas Wes speaks of.
Case Study
The source:
http://www.atyafonline.com/vb/imgcache/461.png
The result:
http://www.atyafonline.com/vb/imgcache/462.png
Recently, I was asked to design the logo for a T-shirt to be offered to IDI’s Quality Assurance (QA) department.
The design for the logo shown above was ‘stolen’ from MasterClips’ vector clip art collection. As I thumbed through the catalog, I somehow landed on the clip art shown in red. Although created years ago, the looped design had a trendy Generation X feel to it -- exactly what I was looking for, as the majority of the QA department were Gen X’ers.
The chances of someone else having used this particular piece of clip art were very slim. And the chances of the intended audience -- or anyone else for that matter -- being familiar with such a piece were even slimmer. Translation? A perfect source for stealing.
A Warning

This article wouldn’t be complete without a warning to be careful when copying well-known sources. If I were to summarize this warning in one sentence, this would be my golden verbiage: copy the inspiration, not the outcome.
For example, since the introduction of the iMac, Apple’s design has been inspired by a very liquid and visually tangible look and feel, coupled with a “less is more” attitude.
A beautifully rendered copy of the inspiration behind Apple’s design leads to something like MailFrontier.com (http://www.mailfrontier.com/) [5]
At the opposite end of the spectrum, a horribly blatant copy of the outcome of Apple’s design leads to something like uSight.com (http://www.usight.com/) [6]
In short, be careful what you copy, and how you copy. Take the time to make the design your own, or you’ll land a spot as the latest design thief on Pirated-Sites.com (http://www.pirated-sites.com/) [7].
Bibliography

Picasso Resources
http://www.picasso.com/links (http://www.picasso.com/links) [8]
Quotations by Pablo Picasso
http://painting.about.com/library/blpicassoquotes.htm
(http://painting.about.com/library/blpicassoquotes.htm)[9]
Piracy Against Apple, It's A Cultural Thing, Wes George
http://www.macobserver.com/columns/appletrader/99/august/990823.html (http://www.macobserver.com/columns/appletrader/99/august/990823.html) [10]
The Web Content Style Guide, Gerry McGovern
http://www.gerrymcgovern.com/guide_write_08.htm (http://www.gerrymcgovern.com/guide_write_08.htm) [11]
MasterClips Vector Clip Art
http://www.masterclips.com (http://www.masterclips.com/) [12]
ARRAY
http://www.webofficesolutions.com (http://www.webofficesolutions.com/) [13]
Pirated-Sites.com
http://www.pirated-sites.com (http://www.pirated-sites.com/) [14]

Back to SitePoint.com (http://www.sitepoint.com/)
[1] http://www.bn.com
[2] http://www.amazon.com
[3] /glossary.php?q=%23#term_72
[4] http://www.31threedesign.com
[5] http://www.mailfrontier.com
[6] http://www.usight.com
[7] http://www.pirated-sites.com
[8] http://www.picasso.com/links
[9] http://painting.about.com/library/blpicassoquotes.htm
[10] http://www.macobserver.com/columns/appletrader/99/august/990823.html
[11] http://www.gerrymcgovern.com/guide_write_08.htm
[12] http://www.masterclips.com
[13] http://www.webofficesolutions.com
[14] http://www.pirated-sites.com



Bookmark This Article (http://javascript%3Cb%3E%3C/b%3E:window.external.AddFavorite%28url,who%29;) Print-Friendly Version (http://www.sitepoint.com/print/copy-great-designers-steal) Email to a Friend (http://www.sitepoint.com/email/copy-great-designers-steal) Give Author Feedback (http://www.sitepoint.com/feedback/1150) Suggest an Article (http://www.sitepoint.com/contact?reason=articlesuggest) Link to this Article (http://www.sitepoint.com/linktothis/1150)



Topics

Before You Code (http://www.sitepoint.com/cat/before-you-code)


Domain Names (http://www.sitepoint.com/subcat/domain-names)
Hosting (http://www.sitepoint.com/subcat/hosting)
Site Planning (http://www.sitepoint.com/subcat/site-planning)
Legal Issues (http://www.sitepoint.com/subcat/legal)
Privacy and Trust (http://www.sitepoint.com/subcat/privacy)

Design and Layout (http://www.sitepoint.com/cat/design-and-layout)


Usability and Information Architecture (http://www.sitepoint.com/subcat/usability)
Accessibility (http://www.sitepoint.com/subcat/accessibility)<LI class=navitem-atv>Design Principles (http://www.sitepoint.com/subcat/design-principles)
Design Practice (http://www.sitepoint.com/subcat/design-practice)
Design Tips & Tricks (http://www.sitepoint.com/subcat/design-tips)
Software Tutorials (http://www.sitepoint.com/subcat/software-tutorials)
Flash Tutorials (http://www.sitepoint.com/subcat/flash)

Client Side Coding (http://www.sitepoint.com/cat/client-side-coding)


HTML & XHTML Tutorials (http://www.sitepoint.com/subcat/html)
CSS Tutorials (http://www.sitepoint.com/subcat/css)
JavaScript & AJAX Tutorials (http://www.sitepoint.com/subcat/javascript)
XML, XSLT & Web Services (http://www.sitepoint.com/subcat/xml)

Server Side Coding (http://www.sitepoint.com/cat/server-side-coding)


ASP & .NET Tutorials (http://www.sitepoint.com/subcat/asp)
CGI & Perl Tutorials (http://www.sitepoint.com/subcat/perl)
ColdFusion Tutorials (http://www.sitepoint.com/subcat/coldfusion)
Java and J2EE (http://www.sitepoint.com/subcat/java)
PHP & MySQL News & Interviews (http://www.sitepoint.com/subcat/php-news)
PHP & MySQL Tutorials (http://www.sitepoint.com/subcat/php-tutorials)
PHP & MySQL Reviews and Apps (http://www.sitepoint.com/subcat/php-reviews)
Server Side Essentials (http://www.sitepoint.com/subcat/server-side)
Apache & IIS Configuration (http://www.sitepoint.com/subcat/other-technologies)

Site Strategy (http://www.sitepoint.com/cat/site-strategy)


Community (http://www.sitepoint.com/subcat/community-strategy)
Content (http://www.sitepoint.com/subcat/content-strategy)
eCommerce (http://www.sitepoint.com/subcat/ecommerce-strategy)

Site Marketing (http://www.sitepoint.com/cat/site-marketing)


Traffic Analysis (http://www.sitepoint.com/subcat/traffic-analysis)
Search Marketing (http://www.sitepoint.com/subcat/searchmarketing)
Other Promotions (http://www.sitepoint.com/subcat/promotions)

Sell Your Services (http://www.sitepoint.com/cat/sell-your-services)


Get Started (http://www.sitepoint.com/subcat/services-start)
Find Clients (http://www.sitepoint.com/subcat/find-clients)
Work Smarter (http://www.sitepoint.com/subcat/work-smarter)


SitePoint Design Contests (http://www.sitepoint.com/contests/)

http://www.atyafonline.com/vb/imgcache/463.png (http://www.sitepoint.com/contests/)
Designers:

Tap into a thriving worldwide demand for your design skills
Business owners:

Generate quality, cost effective logos, web sites, and more for your business!
Tell me more... (http://www.sitepoint.com/contests/)

SitePoint Marketplace (http://www.sitepoint.com/marketplace/)

http://www.atyafonline.com/vb/imgcache/464.png (http://www.sitepoint.com/marketplace/)
Buy and sell Websites, templates, domain names, hosting, graphics and more.
Tell me more... (http://www.sitepoint.com/marketplace/)

SitePoint Jobs

» We're Hiring! (http://www.sitepoint.com/about/jobs/)


SitePoint Newsletters

Get all the latest tips on Advanced Design and Layout by signing up to all of SitePoint’s informative newsletters.

SitePoint TechTimes
SitePoint Tribune
SitePoint Design View
Community Crier

HTML Plain


View Our Privacy Policy (http://www.sitepoint.com/privacy.php)

Sample Our Newsletter Archives (http://www.sitepoint.com/newsletter/archives)








NEW Release!

The PHP Anthology: 101 Essential Tips, Tricks & Hacks, 2nd Edition (http://www.sitepoint.com/launch/d76b03/3/120)

A comprehensive collection of ready-to-use PHP solutions!

http://www.atyafonline.com/vb/imgcache/465.png (http://www.sitepoint.com/launch/d76b03/3/120)
Download the FREE sample chapter (http://www.sitepoint.com/launch/d76b03/2/120)


NEW Release!

The Web Design Business Kit 2.0 (http://www.sitepoint.com/launch/fc0c97/3/111)

Business Secrets You Can't Live Without!
http://www.atyafonline.com/vb/imgcache/466.png (http://www.sitepoint.com/launch/fc0c97/3/111)
Download the FREE sample chapter (http://www.sitepoint.com/launch/fc0c97/2/111)


SitePoint Kits

Download sample chapters of any of our popular kits.
The Search Engine Marketing Kit, 2.0 (http://www.sitepoint.com/launch/ac51d2)

The Web Design Business Kit 2.0 (http://www.sitepoint.com/launch/9bdcaf)

The Email Marketing Kit (http://www.sitepoint.com/launch/a5f21b)

The Usability Kit (http://www.sitepoint.com/launch/2073a4)


SitePoint Books

Download sample chapters of any of our popular books.
The PHP Anthology: 101 Essential Tips, Tricks & Hacks, 2nd Edition (http://www.sitepoint.com/launch/d76b03)

The ASP.NET 2.0 Anthology: 101 Essential Tips, Tricks & Hacks (http://www.sitepoint.com/launch/55bf52)

The CSS Anthology: 101 Essential Tips, Tricks & Hacks, 2nd Edition (http://www.sitepoint.com/launch/a20cf1)

Simply JavaScript (http://www.sitepoint.com/launch/a56399)

The Art & Science Of CSS (http://www.sitepoint.com/launch/86fd30)

The Principles of Beautiful Web Design (http://www.sitepoint.com/launch/964771)

Build Your Own Ruby on Rails Web Applications (http://www.sitepoint.com/launch/cf28a4)

The Photoshop Anthology: 101 Web Design Tips, Tricks & Techniques - PDF Only (http://www.sitepoint.com/launch/feb3d3)

Build Your Own ASP.NET 2.0 Web Site Using C# & VB. 2nd Edition (http://www.sitepoint.com/launch/cb4ddf)

Deliver First Class Web Sites: 101 Essential Checklists (http://www.sitepoint.com/launch/48ffcb)

Build Your Own Database Driven Website Using PHP & MySQL (http://www.sitepoint.com/launch/17c8ad)

HTML Utopia: Designing Without Tables Using CSS, 2nd Edition (http://www.sitepoint.com/launch/8124be)

Build Your Own Web Site The Right Way Using HTML & CSS (http://www.sitepoint.com/launch/86b11a)

Build Your Own AJAX Web Applications (http://www.sitepoint.com/launch/84a1d9)

The CSS Anthology: 101 Essential Tips, Tricks & Hacks (http://www.sitepoint.com/launch/6c2ecc)

DHTML Utopia: Modern Web Design Using JavaScript & DOM (http://www.sitepoint.com/launch/eadda8)

The JavaScript Anthology: 101 Essential Tips, Tricks & Hacks (http://www.sitepoint.com/launch/950752)

No Nonsense XML Web Development With PHP (http://www.sitepoint.com/launch/844ce8)


Related Forum Discussions

Related Forum: Web Page Design (http://www.sitepoint.com/forums/forumdisplay.php?forumid=1)

New BBC Site in BETA (http://www.sitepoint.com/forums/showthread.php?t=520574)
Uncoded Template Help? (http://www.sitepoint.com/forums/showthread.php?t=520561)
HTML 5 vs. XHTML 2 (AKA the fork in the road) (http://www.sitepoint.com/forums/showthread.php?t=520532)
Ideal Width for a fixed website (http://www.sitepoint.com/forums/showthread.php?t=520481)
Help! I Can't Get My Header To Show Correctly! (http://www.sitepoint.com/forums/showthread.php?t=520471)

Other Articles by Cameron Moll

Cameron Moll's other SitePoint Articles

Great Homepages Really Suck (http://www.sitepoint.com/article/great-homepages-really-suck)

Related Articles

If you liked this article, these might interest you too.

Interview - Jeffrey Zeldman of A List Apart (http://www.sitepoint.com/article/jeffrey-zeldman-list-apart)
Rated : 9.3/10
Debate - Design Is Dead! (http://www.sitepoint.com/article/debate-design-dead)
Rated : 6.7/10




Advertise (http://www.sitepoint.com/mediakit)
About Us (http://www.sitepoint.com/about/)
Contact Us (http://www.sitepoint.com/contact)
Site Map (http://www.sitepoint.com/sitemap)
Write For Us (http://www.sitepoint.com/about/writeforus)
RSS (http://www.sitepoint.com/syndication/)
Search (http://www.sitepoint.com/search/search.php)
Privacy (http://www.sitepoint.com/privacy/)
Glossary (http://www.sitepoint.com/glossary.php?q=A)
Terms & Conditions (http://www.sitepoint.com/about/terms.php/)
Jobs (http://www.sitepoint.com/about/jobs/)

The contents of this webpage are copyright © 1998-2007 SitePoint Pty. Ltd. All Rights Reserved.
Web Design & Development by SitePoint, Melbourne, Australia (http://www.sitepoint.com.au/) -

_uacct = "UA-30131-1";urchinTracker();