Tilt shift photography is an effect traditionally achieved using small to medium format cameras and special lenses. The resulting photograph gives the impression that a life sized subject or location looks like a miniature model. I am going to show you how to quickly (depending on your processor speed) achieve this effect by using Photoshop.

First, you will need a photo taken from a good vantage point. Choose something taken from a high altitude or from afar. I took this one whilst walking along the Thames in London:

Now open your image in Photoshop and click the Quick Mask button located at the bottom of the tool bar (see image on the right).

Select the gradient tool and apply it onto the quick mask layer so that the areas you wish to be out of focus are red. See the screen shot below:

Now click the quick mask button once again, and go to Filter > Blur > Lens Blur. You will see dialog below:

You can then simply play with the Radius and other sliders to simulate your desired ‘depth of field’. Check out my final tilt shifted photo here. Have fun

The first person who can send me a nice 175×180 JPEG advert can have a placement just under my twitter status (on the right of this page) for one month! Just send the image itself, and the link to your site.

Please ensure that it is relevant to the content on this site (web design & development) and that it also looks pretty!

Send your image and link to rich(at)blemble(dot)com.

Why use cookies?

Using cookies can be very useful from a user experience perspective. They are used to save small amounts of data onto the users’ machine, enabling the site to use this data next time the user visits. This is particularly useful if you have an age-gate (maybe for a movie or an alcoholic brand) but you don’t want to confront the user with this each time they visit if they have previously confirmed a valid date of birth. In this situation, you can set a cookie on their machine (named ‘ageCookie’ for example) and give it a value of ‘true’ or ‘false’. You can then detect the value of this cookie next time they visit (if it exists) and perform the necessary actions.

Show me the code!

It’s simple, there are 2 core functions you will need: setCookie() and getCookie(). They are pretty self-explanatory, one sets a cookie on the users’ machine and the other gets a cookie.

Here is the code:

// This function will get a cookie from the users' machine
function getCookie(theName) {
var nameEQ = theName + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
// This function will set a cookie on the users' machine
function setCookie(theName, theValue, theDays) {
if (theDays) {
var date = new Date();
date.setTime(date.getTime()+(theDays*24*60*60*1000));
var expires = "; expires="+date.toLocaleString();
}
else var expires = "";
document.cookie = theName+"="+theValue+expires+"; path=/";
}

Once you have this code in your page, you just need to call these functions and pass the parameters. For example: setCookie('ageCookie', 'ok', 365);. Notice how I pass a value of 365 for theDays parameter. This will ensure that the cookie will stay on the users’ machine for up to 1 year (given that they never clear their cookies).

Things to remember/useful tips

• When testing the functions remember to enable cookies on your machine.
• It is always useful to use a debugger such as the Web Developer Toolbar or Firebug, both for Firefox. These add-ons will enable you to view the cookies on your machine, edit their values, and remove them.

Over the last few weeks I have been tinkering around with the popular web development framework, CakePHP. I’m a rookie at the moment (hopefully not for long) but I definitely recognize the benefits of using it.

Other popular web application frameworks include Ruby on Rails, Django, and the Zend Framework.

Model View Controller

Cake uses the Model View Controller (MVC) development pattern. When I first heard about MVC and looking into it a little further I found it very daunting and slightly confusing, but I’m not sure why because I now feel very confident working in this way! It’s a simple concept: the model represents the data of the application, the view handles the visual layout of the data, and the controller performs all the logic for the application.

It’s fast!

The most obvious advantage to me at this stage is speed. I know that with both Ruby on Rails and CakePHP you can ’scaffold’ your applications first. Basically, scaffolding (much like a construction site) is a rough structure for your application. You put the scaffolding up first, then start bulking the application out and replacing the scaffolding with your own code. It’s really great for getting something up and running quickly.

The scaffolding will automatically detect the fieldsets and datatypes in your database and generate all the boring CRUD (Create, Read, Update, Delete) code for you at run time, so you don’t have to sit around creating forms and can get a basic application up and running within minutes!

Another really nice tool is bake. This is a PHP command-line script (you run it from the shell), which will create all the CRUD code in files. So once you have scaffolded your application and are happy with all the forms/validation/relationships you can create an editable file using bake and start to customize the code.

Interfacing with JavaScript from Flash is pretty easy actually! It’s done with the help of a nifty little class called “ExternalInterface”. The process is simple; you import the class and then use the “call” method to call a JavaScript function on the parent page and parse any parameter you may want.

Here is a simple bit of actionscript demonstrating how to do this:

// Import the ExternalInterface class
import flash.external.*;

// Call the JavaScript function 'myFunction' and parse the value 'myParameter'
myMovie.onRelease = function () {
	ExternalInterface.call('myFunction', 'myParamenter');
}