Take the 2-minute tour ×
Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It's 100% free, no registration required.

I'm looking for online resources, image libraries, Photoshop actions, tools, or any other means of getting or designing bokeh images (those highly blurred pictures, with colorful circles) for use as backgrounds in web design.

Here are some relevant use cases for the aesthetics I want to recreate. One example from that site:

enter image description here

I tried searching these bokeh-like pictures on Google, Flickr, Dribble, Stock Image, but most of them have very low resolutions. I'm looking for pictures that share the same attributes as those relevant cases I linked above: not too bright (just so I can use any kind of text on top of that layer and still manage to make it readable) and with people on it, although highly blurred.

share|improve this question
1  
Thank you for making me look up "bokeh." en.wikipedia.org/wiki/Bokeh –  Lauren Ipsum Dec 13 '12 at 11:50
2  
Me too Lauren, me too. Downvoted as you haven't said anything about where you've looked or what you've tried. –  Ryan Dec 13 '12 at 12:41
    
Are you looking for anything more than photographs with out-of-focus areas? Bokeh is about the detailed characteristics of the blurring effect. –  e100 Dec 13 '12 at 12:43
2  
What a supportive community. First, you don't know what a bokeh image is (which is fine, even though it's a massive trend in graphic design), so you proudly brag about it; then, you downvote before I can actually follow any suggestions for improvement. Anyway, I'm glad at least you guys learned something today ;) –  João Ramos Dec 13 '12 at 14:10
2  
Friendly tip: there's a big red "0% accept rate" badge next to your name. People will probably be more friendly to you if you accept some answers to your earlier questions - communities are about give and take. Also, people use different terms in different places - the design trend where I am is usually just called "soft focus backdrops", since, like the gallery you linked to, it's rare to see them using photos that have that distinctive bokeh sparkle (since most photos don't have it). –  user568458 Dec 13 '12 at 14:40

4 Answers 4

up vote 5 down vote accepted

Make them yourself!

I don't know what your strengths are or what kind of software you use, so this answer might not be what you're looking for. I dabble in photography and I do graphic design for a living, and I don't typically purchase stock photography. So when I look at that gallery of blurred backgrounds, I start to look at how I can make it myself.

So, if you have access to a DSLR, this site shows how you can create custom bokeh shapes. Bokeh light tends to be round or polygonal because of the shape of the aperture mechanism (thanks, Wikipedia), but you can change it by fashioning a lens cover in the shape of something like a heart. This site links to Flickr images of some custom bokeh, as well as a gallery of people who experimented with this. There's even a kit for sale!

Taking good photos is much better than taking mediocre photos and making them work in Photoshop. But some of us are mediocre photographers or can't find exactly the right photo we want to work with, so why not find an image you like and try to get the effect you want? There are lots of blurs to work with (Lens blur is probably what you want), and if you study good bokeh, you can work to duplicate the effects. Stock photography tends to be a one-size-fits-all solution anyways, so it's good to customize.

share|improve this answer
    
I have to admit making these images myself, either by taking the pictures or by Photoshopping existing ones, was always on the bottom of my list of options. I did some pretty miserable, demotivating experiments a few months ago, but I guess I'll follow your suggestion and do it myself. –  João Ramos Dec 13 '12 at 16:42

If you're a photographer here's a great article on how to accomplish bokeh backgrounds:

http://www.photoble.com/photography-tips-tricks/how-to-7-quick-tips-to-create-bokeh-with-digital-camera

If you want to take an existing photo and make it have a bokeh like background here's a tutorial:

http://alfoart.com/bokeh_effect_1.html

...and here's a bunch more:

http://www.photoshopwebsite.com/photoshop-tutorials/15-bokeh-effects-photoshop-tutorials-100bokeh-brushes-for-free-download/

share|improve this answer

If you don't want or cannot create such images on your own, here are a few resources where you may find free bokeh images:

Bokeh images on Flickr with Creative Commons CC-By license:

https://www.flickr.com/search/?q=bokeh&l=commderiv&ct=0&mt=all&adv=1

These image require attribution, so they may not be suited for your templates ... depending on if you find a way to give credits.

Public domain bokeh images on Pixabay:

http://pixabay.com/en/photos/?q=bokeh

These images are completely free - also for commercial use. But you don't have such a huge choice as on Flickr.

share|improve this answer
  • DIY with a long and "fast" lens; that is, one with a wide aperture. If your friend has an SLR with a big lens; that's the one you want. Set it to portrait mode and shoot.
  • Load Photoshop and run "Lens Blur" on an existing picture, but you'll have to make a selection first. I suggest going the other route, since this takes more time and finesse to look convincing.
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.