Craig Jamieson - Don't be a square

Don’t be a square

Facebook is constantly evolving and one of the more recent changes is the way we handle images in posts. With the wall getting wider, the square we have gotten used to is now a rectangle. So I have started exploring how this new shape is being handled and how you can best design for it.

Square post

square

Rectangle post

rectangle

The rectangle is wider, which gives you more real estate in which to design. The aspect ratio is 16:9 like the average photograph, unlike polaroids and Instagram

1013656_10151416585716637_572472446_n

You can use larger images, I like to make them big so that when you view them in the gallery, they have some substance, but remember to keep the aspect ratio and that the larger the file, the longer the download.

large

Something else I have noted is that it does not crop right to the edge, so it might be a good idea to ensure your design does not go right to the edge.

crop

There is a border around the images, it’s not a light grey, but rather a transparent line as you can still see some of the image through the line. Remember to add that when doing Facebook design mockups. Just in case that confuses anyone, you do not need to add the border for your final image for Facebook, that’s a style the site applies, but in your actual mockup for client presentations etc.

edge

I still think these images are being used in other sections of Facebook, so don’t forget about the square, keep the focus of your image in that square space.

square-thumb

I am currently looking into how cover images are being handled as I have noticed some shifts in it’s usage too and will post something soon.