There's been a lot of talk in the web design world recently about 'emotional design' - which involves creating a distinct personality for our interfaces. This thinking has inspired the latest makeover of textbook price comparison site SlugBooks.com - which describes itself as "Kayak for college textbooks".
The different sections of the site have been given 15 specially-created cartoon characters to represent different subject textbooks, and the books move as various form inputs occur. Nothing to do with functionality; everything to do with making the experience fun and engaging for viewers.
SlugBooks founder and CEO David Miller is keen to make sure the new elements of emotional design are helping, not hurting sales of textbooks via the site.
"I'm a huge supporter of websites developing their own branding/personality, but having a pulse on the analytics is very important, especially when you entering those murky waters of branding," he tells us. "So we're always monitoring if there is a subject that is underperforming."
"For example, our dance textbook couldn't keep up with the rest, while our chemistry textbook has consistently been among our stronger performers."
And those cool animated effects? "The autocomplete forms are sync'd to the character pointers through CSS and JavaScript," explains Miller. "This allows us to show the user that the books are moving as they go through the form elements."
Now read these!
- 101 CSS and JavaScript tutorials to power up your skills
- 10 stunning examples of animation with CSS3
- 20 inspirational examples of CSS
