The Surrender

Eight Bits

Labrinth Poster

Omega Code Fan Art Poster

Hidden Pictures

Halloween na Drops

Space Poster

Don’t Panic

Flightmen Gig Poster

Answer

Yuengling Poster

Inception Poster

Wonder Woman Vintage Poster

Elevate

Infinite Peaks

Change

José Padilla Poster

AJ&TCW – Concert Poster

Expendables Poster Art

23:59

Rain Drops

Lost City

Will Holland, Peter Barbee, Jacob Thomas

Tune In

Heirlooms at the Wadsworth Gig Poster

Paper Airplane Championships

Basics Poster

Resonate

Super up!

poster design

Brasil Cine

Air

Mirror Image

Harley Davidson

We Can Do Anything

Icograda

Make Road to the Future

Some Folks

5 Hours of Power

What is death?

Through the Sparks

Resolution

Alt 1977

Project Mercury

Arizona

Colorphonic + Cacofônicos

Creative People on Twitter

Liam McKay – @liammckay
Liam is a web designer who continues to blow me away with his work. He runs Function Web Design & Development Blog and is currently working on WPBundle, which will be launching soon.

Chris Spooner – @chrisspooner
Chris is an amazing designer who runs two different design blogs, SpoonGraphics and Line25. His tutorials are a step above what you would typically find in the design world.

Milos Sutanovac – @mixn
Milos is a young, up-and-coming designer who is currently studying design over in Germany. He’s an overall great guy who consistently tweets useful links. +10pts points for securing the short name.

Sickdesigner – @sickdesigner
A new member of the Smashing Network with his Sickdesigner blog, he has blown me away with some of the work that I’ve seen him create. Expect to see big things from this guy in the near future.

Jin Yang – @jzy
A professional bacon eater with a keen eye for design. He blogs at 8164.org and can usually be spotted bouncing tweets back in forth between @drawar and @iamFinch.

Soh Tanaka – @SohTanaka
If you don’t know this guy, you should change that immediately. He’s a designer and front-end developer who is always creating amazing work. His site, sohtanaka.com, speaks for itself and will back that up.

wegraphics – @wegraphics
These guys produce some amazing design resources. They recently did a top-notch redesign on their site/blog which now sells their unique resources either through subscription or individually.

Brian Hoff – @behoff
Brian is a designer, writer, speaker and design thinker. He’s done work for many big clients and is very knowledgeable about anything design related. He shares this knowledge with others at The Design Cubicle.

Alex Charchar – @retinart
A lover of design and an excellent writer, Alex is extremely passionate about his work. You can read his articles over at Retinart which reflect on the joyous elegance of graphic design & creative thought.

Fabio Sasso – @abduzeedo
Fabio is another talented graphic designer who runs the inspiration mother-load of websites, Abduzeedo. He consistently publishes high-end graphic design tutorials and is a must follow on Twitter.

jina – @jina
Jina is a user experience designer at Engine Yard, founder of Art in My Coffee and a Grad student at Academy of Art University. She writes over at sushiandrobots.com which is her online journal and portfolio.

Roger Byrne – @imrogb
Roger is a talented photographer and is the advertising manager over at Envato. I have been following him for quite some time now and always enjoy his witty tweets and design links.

Sean Farrell – @brand_clay
I first found Sean over at LogoPond and was immediately drawn to his work. He’s an excellent graphic designer who consistently cranks out high-quality work. He also runs the site brandclay.com

Webdesigner Depot – @DesignerDepot
Webdesigner Depot publishes some really great content on their site. The same can be said about the tweets that they share. If you’re not already one of their 193,000 followers, you should jump on board.

James White – @Signalnoise
James is a graphic designer based out of Halifax. He designs, blogs, speaks and hosts a weekly live broadcast. I like this guy so much, I’ve got one of his posters hanging in my office. Check out his t-shirts too.

Design Shack – @designshack
Design Shack is a very unique design blog which pays special attention to high quality articles. In addition, they have an extensive gallery and community news section. Follow them for great design links.

Jacob Cass – @justcreative
Jacob is a great guy who has also done design work for several big clients. He has a strong following on Twitter and shares many helpful design links there. Look for him on justcreativedesign.com.

Finch – @iamFinch
Francisco has been working in the design world for over 10 yrs. He writes beautiful articles over at getfinch.com and shares some great links and insight on Twitter. He is not a “rockstar, a ninja, or a guru”.

bkmacdaddy designs – @bkmacdaddy
Brian is a web and graphic designer who can be found tweeting a ton of design links 24/7. I honestly don’t know how he does it. He has been in the business since 1998 and has a site over at bkmacdaddy.com.

colaja – @colaja
Nikola is a web designer and blogger who runs the site webexpedition18.com. He and I have been friends on Twitter for quite sometime and I can vouch that he tweets some great links.

Piervincenzo Madeo – @piervix
Former owner of PV.M Garage, Piervincenzo is a web designer, coder and blogger with a love for creativity. He can now be found behind the scenes of WeGraphics.net creating some amazing resources.

Chetan R – @cheth
Chetan is a web and graphic designer who runs the design blog chethstudios.net. He has a large following on Twitter where he tweets about anything design related. You should give him a follow.

Collis – @collis
Collis is one of the founders of The Envato Network. Unless you’ve been hiding under a rock, that name should sound very familiar. Do yourself a favor and follow this guy. His tweets always come in handy.

Jon Phillips – @jophillips
Jon is the editor and founder of SpyreStudios, an online magazine for designers and developers that really puts out some great content. He is good at what he does and shares excellent content on Twitter.

Chris Coyier – @chriscoyier
Chris is a web designer who blogs over at css-tricks.com. He’s always tinkering around with code and creating awesomeness. Along with Jeff Starr, he wrote the book “Digging into WordPress”.

Marco Kuiper – @marcofolio
Marco is another designer that I have been following for a while. He is extremely knowledgeable when it comes to coding. The proof is in the pudding, check out some of his content on his site marcofolio.net.

Psdtuts – @psdtuts
Like I really need to introduce this blog to you. Psdtuts is the premier tutorial site for Photoshop users. If you use Photoshop at all, do yourself a favor and follow them.

Mike Lane – @mlane
Mike is a Senior UX Designer with 15 years experience in creative Web and Graphic Design. He has a strong following on Twitter reliably tweets links to design-related content. He’s a nice guy too.

Nick La – @nickla
Nick is the creator of themify, ndesign, webdesignerwall, bestwebgallery, and icondock. He’s quite active on the web and a great person to follow. Have you seen his Koi illustration? Wow!

Jason Santa Maria – @jasonsantamaria
Jason is the founder and principal of the design studio Mighty, creative director for Typekit and an all around creative person. He is well known in the design community and has a huge following on Twitter.

Janko Jovanovic – @jankowarpspeed
Janko is a talented UI designer, software engineer, blogger, speaker and artist. He both writes and tweets valuable content and I highly recommend that you follow him. He also travels at warp speed.

Dan Cederholm – @simplebits
Among many other things, Dan is the co-founder and designer of Dribbble. He is the author of three popular books and enjoys sharing his simplistic approach to web design. This guy is talented!

Meagan Fisher – @owltastic
Meagan is a 23 year old designer with a passion for good design, well written markup, owls, and Macs. She writes about web design at her blog, Owltastic.com and is also the deputy designer at SimpleBits.com.

Cameron Moll – @cameronmoll
Cameron is a designer, speaker, and author living in Sarasota, Florida. I just recently started following him because Twitter recommended that I did for two weeks straight. It was a wise choice, great links!

Web Design Ledger – @webdesignledger
I keep up with a lot of design blogs and webdesignledger is one of my favorite. They pay extra attention to the quality of their articles and I find that quite admirable. You should follow them on Twitter.

Aext.net – @aextnet
Aext is a great web design blog featuring tutorials, collections, industry insights, and other resources. I’ve been following Lam for a while now both on his blog and Twitter. His coding tutorials are spot on.

Richie Thimmaiah – @richbugger
Richie is a web enthusiast who is also a graduate in Electronics Engineering. Another designer that I have been following for a while now who is sure to fill your Twitter stream with valuable design links.

Kyle Steed – @kylesteed
Kyle has been in the graphic design business for over 10 yrs. He’s always creating cool stuff like the Clumsy font he recently released. You should definitely follow him and also check out his new store.

Paul0v2 – @Paul0v2
Paulo provides inspirational posts for Abduzeedo on a regular basis. He’s a lover of design and a great person to follow on Twitter. He also has an impressive portfolio over at the Behance Network.

Jean-Baptiste Jung – @catswhocode
Jean-Baptiste is a WordPress developer, blogger, entrepreneur and animal rights supporter. He is the author of WordPress Cookbook and a regular author of articles on Smashing Magazine.

Elliot Jay Stocks – @elliotjaystocks
Elliot Jay Stocks is a name that you should be familiar with. He is a designer, an illustrator, a speaker, and an author. His work is a step above awesome and can be viewed over at elliotjaystocks.com.

Naomi Atkinson – @naomisusi
I recently started following Naomi after seeing some of her work on Twitter. She is a talented designer and illustrator who is about to launch her own design company. Check out her pixel patterns set.

Trent Walton – @TrentWalton
Trent has been dominating the web lately. He is experienced in HTML, CSS, graphic design, user experience, information architecture and more. He is also one of the founders of Paravelinc.com. Follow him!

Paddy Donnelly – @paddydonnelly
Paddy is an Irish web designer, blogger, interviewer and illustrator currently living in Belgium. He first grabbed my attention with his excellent article “Life Below 600px”. An interesting person to follow.

Tim Van Damme – @maxvoltar
Tim is a freelance designer at Made by Elephant and writes at maxvoltar.com. He first caught my attention with some awesome shots on dribbble and I have been following him ever since.

Rogie – @rogieking
Rogie owns the site Komodo Media, an icon shop, a blog, a portfolio and an experiment lab. Although he is currently on a “Social Detox”, He’s a great resource on Twitter and will be back soon.

simurai – @simurai
I don’t know what else to say about this guy except, wow! Some of the CSS3 experiments that he has put together over at simurai.com are more than impressive. Check out his rocker switches.

Dustin Curtis – @dcurtis
Dustin is a very interesting character. He writes some amazing articles and his tweets are quite original. His avatar seems to change on a weekly basis, just look for the lightning bolt. He is also a superhero.

Vitor Lourenço – @vl
Vitor is the product designer at Twitter. Need I say more? He’s been with the company since 2008 and has also worked with Yahoo. Yeah, and he’s only 23 years old. Expect great things from this guy!

Jeffrey Zeldman – @zeldman
Dubbed King of Web Standards by Business Week, Jeffrey Zeldman was one of the first designers, bloggers, and independent publishers on the web, and one of the first web design teachers. Nuff said!

Paul Boag – @boagworld
Paul is the founder of the web design agency Headscape, host of the boagworld podcast and author of the website owners manual. He spends as much time talking about web design as actually doing it.

Jacob Gube – @sixrevisions
Jacob is the founder and chief editor of Six Revisions and co-founder of Design Instruct . He’s also a web developer/designer who specializes in front-end development and PHP development.

Antonio Lupetti – @Woork
Antonio is the founder of the web design blog, Woork Up. His blog is a member of the Smashing Network and he is quite popular on Twitter. Follow him for interesting design discussions and links.

Chris Herbert – @chrisherbert1
Chris is a digital artist/designer, humanlinkmachine™, Apple evangelist & tech enthusiast. He is also a contributor to MacStories.net. I’ve been following him for a while and enjoy the links he shares.

Sheri Strykowski – @writer_sheri
I’ve been following Sheri for a long time now on Twitter. She is a wonderful source for design links and anything creative. Not only is she well versed in design, she is a kind person as well.

Nicholas Patten – @nicholaspatten
Nicholas is many things. He’s a video editor, graphic/web designer and IT director who is interested in architecture, tutorials and social media. Follow him on Twitter for a variety of useful links.

Martin Angelov – @Tutorialzine
Martin runs one of the best web design sites out there, Tutorialzine. He’s currently pursuing a degree in computer engineering and has been doing web development for as long as he can remember.

Sneh Roy – @LBOI
Sneh is a web consultant, logo designer and illustrator from Sydney, Australia. She runs the blog littleboxofideas.com where she posts both creative and original design related articles.

Inspired Magazine – @inspiredmag
Inspired Magazine is a daily inspiration source for web designers, illustrators, Twitter addicts, iPhone lovers, and other creative humans. Not only is their blog great, but so are the tweets they deliver.

Nettuts+ – @nettuts
If you want to learn web design, follow this blog now. Nettuts+ has taught my a ton of skills and shared many great links with the Twitter community. They specialize in HTML, CSS, Javascript, CMS’s, PHP…

drawar – @drawar
Drawar is a fast growing design community that has recently sprung up. Scrivs is the man behind the scenes and doesn’t hold back when it comes to his opinion about design. Great articles, great links.

David Cristian – @ColourOfAir
David is a web/graphic designer who has been in the business for a little over 5 years now. He’s an extremely creative person who actively shares great links on Twitter. You should give him a follow.

Veerle Pieters – @vpieters
Veerle is a Belgian graphic & web designer, author of Veerle’s blog (veerle.duoh.com) and founder of Duoh. She’s a colorlover for life who loves to listen to deep house music while designing.

Creattica – @creattica
Creattica is a gallery of great design and inspirational imagery, where only the best work is accepted and featured. Their site is a tremendous source of inspiration as well as their tweets.

Duane Kinsey – @Logobird
Duane is co-founder of Logobird Designs, an award wining logo and brand identity design company. He’s active on Twitter and has an impressive portfolio over at logobird.com.au.

Codrops – @codrops
Team Codrops is a fresh dynamic coding factory. If you’re interested in jQuery, HTML5, CSS3, etc. you should give them a follow. You should also check out some of their tutorials over at tympanus.net/codrops.

Smashing Magazine – @smashingmag
I’m not really sure why I included Smashing Magazine on this list, with over 1/4 million followers, you’re probably already following them. If you don’t know the name do yourself a favor and follow them now.

Shawn Ramsey – @shawnramz
Hello, I’m the author of this post and created bluefaqs back in 2009. If you’re interested in anything related to graphic and web design, you should follow me on Twitter.

What We Are Creating

Gather A Few Materials

There are only two resources that you’ll need to pull off this effect and one of them isn’t really even required. First, you’ll need a single or set of high-resolution watercolor brushes. For this specific tutorial, I’m using this brush set provided by WeGraphics. The second resource you’ll need is a paper texture. There are thousands of these available on the web, just look around at DeviantArt and you’ll find one suited for the job. Let’s jump into the tutorial.

Step 1: Background Placement

Choose a size for the project you want to work on and place the paper texture into the project. If you want to follow step-by-step, I’m using a 540px X 250px canvas size.

Step 2: Type Placement

Throw out some text on the canvas. Try to be more original than me and use a term other than the word “Type”. In my opinion a Serif font is more appealing with the watercolor look. Here, I’ve used the font “Fontin Bold” at 125pt with the tracking set at 25. The color of the text is not significant at this point.

Step 3: Layer Style Options

On the text layer, drop the fill down to 0% and double click the layer to bring up the Layer Style options. Add an inside stroke of 1px at an opacity around 44%. The color of the stroke should match the color that you plan to use with the watercolor brush. I went with the color #023d8b for this tutorial. This is what you should have so far:

Step 4: Select Text

Hold down (CTRL – for PC) or (CMD – for Mac) while clicking the thumbnail of the type layer to select the text. Now add a new layer above all others and make sure that you are on this newly created layer. The text should still be selected, indicated by a dashed line surrounding the text.

Step 5: Apply Brush

While on the newly created layer and with the outline of the text still selected, grab your brush tool and choose a watercolor brush that is larger than the height and width of your text. If you downloaded the set of brushes mentioned at the beginning of the article, try using the brush titled “Water 6″. This particular brush is 1,895 pixels wide and is plenty large enough to cover a line of text.

Make sure you have your foreground color set to match the same color that you set your stroke at, #023d8b for this example. Simply click on the layer to apply a watercolor effect inside the outlined text. You may have to repeat this step several times until you get to look the way you want, CTRL +Z is your friend in this case.

Remove the selection and you can see that the effect is coming along nicely.

Looks pretty good, but there is still one more step we can take to make it a bit more convincing…

Step 6: Apply Filter

While still on the layer where you applied the watercolor brush, go to Filter > Distort > Ripple… Change the amount to around 36% and the size to medium and hit OK. This will help to remove some of those straight lines and add a slight ripple effect along the edges of the text. You’ll see that the stroke remains in place allowing the watercolor to spill slightly over the edges.

Step Last (optional)

Once you’ve got your type all fixed up and in place, try using some of the other brushes to add some spills, splatters, stains and more to liven up the image a tad. Just remember, less is more.

Wrapping Things Up

So there it is, digital watercolor typography the easy way. There are a number of places where this type treatment could come in handy in both print and web design alike. If you enjoyed the tutorial, or know of some ways to improve it, I would love to here your thoughts in the comment section.

GreatLakes

Bauer

Gaps

Gnuolane

Bebas

Soolidium

Mentone

Days

Old Sans Black

Kimberly

Molot

Harabara

Franchise

Hit the Road

Suede

Savings Bond

Sertig

Headthinker

Lobster

League Gothic