I like February – it is the best looking month in the year 2009.

It's nice to be a Neighbour

Yesterday I took a closer look at a billboard advertising entertainment show It’s nice to be a Neighbour. And from the distance it looked well crafted ad, however standing right next to it revealed a big mistake. I was surprized that the agency who did this was so sloppy! The dog’s pee on the floor looks totally fake (photoshoped on the ad). And why? Because they didn’t erase the pee where the wood is vertical.

Since 2005 NetLife Research team publishes bad usability calendar and I have just downloaded and printed it. It features 12 great usability rules each year and illustrates them in a form of calendar.

You can download it on http://www.badusability.com/

2009

1. January: Content is king – fix it first!
2. February: Simplicity is overrated.
3. March: Adapt your website for mobile devices.
4. April: Synchronization has to work. Test with several systems.
5. May: Mix content where it adds value, not just because it’s cool.
6. June: Make sure your site follows common web standards.
7. July: Metaphors from other areas don’t always work on the net.
8. August: You don’t need a hierarchical website to get your message across.
9. September: Designing to suit yourself isn’t always a good idea. Get real.
10. October: Just because it matters to you doesn’t mean it’s important to everyone else.
11. November: Make some choices for your user. They don’t need to decide on everything.
12. December: If it ain’t broke, don’t fix it!

2008

1. January: Choose a presentation form that suits your content
2. February: Offer personalization only where it adds value
3. March: Keep novel choices visible; don’t hide information in dropdowns
4. April: Video is dandy – as long as it supports the user’s task
5. May: Don’t require Log in if you don’t have to
6. June: Who said usable has to be boring
7. July: Fitts Law: Bigger IS better – or at least easier to click
8. August: More navigation doesn’t always make your site easier to use
9. September: Don’t copy every fancy Web 2.0 element you see
10. October: Focus effort on your core content; the home page sees fewer visitors
11. November: One word: Oversharing
12. December: We’ve all seen enough Facebook clones now, thank you!

2007

1. January: Avoid graphic design take-over.
2. February: Give categories understandable names.
3. March: Write error messages in the user’s language, not the developer’s.
4. April: Don’t use colour as the sole way to get your message across.
5. May: Use real content in your prototypes.
6. June: Don’t fall into the “news site trap”. Avoid drowning your content in ads.
7. July: Restrain yourself: Avoid creativity for creativity’s sake.
8. August: If your search doesn’t work, remove it.
9. September: Be professional: typos, alignment errors and dated content undermine credibility.
10. October: Many relationships exist. Some of them are useful.
11. November: AJAX is cool, but only when it helps the user.
12. December: Choose the right genre for your content.

2006

1. January: Avoid pop-ups. They cover up the content and leads to unnecessary clicks for the users.
2. February: Give all pages suitable titles and subtitles.
3. March: Don’t make it complicated for the user to find the information on the page.
4. April: Red and green used together can lead to misconceptions for people with colour blindness (8% of all men).
5. May: Don’t let news and other information take up too much space from the main focus.
6. June: Don’t let the user wait. Avoid long downloading time.
7. July: Show important information in the same picture. Avoid scrolling, if possible.
8. August: Make sure the readability is good. Use plain fonts and limit the number of different fonts.
9. September: The users should know where they are at all times. The navigational hierarchy must be consistent.
10. October: Adjust the text for browsing. Bullet lists, tabulars and spaced out words make it faster to find information.
11. November: Use a language the users understand.
12. December: Practise minimalism. Avoid extra information and visual elements.

2005
(Translated from Norwegian with Google Translate)

1. January: Have a good contrast between text and background. Let users be able to read the text.
2. February: Do not use the arcane icons where users have to guess their functions.
3. March: Do not let the creative design destroy usability.
4. April: Do not use background images behind important information.
5. May: Present the information as simple and straightforward as possible.
6. June: Do not use hidden navigation so that the user must try and fail to find the content and features.
7. July: Be consistent! So users don’t exert themselves unnecessarily.
8. August: Follow standards and conventions! How can users use the experience from other solutions.
9. September: Let’s be clear what is interactive and what is not!
10. October: Do not use too small font size if you want people to read what you wrote!
11. November: Use alt text to make the content available to all.
12. December: Too much information makes people confused.

Slimbox is a light version (with some enhancements like navigation) of Lightbox JS. Lightbox can be described as a simple, unobtrusive script used to overlay images on the current page. You might seen both of them on numerous web sites.

Example of Lightbox:

Example of Slimbox:

But how to localize Slimbox into, for example, Slovenian language?

There are few things to do:

1. Localize the images (Next, Prev, Close)

2. Localize the text Image … of …

3. Change the keyboard keys which control Next, Prev and Close

1. Localize the images (Next, Prev, Close)

Under the folder /images you have four gif files: closelabel.gif, loading.gif, nextlabel.gif and prevlabel.gif. Just open the files (in bold) in yout image editor and delete existing text with localized version. Be also careful about the letter that will used for navigation – in original Slimbox c is used to close the overlay, n for next, p for previous (some other keys are also available) – and underline the appropriate letter.

Original Slimbox labels:

Localized Slimbox labels (in Slovenian language):

You can also download these three files as zip file.

2. Localize the text Image … of …

As you can see under the picture there is an indication of the number of pictures in the gallery and the number of the picture you are viewing.

For example: Image 1 of 5

You can change this in the file slimbox.js, line 144. Just replace words Image and of into appropriate words.

3. Change the keyboard keys which control Next, Prev and Close

In original Slimbox you can navigate between images with the following keyboard keys:

Next: n and right arrow
Previous: p and left arrow
Close: Esc, x and c

These can also be changed in slimbox.js, lines 106-108.

You must use JavaScript Character codes to represent different letters on the keyboard.

Therefore the keys are coded as:

Next: n (case 78) and right arrow (case 39)
Previous: p (case 80) and left arrow (case 37)
Close: Esc (case 27), x (case 88) and c (case 67)

And when you want to localize it, just map the right keys.

Example of Slovenian localization:

Next – Naprej: n (case 78) and right arrow (case 39)
Previous - Nazaj: j (case 74) and left arrow (case 37)
Close – Zapri: Esc (case 27) and z (case 90)

Example of the localized code (slimbox.js, lines 106-108):

case 27: case 90: this.close(); break;
case 37: case 74: this.previous(); break;
case 39: case 78: this.next();

Have fun using Slimbox!

Ermin couldn’t put it better in his post. I would just like to sum up the most important topic: use BCC if you are sending a message to people that don’t know each other & delete previous recipients.

If you need some simple video editing software, you can download VirtualDub. It is free, released under GNU general Public License.

If you look below … the video’s sound was removed with VirtualDub. Fast and easy.

Here is also a web page with some online video editing sites.

Here are some links for inspiration provided by Martin Mol and Jos van der Lee at last Kalidays – an international copywriting festival held last November in Ljubljana.

http://www.canneslions.com/
http://www.clioawards.com/
http://cresta-awards.com
http://epica-awards.com/
http://liaawards.com/
http://www.nyfests.com/
http://www.jongehonden.nl/
http://adhunt.blogspot.com/
http://sandeepmakam.blogspot.com/
http://adverblog.com/
http://sandeepmakam.blogspot.com/
http://digitalthread.com/
http://scene360.com/
http://www.designradar.it/
http://www.dexigner.com/
http://iblog.chubzz.com/
http://crossmind.net/cnt/news/news.php
http://k10k.net/
http://www.rootmagazine.org/
http://www.designiskinky.net/
http://luerzersarchive.net/products.asp
http://openad.net/
http://bitlounge.net/retrolounge/

Get your creative juices flowing while looking at these “advertising” sites ;)