<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Think Vitamin &#187; Larissa Meek</title>
	<atom:link href="http://thinkvitamin.com/author/larissa-meek/feed/" rel="self" type="application/rss+xml" />
	<link>http://thinkvitamin.com</link>
	<description>The Web Practitioner&#039;s Blog</description>
	<lastBuildDate>Thu, 09 Feb 2012 16:41:31 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	
		<item>
		<title>7 Surefire Web Design Styles that Work</title>
		<link>http://thinkvitamin.com/design/web-design-isms-7-surefire-styles-that-work/</link>
		<comments>http://thinkvitamin.com/design/web-design-isms-7-surefire-styles-that-work/#comments</comments>
		<pubDate>Mon, 11 Jun 2007 08:00:28 +0000</pubDate>
		<dc:creator>Larissa Meek</dc:creator>
				<category><![CDATA[Design]]></category>

		<guid isPermaLink="false">http://www.thinkvitamin.com/features/design/web-design-isms-7-surefire-styles-that-work</guid>
		<description><![CDATA[If you are a web designer, these 7 design movements haunt you. It&#8216;s a love/hate relationship. You think to yourself, &#8220;I want to create something that&#8216;s never been done before,&#8221; but you feel spellbound because you know &#8220;what works.&#8221; Unfortunately, you also know that &#8220;what works&#8221; has been done a million times before. No matter [...]]]></description>
			<content:encoded><![CDATA[<p>If you are  a web designer, these 7 design movements haunt you. It&#8216;s a love/hate  relationship. You think to yourself, &#8220;I want to create something that&#8216;s never been done before,&#8221; but you feel spellbound because you know &#8220;what works.&#8221; Unfortunately, you also know that &#8220;what works&#8221; has been done a million times before. No matter how hard you and other creative-types strive to do something new, history has created a set of &#8220;classic&#8221; styles that basically remain the same, save some minor updating.</p>
<p>Take the  world of fashion for example. Fashion is in one minute and out the next because  we get bored of looking at the same things day after day. The same pattern will occur in web design. However, just as there are mainstays of good fashion, such  as the little back dress, there are also mainstays of good web design. Every site may not fit into each of the categories exactly and some may be combinations of styles, but you&#8216;ll get the idea.</p>
<h3>1. Collagism &ndash; Make it un-perfect.</h3>
<p>The inspiration behind the collage is to create something new out of old pieces. The collage style in web design consists of elements such as paper, tape and grungy or  dirty textures. Drips, sprays, splatters and coffee stains are also hallmarks of the collage. This style has a sense of tangibility and is a counterpoint to the geometrically clean perfection that computers naturally exude. You&#8217;ve seen this style on everything from snowboarding sites, church sites and even network sites. The trick to this style is to break outside of the grid. Use background images to make things look &#8216;askew.&#8217; Even though your text may have to be straight, you can trick the eye with background images that are not straight. This creates a sense of movement with organization. </p>
<p><strong>Artists who inspire: </strong><a href="http://www.flickr.com/photos/bpx/sets/72057594117941491/">USSR Posters on Flickr</a><strong>, </strong><a href="http://en.wikipedia.org/wiki/Max_Ernst" title="Max Ernst" >Max Ernst</a>, <a href="http://en.wikipedia.org/wiki/Peter_Blake_(artist)" title="Peter Blake (artist)" >Peter Blake</a> and <a href="http://en.wikipedia.org/wiki/Hannah_Hoch" title="Hannah Hoch" >Hannah Hoch</a><strong></strong></p>
<h4>1.1 Collagist Art Example:</h4>
<p><strong><a href="http://en.wikipedia.org/wiki/Pablo_Picasso" ><img src="/images/articles/features/7-designisms/collage-img.jpg" alt="Pablo Picasso" width="400" height="290" /></a></strong></p>
<h4>1.2 Collagist Web Examples:</h4>
<p><a href="http://www.dotcomedy.com/"  title="Dot Comedy"><img src="/images/articles/features/7-designisms/dotComedy.jpg" alt="DotComedy" width="400" height="160" /></a></p>
<p><a href="http://www.kcrevolution.org/" title="KC Revolution"><img src="/images/articles/features/7-designisms/kCRevolution.jpg" alt="KC Revolution" width="400" height="160" /></a></p>
<p><a href="http://www.timeforcake.com/"  title="Time For Cake"><img src="/images/articles/features/7-designisms/timeForCake.jpg" alt="" width="400" height="160" /></a></p>
<p><a href="http://www.knoxville.org/" title="Knoxville.org" ><img src="/images/articles/features/7-designisms/_knoxville.jpg" alt="Knoxville.org" width="400" height="160" /></a></p>
<h3>2. Ornamentalism &ndash; Interior decorating.</h3>
<p>Ornamental design can be similar to the collage, but the essence of the &#8216;fleur de lis&#8217; and Art Nouveau ornamentation separate this style from the rest. It is often seen on the web in background patterns or framing elements. Ornamental design is inspired by architecture, where ornaments are applied as decorative accents from stone, wood, precious metals or plaster. The easiest way to incorporate this movement is through a monochromatic damask background pattern which is subtle yet dramatic.</p>
<p><strong>Artists who inspire: </strong><a href="http://en.wikipedia.org/wiki/Gustav_Klimt" title="Gustav Klimt" >Gustav Klimt</a>, <a href="http://en.wikipedia.org/wiki/Alfons_Mucha" title="Alfons Mucha" >Alfons Mucha</a>, <a href="http://en.wikipedia.org/wiki/Mikhail_Eisenstein" title="Mikhail Eisenstein" >Mikhail Eisenstein</a> and <a href="http://en.wikipedia.org/wiki/Hector_Guimard" title="Hector Guimard">Hector Guimard</a></p>
<h4>2.1 Ornamentalism Art Example:</h4>
<p><img src="/images/articles/features/7-designisms/mucha.jpg" alt="Alponse Mucha" width="400" height="290" /></p>
<h4>2.2 Ornamentalism Web Examples:</h4>
<p><a href="http://www.darasgarden.com/" title="Dara's Garden" ><img src="/images/articles/features/7-designisms/darasgarden.jpg" alt="Dara's Garden" width="400" height="160" /></a></p>
<p><a href="http://resisttoday.com/" title="Resist Today"><img src="/images/articles/features/7-designisms/ResistToday.jpg" alt="Resist Today" width="400" height="160" /></a></p>
<p><a href="http://www.cubeclub-chemnitz.de/" title="Cube Club-Chemnitz/" ><img src="/images/articles/features/7-designisms/cubeclub-chemnitz.jpg" alt=".cubeclub-chemnitz.de/" width="400" height="160" /></a></p>
<h3>3. Glossism &ndash; Reflective, isn&#8217;t it?</h3>
<p>This is the most popular style on the web today. You&#8217;ve seen it everywhere; it best embodies the phrase &#8216;Web 2.0&#8217; when referring to design.  It includes gradients with jewel-tone colors that are so shiny you just want to lick your monitor. Reflections, gradients and glossy buttons are fundamental for this web design movement. This style is here to stay even though a lot of people are already sick of looking at it. It creates a sense of cleanliness and easily guides the user through an interface that also include bold jelly colors, sun burst shapes, badges, rounded corners and talk bubbles.</p>
<h4>3.1 Glossism Art  Example:</h4>
<p><a href="http://www.chihuly.com/baskets/selbas.html"><img src="/images/articles/features/7-designisms/daleChihuly.jpg" alt="Dale Chihuly" width="400" height="290" /></a></p>
<h4>3.2 Glossism Web  Examples:</h4>
<p><a href="http://www.friendseat.com/" title="Friends eat" ><img src="/images/articles/features/7-designisms/FriendsEat.jpg" alt="Friends Eat" width="400" height="160" /></a></p>
<p><img src="/images/articles/features/7-designisms/bacardiDJ.jpg" alt="Bacardi DJ" width="400" height="160" /></p>
<p><a href="http://www.bigfilebox.com/" title="Big File Box" ><img src="/images/articles/features/7-designisms/bigFileBox.jpg" alt="Big File Box" width="400" height="160" /></a></p>
<p><a href="http://www.koko3.fi/" title="koko3" ><img src="/images/articles/features/7-designisms/koko3.jpg" alt="koko3" width="400" height="160" /></a></p>
<h3>4. Wordism &ndash; Words Become Art.</h3>
<p>This movement is inspired heavily by the print world and is predominantly seen as the digital counterpart of traditional magazines in e-zines. Its characteristics use an overall grid-like layout and powerful typography in lieu of decorations or design elements. The typography itself becomes a visual stimulant, making it almost unnecessary to add other photographs, illustrations or decoration. Inspiration for Wordism can be found in the poster artists of WWI and WWII, who used illustrations combined with bold typography. Modern graffiti art could relate to this movement as well.</p>
<p><strong>Artists that inspire: </strong><a href="http://en.wikipedia.org/wiki/Robert_Indiana" title="Robert Indiana" >Robert  Indiana</a>, <a href="http://en.wikipedia.org/wiki/Adolphe_Muron_Cassandre" title="Adolphe Muron Cassandre" >Adolphe Muron Cassandre</a>, and <a href="http://www.internationalposter.com/">International Posters</a> <strong></strong></p>
<h4>4.1 Wordism Art Example:</h4>
<p><a href="http://www.library.northwestern.edu/govinfo/collections/wwii-posters/"  title="World War II Poster Art"><img src="/images/articles/features/7-designisms/posterArt.jpg" alt="World War II Poster Art" width="400" height="290" /></a></p>
<h4>4.2 Wordism Web Examples:</h4>
<p><a href="http://www.presidentielles.net/" ><img src="/images/articles/features/7-designisms/presidentielles.jpg" alt="Presidentielles" width="400" height="160" /></a></p>
<p><a href="http://www.jrvelasco.com/"  title="jrvelasco"><img src="/images/articles/features/7-designisms/jrvelasco.jpg" alt="http://www.jrvelasco.com/" width="400" height="160" /></a></p>
<p><a href="http://www.uxmag.com/"  title="UX Magazine"><img src="/images/articles/features/7-designisms/uxMag.jpg" alt="Ux Magazine" width="400" height="160" /></a></p>
<p><a href="http://www.people.com/"  title="People Magazine"><img src="/images/articles/features/7-designisms/people.jpg" alt="People" width="400" height="160" /></a> </p>
<h3>5. Futurism &#8212; Think Like a Trekkie.</h3>
<p>This was one of the first design movements on the web, but it&#8217;s not often used today. In the future I could see this making a comeback &#8212; not in exactly the same way but with a new twist. This style is translated through geometric shapes such as computer circuits, motherboards and mechanical gears. In essence, this movement is a reflection of technology and what we might envision the future to be like.</p>
<p><strong>Artists who inspire:</strong><a href="http://search.deviantart.com/?section=browse&#038;qh=boost:popular age_sigma:24h age_scale:5&#038;q=science fiction" title="Science Fiction Art on deviantArt " >deviantArt</a><strong> , </strong><a href="http://joepogan.com/gallery/index.htm"  title="Joe Pogan">Joe Pogan</a> and Chris Foss </p>
<p><strong>5.1 Futurism Art Example: </strong></p>
<p><a href="http://paleo-future.blogspot.com/2007/02/space-colonies-by-don-davis.html" ><img src="/images/articles/features/7-designisms/DonaldDavis.jpg" alt="Donald Davis" width="400" height="290" /></a></p>
<h4><strong>5.2 Futurism Web Examples: </strong></h4>
<p><img src="/images/articles/features/7-designisms/xmen.jpg" alt="Xmen" width="400" height="160" /></p>
<p> <a href="http://www.wa007.com/" title="WA007" ><img src="/images/articles/features/7-designisms/wa007.jpg" alt="WA007" width="400" height="160" /></a></p>
<p><a href="http://www.michelinman.com/forward/" title="Michelin Man /Forward"><img src="/images/articles/features/7-designisms/MichelinMan.jpg" alt="Michelin Man /Forward" width="400" height="160" /></a></p>
<h3>6. Minimalism &ndash; Less is More.</h3>
<p>The minimalist movement was a response to the abuse our senses took from early web pages when busy backgrounds,  blink tags and rainbow colored text were the norm. &#8220;Minimalism&#8221; is a term coined by the art and literature circles to describe a movement toward extreme simplification of form and color. Minimalism, as it  relates to web design, focuses on usability, aesthetics and letting the content be the star. This kind of design doesn&#8217;t have to be boring. In fact, proper use of white space gives a site a level of sophistication that is often missing from sites that have every little space crammed with something. </p>
<p><strong>Artists who inspire: </strong><a href="http://www.artcyclopedia.com/history/minimalism.html">Artcyclopedia</a>, <a href="http://en.wikipedia.org/wiki/Frank_Stella">Frank Stella</a> and <a href="http://www.guggenheimcollection.org/site/artist_bio_72.html">Ellsworth Kelly </a></p>
<h4>6.1 Minimalism Art Example:</h4>
<p><img src="/images/articles/features/7-designisms/minimalisim.jpg" alt="LG Williams" width="400" height="290" /></p>
<h4>6.2 Minimalism Web  Examples:</h4>
<p><a href="http://www.thebignoob.com/" title="The Big Noob"><img src="/images/articles/features/7-designisms/bigNoob.jpg" alt="The Big Noob" width="400" height="160" /></a></p>
<p><a href="http://www.rikcat.com/" title="RikCat"><img src="/images/articles/features/7-designisms/rikcat.jpg" alt="RikCat" width="400" height="160" /></a></p>
<p><a href="http://dotkraft.com/" title="dotKraft"><img src="/images/articles/features/7-designisms/dotkraft.jpg" alt="Dotkraft" width="400" height="160" /></a></p>
<p><img src="/images/articles/features/7-designisms/vorsat.jpg" alt="Store.Vorsat" width="400" height="160" /></p>
<h3><strong>7. Retroism &#8212; A Blast from the Past.</strong></h3>
<p>Retro design can draw from anything in the past, such as the illustrative look of the 50&#8217;s, the flower power of the 60&#8217;s, disco of the 70&#8217;s or even the cool pop art of the 80&#8217;s. Mainstream styles and graphics of these eras were restricted by the limitations of the technology of the day. Retroism takes advantage of the iconic looks that these limitations created. The VW Beetle is the perfect example &#8212; compare the 1961 Beetle to the new convertible of the 2000&#8217;s. When using this style it&#8217;s a good idea not to over do it. There <em>can</em> be too much of a good thing. </p>
<p><strong>Artists who inspire: </strong><a href="http://iso50.com/">iso50</a>, Crazy Labels  and <a href="http://www.bastardgraphics.com/2007.htm">Bastard Graphics</a></p>
<h4>7.1 Retroism design Example:</h4>
<p><a href="http://en.wikipedia.org/wiki/Vw_beetle"><img src="/images/articles/features/7-designisms/vw1961.jpg" alt="VW Beetle 1961" width="400" height="290" /></a></p>
<p><a href="http://en.wikipedia.org/wiki/Volkswagen_New_Beetle"><img src="/images/articles/features/7-designisms/vw.jpg" alt="VW New Beetle" width="400" height="290" /></a></p>
<h4>7.2 Retroism Web Examples:</h4>
<p><a href="http://www.eltontom.com/" title="Elton Tom"><img src="/images/articles/features/7-designisms/eltonTom.jpg" alt="Elton Tom" width="400" height="160" /></a></p>
<p><a href="http://www.sottocostoska.it/home.asp"><img src="/images/articles/features/7-designisms/sottocosto.jpg" alt="Sottocosto Ska" width="400" height="160" /></a></p>
<p><a href="http://www.lanalandis.com/" title="Lana Landis"><img src="/images/articles/features/7-designisms/LanaLandis.jpg" alt="Lana Landis" width="400" height="160" /></a></p>
<p><a href="http://www.fakefrench.com/" title="Fake French"><img src="/images/articles/features/7-designisms/FakeFrench.jpg" alt="Fake French" width="400" height="160" /></a></p>
<h3>Design may evolve, but the basics remain the same. </h3>
<p>The world collectively shifts its visual thinking of what&#8217;s considered &#8220;in.&#8221; You see this collective thinking in everything from the colors we use to paint our walls to the shapes of fashion that adorn our bodies. Even though things are always evolving, basic movements will remain the same. So the next time you&#8217;re looking for inspiration, just go back to the basics and add your own twist. The 7 design-isms listed above are not the only design movements of the web; many have yet to be defined or even discovered. These design-isms may very well be the little black dress of web design &#8212; everyone uses them because they work &#8212; but with a little creativity it&#8217;s still possible to make them your own.</p>
<p><script src="http://digg.com/tools/diggthis.js" type="text/javascript"></script></p>
]]></content:encoded>
			<wfw:commentRss>http://thinkvitamin.com/design/web-design-isms-7-surefire-styles-that-work/feed/</wfw:commentRss>
		<slash:comments>31</slash:comments>
		</item>
	</channel>
</rss>

<!-- Dynamic page generated in 0.420 seconds. -->
<!-- Cached page generated by WP-Super-Cache on 2012-02-11 16:41:36 -->

