# How do you create "noise" in computer designs?



## Travis86 (Dec 23, 2004)

I look at some designs like wwd07.com and Superchick's CD (attached) and I notice how they have "rough" areas. (The blue and white "broken glass" stuff on ww07.com and the maroon paint stuff on the CD. How do you create that on a computer? I have very high-end software (Studio MX 2004, Photoshop CS, etc...), but I've never seen a way to get that sort of effect. If the designers of ww07 had to place all of those blue triangles there by hand, it would take forever!

There must be something I'm missing. What is it?


----------



## ElDiabloConCaca (Dec 23, 2004)

It all depends on what effect you want and what you're trying to achieve... sometimes, and I'm not saying this specifically about you, you just need plain old artistic talent and creativity.  I'm sure the blue triangles weren't placed there by hand.  It seems like it started out as a solid blue piece, then some sort of broken glass filter or combinations of filters were applied, then it was rotated and the perspective changed, or something similar to that... I know for a fact there's a built-in filter that can achieve similar effects in Illustrator.

For the rough edges, I found this little tutorial that may help a bit:
http://webreference.com/graphics/column21/3.html

That site probably has a lot of other tutorials on similar effects.  

This site has a few good tutorials as well:
http://www.good-tutorials.com/tutorials/2/460


----------



## Travis86 (Dec 23, 2004)

Well, it's certainly true that if you can't imagine it, you can't do it, but will the tools at my disposal, there's no way that I could do that. I looked through Freehand a lot and tried to find some sort of filter like the Illustrator filter you mentioned, but there just isn't one like that. There's a couple of filters that might be a little close, though.

Still, random effects in computer-generated art aren't just one kind. The ww07 and Superchick random effects are very different in practice, but very similar in idea.
I think more software is what I need, but I just don't know what will do this sort of thing.

Thanks.


----------



## arri (Dec 24, 2004)

<off-topic> sorry for ventilating my opinion, but to be honest i don't really understand why a lot of designers always tend to copy 'effects' that are 'hip' .. 
i see this kind of stuff everywhere, i would rather create something new of my own..
but that's my taste/opinion </off-topic>


anyway, for creating this kind of stuff (random/generated/algorithmic) you could lokk into any software platform that alows you to actually program the algorithms yourself..
either hard-coding in c++ or java, but you could also look at for instance max/msp/jitter/softVNS, PD/gem/pdp, or scripting languages like director-lingo/-javascript, flash/-actionscript etc..
you could create similair effects dynamically on your website with flash, or even with php on the server-side. there's lot's of ways, but you need to know how to programm...
advantage of pd/gem/pdp and max/msp/jitter/softVNS is that they are visual languages, so you create 'code' by dragging boxes and connecting those with wires.

if you look here for instance: http://www.bleu255.com/
this design is mainly created with PD/GEM/PDP
This guy only created the software, and set certain parameters, the rest happens automatically, based on parameters the software gets from traceroutes to ip-adresses, and mapping network-topoligies. he also creates music with the same software.
be sure to check the movies on the right side of this page:
http://www.bleu255.com/stm3.php
(nice detail; the microsoft.com domain generated really dark and scary sound and visuals)..

PD/GEM/PDP is opensource / and available for all platforms
the rest is proprietary (except for php ofcourse)


hope this helps
arri


----------



## Travis86 (Dec 24, 2004)

I wasn't able to get a real straight explainatoin of PD/GEM/PDP on the Internet. I think it might be sort of what I'm looking for, but I don't really know. It seems to be an audio thing mainly... 

Do you know where I could find a straightforward explaination?

Thanks.


----------



## arri (Dec 24, 2004)

ehm.. well, that might be a bit of a problem yes,
there's not so much official documentation, the best is probably here:
http://crca.ucsd.edu/~msp/Pd_documentation/index.htm

but there's lot's of examples, and quite a large user-group,
and mailing lists
but it's a bit scattered over the net.. so a lot of googling.

i just discovered that the pure-data.org domain is not functioning anymore,
here are some links that might get you started :

http://zwizwa.fartit.com/pd/pdp/overview.html
http://zwizwa.fartit.com/pd/pdp/
http://homepage.mac.com/WebObjects/...tefn=TKSite.2.xml&aff=consumer&cty=US&lang=en
http://ydegoyon.free.fr/pidip.html
http://crca.ucsd.edu/~msp/software.html
http://iem.kug.ac.at/mailinglists/pd-list/

but maybe you want to download (cycling74.com) and try max/msp/jitter first to get an idea of how the environment looks and feels.. max/msp/jitter is very easy to install, and you can try it for free the first 30 days. max and pd use a very similair approach in programming with objects (boxes) and wires, messages etc..
PureData/PdP/Gem requires a bit more effort to get it running, like installing tcl and x-windowing systems, and hasn't got that much built-in documentation

goodluck


----------



## texanpenguin (Dec 25, 2004)

For rasterised noise, just go find some good grunge brushes for Photoshop


----------



## quiksan (Dec 27, 2004)

if you want a grunge sort of look applied to your background/edges/images, etc then here's a fairly quick and simple trick:

1 - do a google image search for a really 'noisy' image.  something with A LOT of lines and stuff that clutters it up.  Cranes and docks generally are good (see the image I attached as an example)

2 - open the image in photoshop, and do the threshold to your liking, based ont he image you use.  (see attached)

3 - select the black (or white, whichever has better grunge for your tastes) and move the selection to the image you want to noisy-up

4 - move the selection around the image you are working on and delete the selected (grungy) area as needed to create the effect you want.

(attached final result)


----------



## chevy (Dec 28, 2004)

You can also work with stone pictures, wall pictures, trees pictures... do non-linear edition (threshold) to create masks.


----------



## smithy (Dec 29, 2004)

Okay, well i always do these grungy effects and basically there's to ways that i do it. 

One basically wat Quiksan did - though i actually convert the image to greyscale and adjust the levels to my liking (though i actually use fireworks mx04)

Two - get some brushes. You can make your own photoshop brushes or just download some. Sometimes it would help if u actually used a grungy brush and use it on a new document then select it out and use it repeativly on the project your working on. 

Oh and another way is use ur wand and select parts out of basically any image you will find and then use the colour fill and use that. (though it doesnt really give you the best effect). 

There the simplest ways


----------



## Natobasso (Dec 29, 2004)

Another great way to get the grungy effect of the sample Superchick image is to actually print out a rough border or image (per the suggestion above regarding using Threshold) on a piece of paper, put it on a copier and then scan the result back into the computer.

 Sometimes the best raw and/or natural effects are accomplished via "analog" means.


----------



## Travis86 (Dec 29, 2004)

Reminds me of that picture that was going around in e-mail a few years back that shows how computer-illiterate people print things out. It shows a monitor face-down on a copier. (I tried and tried to find the actual picture, but I couldn't)

Thanks for the advice, I'll see how it works.


----------



## chevy (Dec 29, 2004)

Travis86 said:
			
		

> Reminds me of that picture that was going around in e-mail a few years back that shows how computer-illiterate people print things out. It shows a monitor face-down on a copier. (I tried and tried to find the actual picture, but I couldn't)
> 
> Thanks for the advice, I'll see how it works.



Typical Windows "print screen" procedure. Why isn't it name "copy screen" now that it doesn't end up on the printer anymore ?


----------



## Natobasso (Dec 29, 2004)

chevy said:
			
		

> Typical Windows "print screen" procedure. Why isn't it name "copy screen" now that it doesn't end up on the printer anymore ?


 Sometimes it does, sometimes it doesn't. I am still looking forward to the day when we don't have to print anything at all. As a society, a PLANET, we're still very dependent on paper. (But this is an entirely different discussion!)


----------



## ElDiabloConCaca (Dec 29, 2004)

Natobasso said:
			
		

> As a society, a PLANET, we're still very dependent on paper.



I'm very much looking forward to the day when I can wipe my butt with a PDF.


----------



## Natobasso (Dec 29, 2004)

You can! It's called a Palm Pilot.


----------



## Scott_Bernard (Jan 1, 2005)

let's make some noise!!!
just put in your search "grounge brushes" and you will get losts of links with downloads and tutorial about this...
if you like the brushes i've used in the pict just email me!


----------



## Travis86 (Jan 2, 2005)

Heyyyy... Now that's the look in the Superchick CD.

Grunge brushes. I'll see if I can find some.

Thanks!


----------



## Travis86 (Jan 3, 2005)

Ok, brushes seem to do the trick, now it's just a matter of getting the best ones. I got the ones from Dubtastic.com and they seem to work pretty well. My little tryout picture could be better, I suppose, but it's just a sketch. Truely-Sarah.com has some interesting brushes, but they are under a very restrictive agreement.

Which grunge brushes do you use?


----------



## Scott_Bernard (Jan 3, 2005)

here are my basic kit 

http://www.sgavisual.webhop.net/

just download the "brushes" file and load it in PS...

Happy Pahotoshoping


----------



## Scott_Bernard (Jan 3, 2005)

in case you get lost with the url of above...

http://webs.sinectis.com.ar/arcucci/brushes



Ctrl + click, and save link to disk...


----------



## Travis86 (Jan 3, 2005)

Those are some mighty good grunge brushes! Much better than most of the Dubtastic brushes.


----------



## Scott_Bernard (Jan 3, 2005)

I hope see cool artwork whit these brushes 
Good luck!


----------



## Travis86 (Jan 4, 2005)

I had never realized the power of brushes. It seems strange to me that I never found this out. But, all that aside...

I've been using the grunge brushes, I'm downloading a bunch of grunge fonts, making grunge designs, etc. I would like to not get myself locked into this one genre of art. I have been looking for more Photoshop Brushes, but I can't find any. The ones I do find are all under "non-commercial", "personal use", or "link back to me" licences. Since you have such nice grunge brushes, I figured you might know where to find better brushes of other kinds.

Thanks.


----------



## arri (Jan 31, 2005)

also look at brushes in illustrator;

a collegue showed me some funky brush-stuff.
create a brush (path/vectors) yourself, and after that just paintbrush this vectors all over your canvas, then select anther tool to paintbrush effects like scale, rotation color variation over the previously brushes verctor.. 
creates crazy chaotic, yet completely controlled stuff..
i'll try post an example if i have time to make somethign


----------



## brianleahy (Jan 31, 2005)

Travis86 said:
			
		

> I've been using the grunge brushes, I'm downloading a bunch of grunge fonts, making grunge designs, etc.



It might help to also listen to grunge music.
Talk about 'creating noise'....

 I'm just in a jokin mood here.


You could always snap a closeup photo of some noisy background (gravel, sand, grass, asphalt, garbage) and throw it into a nearly-transparent layer to add some texture to your nice-neat image


----------



## chevy (Feb 1, 2005)

If you need real noise, take a picture of an old TV set on without antenna... the noise is real noise.


----------



## Natobasso (Feb 1, 2005)

Place the photo in illustrator (or photoshop) and use any number of CS suite's rough brushes. They work WONDERS.


----------



## Natobasso (Feb 1, 2005)

Hey doods. I just created a blog for San Diego designers, but all are welcome. Drop me a line at http://www.thesalon.blogspot.com


----------



## Lt Major Burns (Feb 4, 2005)

i agree with some other posters.  instead of trying to get photoshop to *try* and *emulate* all these effects, imagine how the effect it is trying to emulate was originally concieved.  turn a tv on a channel that's not tuned - real analogue noise! get some spray paint and spray in really random patterns, mask bits off and get overspray - all cool effects - you feel good for actuallly doing them. rescans are fun dso try that for a text idea


----------



## jambamatt (Feb 18, 2005)

Most discussion here is about the dirtier noise on your attached picture, but the link you posted - the blue and white noise - is a lot of crisp shapes.
For any sort of effect where you want to create a large number of slightly different shapes, a cool tool, is Illustrator's 'Scale Each' function.
First you'll need to cover a large area with the same shape using cut and paste , or duplicate etc.
This 'Scale Each ' command normally allows you to scale or rotate a number of items all by the same amount, but it has a little checkbox named 'random' allowing you to start with, say, 100 identical triangles in a grid but randomly move, size and rotate each of them all at once to create very chaotic patterns.
When you combine this with a distorting filter in Illustrator, like 'punk', you start to get the noisy yet clean shard shapes in your weblink.


----------



## Travis86 (Feb 18, 2005)

I'm beginning to think Illustrator may be the tool I'm looking for to make "clean grunge."

Welcome to MacOSX.com, BTW.


----------



## Tommy MacAddict (Mar 15, 2005)

These effects can be done by creating vector mask and appling them over either solid layers such as the one in the pic you attached or over images, the effects are limitless. Play around appling different mask you have created either by had then scanning them in or I have created grunge by creating vector mask on the computer. Example of creating a mask by hand: Take watercolor paper, black ink and create a grungy look. Scan it in then apply it over a solid color layer and see how close you can come to the image you attached. I feel this could be recreated. You will be surprise by the effects you can get just using your imagination in this manner. I have created very original effects on some CD covers this way. May be a backwards way or not the easiest but they are original. Good luck.


----------

