Day to day
About me
Books
Presentations
Workshops
Trends
Favicons, the minilogos used by companies, governments and personal brands are starting to move. Futurist Erwin Van Lun is taking the lead by putting six different creative animations on his website (=this website). This makes him the first in the world to make such a creative expression part of a personal brand strategy.
The small icons can be seen in the address bar, favourites and tabs when browsing with Firefox. For each tab there’s a different favicon. On opening the page the favicon will be still for a little while, to avoid irritation, but it’ll start to move subtly when the visitor stays on the same page for a while.
Van Lun’s animations consist of movements of his own head in combination with attributes. For example, in the ‘trend’-favicon he appears to be playing tug of war with himself (using a red thread he’s proverbially showing in trends).
Below are all the favicons, with the difference that they start immediately on opening the page. The real favicons start later to avoid irritation.
: Animation with my name. Typical personal brand strategy choice.
: a small sequence of gestures and emotions.
: busy with a pile of books.
: I’m busy with post-its.
: audience left, audience right, audience in the middle.
: always looking for the red thread.
The favicons only animate in Firefox. Currently 40% of the visitors to ErwinVanLun.com use Firefox. For his Dutch equivalent that’s only 20% of the visitors.
The creations fit seamlessly with his personal brand strategy. As a speaker Van Lun has developed a very strong ‘personal brand’ and wanted his animations to strengthen his brand.
As a brand futurist he adds: “Personal brands will benefit from using their own face as logo and favicon. Furthermore this kind of development fits with the trend in which brands bring their logo to life, the brand visualisation. I hope to inspire commercial, innovative non-profit organisations as well as personal brands with this modest innovation.”
Tx Nishadha. The colors are part of my strategy.
When you meet me in the physical world, I will always wear black trousers and a colored design shirt.
Green: the color for blogging. So when I’m @the office, writing on my blog, I wear a green shirt.
Light blue: this is the default color. When I go to a network meeting or an event as a particpant, I wear this color.
Dark blue: when I’m being interviewed about my book.
Turquoise: this is the typical color I wear when I facilitate workshop.
Purple: the color for my presentations, the main part of my work.
Red: the color for trends. For example when I’m asked as a trend analyst.
So in this way, the different tabs, and different favicons add up to a single (personal) brand experience.
Erwin,
Really great post and favicon set dude. Totally impressed and subscribed.
I think its somewhat difficult to notice the change , if there is no animation . Anyways , I would say that this is a well executed great idea .
I also liked the way you have designed your navigational tabs . Really impressive and apt emotions, LOL 
..
@techknowl: tx
Just to be sure: you do see the animations, do you? Else: do you use Firefox?
btw: i would love to have custom emoticons in my site such as
That’s also on my wish list.
Yea I use Firefox and I can see those favicons and animations .
Is there any service online that lets you convert your images to an animated favicon?
How did you get different favicons for each page? I thought you only could have one per domain?
There are many services out there to create animated favicons with a tool like photoshop allows you to create animated gifs, so that’s what we used.
You can have a different (animated) favicon per page. You can even change the favicon per page if you use a script (still have to figure out how this works).
Currently the HTML of this page looks like:
<link rel=“shortcut icon” href=“http://www.erwinvanlun.com/images/design/favicons/new/home.ico” />
but the favicon of my presenation tab is:
<link rel=“shortcut icon” href=“http://www.erwinvanlun.com/images/design/favicons/new/lectures.ico” />
muy interesante… la verdad muy interesante, ya lo implementare en pagina web.
gracias por los datos
Thanks Daivid!
My Italian (is it Italian?) is not that good, but hopefully it’s a compliment
Hi Erwin… great post.
How did you convert .gif to .ico?
is it possible to call gif file with html code?
You simply add a line like this:
.ico to .gif is (as far as I remember) a matter of renaming the file.
Call the gif file:
<link rel=“shortcut icon” href=“http://www.erwinvanlun.com/images/design/favicons/new/home.ico” />
Each tab has a different gif
The tab ‘trends’ has it like this:
<link rel=“shortcut icon” href=“http://www.erwinvanlun.com/images/design/favicons/new/trends.ico” />
Really professional impression. I heard from one dutch internet marketeer that he always uses one single picture so that everyone knows who he is and what he looks like.
Who is ‘liefdesverdriet?’?
Over 2,000 professionals read the 10 most important innovations in the TrendUpdate every month!!
Twitter
http://www.erwinvanlun.com/{uri"}
Contact: Erwin van Lun, +31 621 567 657 (GMT +1), print@mensmerk.nl
Reaction by Nishadha op Feb 14, 2009 03:39
Very interesting concept and very nicely done. I think this will be very useful for large sites like news sites that have different sections for different users. But if you are looking for personal branding this might get in the way since you are showing six different favicons for different sections. I suppose it all comes down to the audience of your blog and how useful they find it.