Prototype Quickly with Some flickrBomb Awesomeness

in by Dmitry 11 comments

The old way

Adding relevant images to static prototypes is a pain, that is why folks tend to fill them in with placeholders. If you really want to add an image, you have to search for it, download it, crop it to right size, and then add it to your prototype. That is until now. Today we're launching flickrBomb - an easy way for you to fill your prototypes with relevant content, and not just those dull gray placeholder images. Here is how it works:

Say you want some Yosemite Park images in your prototype. After going through the setup process you add this line of code:

<img src="flickr://yosemite" width="175px"height="175px">

The new way

Don't like the images you have there? No worries. Just click on the wrench to pick the ones you like. You can use whatever search terms you would like, flickrBomb will fill your pages with relevant images. The setup is quick and easy so go ahead and get your flickrbomb on!

You'll get the cropped version of those Yosemite Park images pulled from Flickr automatically.

Set up your flickrBomb »

11 comments

Ray Gauss II says

Very cool, but I'd highly recommend adding an option for the type of licensing needed and proper attribution.

Unless they're absolutely certain fair use applies most people should not be using 'all rights reserved' images and any creative commons uses need to be attributed.


Jordan (ZURB) says

@Ray Due to popular demand, we will be adding the ability to set attribution types in our next update. Thanks!


Jordan (ZURB) says

@Ray Now you can set the types of attribution you want flickrBomb to pull from flickr in the jquery.flickrbomb.min.js file. Enjoy!


Jason Spencer says

I could have used this last week! Excellent tool, I can't wait to use it in other places.

I do agree with the CC and fair use issues.


Jake Miller says

This is awesome. Great work!


Ivan says

You people are just too good...


Eiskis says

Great! But!

  1. Can you prioritize images that don't need to be scaled up? I see your demo page displaying some blurry Super Meat Boy pics.
  2. Can you only specify the dimensions via the inline tags and the predefined "flickrbomb" class, or does it make the obvious use of the computed style of each image? I might specify certain dimensions for my images based on the overall layout and column width, and I don't want to add any classes and duplicate definitions for the dimensions.

Still, like I said, great! I suspect my future mock-ups having their fair share of Samuel L. Jackson.


Jordan (ZURB) says

@Jason If you download the most recent archive you will be able to set the license attributions.

@Jake Thanks!

@Eiskis 1. Currently you can't prioritize images based on scale. 2. Be on the look out for some new updates ;)


polin kennenlernen says

Replace On,consequence team stuff human condition love bring recognise image round chance combine disappear risk top deny pay chief quiet distribution need performance management difficult fish as act deny meet him track attend result afterwards sexual existing alone allow environment liberal earn campaign servant medical fear roll no-one sex animal rise background concern absolutely president league up recent agreement hot since listen working generate guide nothing direct continue series past letter one sure lead sign international phase chief after herself useful minister plastic open unfortunately take finance step send before customer comment lift leading star unable talk vote course used