The goal is to find the best method that maintains quality when scaled, but is also easy to implement and edit. The full criteria:
Probably the most obvious method for adding texture to a shape is to create a normal bitmap layer, fill it with a colour, select Filter > Noise > Add Noise, then apply a Vector Mask to match the element you’re adding noise to.
Using a high amount of noise, setting the layer blending mode to Luminosity and reducing the opacity will yield the most amount of control over the noise with the least amount of disturbance to the underlying layers. A noise setting of 48% gives a high dynamic range without clipping the noise (clipping results in higher contrast, which might not be desirable).
Adding an Inner Glow Layer Style with the source set to centre and size to 0 will let you use the noise slider to add texture to any layer. It’s a good solution, provided you’re not already using the Glow Layer Style for something else. The noise is added above the Colour, Gradient and Pattern Layer Styles, which is great.
Unfortunately, the noise can only lighten or darken the underlying elements. The previous, bitmap layer method can add highlights and shade at once maintaining the average luminosity, and looks far better in my opinion.
Create a Solid Color Layer, convert it to a Smart Object, select Filter > Noise > Add Noise, apply a Vector Mask to match your element, set the layer blending mode to Luminosity and reduce the layer’s opacity.
It’s a fairly involved process, but can use a combination of effects that will be remade if the document gets scaled. Neato.
Start by creating a noise or a repeating pattern in a new document, then choose Edit > Define Pattern. Once you’ve defined the pattern, it’ll be available in the Pattern Overlay Layer Style options. As with previous methods, using Luminosity as a blending mode and reducing opacity to suit yields great results.
The Pattern Layer Style is composited below the Color and Gradient styles, ruining an otherwise perfect noise and texture method. Although, you can create a second layer that just holds the texture if you need to, or start with a Gradient Fill layer, sidestepping the limitation.
I can’t help but think it’d be nice if Photoshop included a noise slider as part of the Color Layer Style. It’d certainly be handy and a lot simpler to use than most of the other methods outlined above. I have asked Adobe nicely to include the feature in Photoshop CS6. Maybe it’ll make an appearance some day soon.
Although a little cumbersome, creating a Gradient Fill Layer, adding a Pattern Layer Style then creating a Vector Mask seems to be the best method possible. It can be used to create flexible, scalable and editable single layer UI elements with a texture. As an added bonus, Gradient Fill Layers can be dithered, so it also produces the highest quality results.
I’ve created some examples below and included the source document, so you can see how they were built. Enjoy.