Remember when MapQuest was the online map site? Then Google came along and rained on their parade in 2005 with their dynamic-loading AJAX secret sauce which enabled you to infinitely pan around the map. Ever since then, MapQuest has been dead to me – until now.

The AOL-owned site unveiled their new look today and it is a complete revamp. Their logo took a turn from a comic typeface to a more serious, sans-serif one. Reddish-marroon, out! Green and purple, in! The new branding will certainly take some time but there is more to this re-launch than a new log0.

MapQuest has made their maps look more like paper maps. Well what do I mean by that? The color choices by the MapQuest team are really spot on. You might not really think about it, but the distinct colors used by MapQuest make their maps easier to read. Major interstate highways are blue, secondary highways are an orange color, and streets are yellow. This visual hierarchy of most important roads to least important helps focus your attention as your looking around. Compare this to Google Maps where the colors are so similiar that the roads kind of blend together.

The label style on Google Maps is a bit easier to read than MapQuest as I think Google Maps is better for locating city names and MapQuest is geared more towards a visual search of a map. For a more in-depth analysis about map design, see A Brief Comparison of Google Maps, Bing Maps, & Yahoo! Maps by 41Latitude.

The new MapQuest layout is akin to Google Maps with two-thirds of the screen dedicated to the map and the left third of the page for search and directions. Along the top of the map is a carousel navigation featuring groupings of locations like grocery stores, bars, and gas stations. It’s a well done interface for finding nearby attractions on the map.

Most people stick with MapQuest because they trust their directions over others. After a couple of test searches, I prefer the directions from Google better. But MapQuest is more enjoyable to just browse around. One feature MapQuest did really well is right clicking anywhere on the map will bring up the address of that location. Sure the address is an approximation, but the map bubble that pops up gives the house number, street, city, and zip. Sometimes there is even a 360 degree view just like Google’s Street view. MapQuest’s street view feature is more basic but I find it more intuitive to pan around. It doesn’t take up the whole screen and its easy to just pop in, pop out and continue on your way.

Will I’ll drop Google Maps and make MapQuest my dedicated online mapping service? Probably not. Google Maps has too many extra features for a power user like me (auto complete, public transportation, scroll wheel to zoom in/out). But for those people that feel Google Maps is too complicated and  hard to use MapQuest provides a clean, easy to use mapping site that is geared for people like them. I would easily recommend MapQuest to an average computer user while Google is for people who want more features.

The more competition the better for all of us. MapQuest has certainly stepped up it’s game and I can’t wait to see what else they have in store.

http://0to255.com/ – “0to255 cures your color manipulation woes. Simply pick the color that you want to start with and 0to255 gives you a range of colors from black to white using an interval optimized for web design. Then, just click the variation you want to use and the hex code is automatically copied to your clipboard.” My favorite part is that it uses a RESTful API so you can do things like http://0to255.com/0099ff You know I just love things that you can manipulate with a url.

http://cssdesk.com/ – A tool for quickly mocking up snippets of HTML/CSS. I would prefer to just create a new HTML file in Dreamweaver and play with it using Firebug, but this could work too. I found the cursor in the HTML/CSS box to be a little off when hitting return. CSSdesk has a nice interface which is almost like a desktop application. And since you can download it and run it locally, I guess it qualifies as a genuine application.

Please Do Not Change Your Password – Alot of security’s best practices cause more problems than they solve. “At countless conferences and seminars, experts have consistently called for more education and outreach as the answer to user apathy or ignorance. But the research of Herley and others is causing many to realize most of the blame for noncompliance rests not with users, but with the experts themselves — the pros aren’t able to make a strong case for all their recommendations.”

Holistic Web Browsing: Trends Of The Future – “The future of the Web is not at your desk. It’s not necessarily in your pocket, either. It’s everywhere.” How do we design for a Web that was only intended to be used in a single context?

WTF? (Video) – “This clip comes from Hard Ticket to Hawaii, possibly the worst 1980’s movie made (though to be fair, it’s tagline of Bombs, Babes, and Beaches is quite… radical).” At first I thought the acting was WTF, then I saw the ending.

“How many SEO copywriters does it take to change a lightbulb, light bulb, light, bulb, lamp, bulbs, flowers, flour…?” — Chris Rowe

typophile.com had a type battle for members to design a new logotype for digg.User aluminum posted this fine Bing version of the digg logo.

It’s a clever idea since both brands are 4 letters and the second letter is an “i”.

(via dburka, the creator of the digg logo)

I’ve been thinking about redoing my personal brand with a new site design, a new logo, and a whole new Russell Heimlich. Design isn’t exactly my strong suit, or maybe your hardest client is yourself, but this could be a long process. So my first step is to do lots and lots of research including perusing some fonts. Below are some of the more interesting ones I’ve found.

3Dumb & 2Dumb – A hand-drawn 2d and 3d block letter san-serif font. It kinda reminds me of the movie Juno.

Lefty Dave – Another hand-drawn font but this one looks just like the writing from a lefty which, as a southpaw myself, attracted me to it.

Zitti – A rounded font with no counters (the empty space in R’s, D’s, and O’s).

Jabjai – Another cartoony, 3D block letter font. Only uppercase letters available.

Val – A big fluffy-like-a-cloud font.

None of these really say me, but I thought they were interesting and worth sharing. I hope to make another update about my personal redesign after this weekend  when I work on this some more.

AOL offered a glimpse into their re-branding today and most of the web was left dazed and confused (55% of the respondents to a RedWriteWeb poll hated it). AOL simply decapitalized the “O” and the “L” and added a dot at the end. While the logo itself will stay the same, the background will change continuously foregoing a traditional mark.

It’s certainly an off-kilter strategy but a good fit for a company trying to reinvent itself. I’m a fan of the new look.

The dot part wasn’t really explained well in the media coverage. Aol. plans to brand their various properties like Aol.Shopping and Aol.Mapquest. It’s meant to tie all of Aol.’s vast content together.

As for the random background images, I think it is fun and keeps things interesting. Bing is doing the same thing with their background images on the main search page and Google’s doodle logos are in a similiar vein. MTV, a company outside of the Internet space, is famous for the many variations of it’s logo. Aol.’s re-branding strategy certainly isn’t anything new and in fact feels more like the front end of a trend.

While Aol.’s re-branding efforts are modern and edgy now, I doubt it will have the lasting power of their previous branding.  It’s not perfect but it’s just what the company needs as it prepares to go alone as it spins off from Time Warner. Besides, look how many people are talking about the company after so many years of media obscurity.

I forgot how children’s books can really stir up the imagination. The other night I was looking for a book that I had when I was a kid but couldn’t remember anything about the title, author, or publication date. What really stuck out at me was the illustration style. Along the way I discovered these illustrations from vintage children’s books.

Is There Life in Outer Space? Franklyn M. Branley ~ Don Madden ~ Thomas Y. Crowell, 1984

Angus and the Cat Marjorie Flack ~ Doubleday, 1931

Tico and the Golden Wings Leo Lionni ~ Knopf, 1964

Yellow & Pink William Steig ~ Farrar, Straus and Giroux, 1984

The Three Robbers Tomi Ungerer ~ Atheneum, 1962

Rotten Island William Steig ~ Godine, 1984

Tommy’s Trip to the Moon Illustrated by Elisabeth Halfdaner ~ English text by John Cotton ~ c.1950s (book is not dated)

More sources for vintage children’s books inspiration:

• Vintage Childrens Books Flickr Pool
• VintageChildrensBooksMyKidLoves.com
• Childrens Books Online
• Book-By-Its-Cover.com

And the book that I was looking for was Drummer Hoff from 1968 illustrated by Ed Emberley. I love this book so much that I bought a signed copy on eBay after figuring out what I was looking for.

Firebug is the web developer equivalent of a hammer to a carpenter. In other words without this valuable tool hundreds of thousands would not be able to do their job and make the web what it is today. So even small changes to the interface are going to ruffle some feathers.

I spent a good half day trying to figure out why my precious Firebug wasn’t behaving like its usual self. For one thing, it wasn’t showing JavaScript errors in the status bar icon like it usually does. It also displayed a message saying “Reload to activate window console” whenever I would bring it up. This makes debugging impossible if I have to keep refreshing the page everytime.

It turns out the Firebug developers made a teeny, tiny tweak to the interface. The screenshot on top is the newer Firebug, version 1.4. The bottom half of the screenshot is from an earlier version. See the difference?

The ‘X’ used to hide the Firebug window in older versions has been replaced with an Off button. Unfortunately the Firebug developers changed the behavior as well. The Off button deactivates Firebug for that website which explains why JavaScript errors disabled in the status icon. The button that I have come to accustomed to for minimizing the Firebug panel is that circular down-ward arrow about 50 pixels away.

This is a usability nightmare!

1. The hide Firebug functionality isn’t where the user expects it, especially for long-time users who have developed a muscle memory
2. The Off button is ambiguous to what the action does (a better word would be deactivate, though that doesn’t quite fit)
3. The Off buttons breaks away from the rest of the paradigm of the interface (icons are for actions like inspect, and pause while words are for different tabs)
4. and the Off button is a much larger than the minimize button even though the minimize button is used far more frequently than the off button

I now have to focus in order to minimize Firebug taking mental energy away from my task. If I’m not paying attention I can turn-off Firebug for the site I’m working on and then I would have to reload the page to get it working again. These sound like little things but compounded one hundred times and it can drive you batty.

So while the latest Firebug update is not technically broken, a poor interface decision sure makes it feel like a buggy mess.

87 snapshots taken during the design process for the iPhone app Beats. It’s interesting to see something like this come together.

(via bobthecow)

The folks at Newsweek unveiled a new redesign for their website today, nearly one and a half years since their last one. From a post about the new changes, the redesign aims to help visitors sift through the “flood of information on news and events every minute of every day” by “continuously filter[ing] it to find the most important stories and concepts for our audience” while “embrace[ing] the best work of other journalists around the Web and the most thoughtful questions and comments of our readers” in order to “create a forum for a continuous – and continuously worthwhile – conversation about key events and issues”. If only their writing was as simple as their new header.

The new Newsweek header (top) is much cleaner with a softer tone and less emphasis on the bold red associated with the magazine. Simple, clean headers seem to be a rising trend on news sites these days as usability and user experience become more of a focus. The old header (bottom) had a sense of authority while this new header design is toned down, as if to convey a lack of confidence in their place in the world. I am not a fan of the rotating headline ticker which clutters up the otherwise clean navigation.

The content on the homepage is also a cluttered eye sore. There is no clear structure to the information and the auto-rotating carousel of feature stories is distracting. I dig the effort to link out to external sources. This is what the web is all about but it does come off as Newsweek giving up on its quest to be a news leader. This could have been executed better to complement their own content rather than outshine it.

My biggest problem is it is impossible to scan the homepage. The content appears to be laid out in a random order like an amateur scrap book. There is no central focal point except for that ginormous 336×850 ad on the right. Come on Newsweek, don’t you know about the F shaped reading pattern on the web? Why would the headlines be aligned along the right side of the page?

It still appears Newsweek is a print-focused organization with the attitude of “if you put it on the page, readers will read it”. Looking over at the old design, it seems this redesign is a step-back. In it’s efforts to be a guiding hand in filtering the flood of news, Newsweek has become nothing more than a dam clogging the flow of information. My advice: turn Newsweek.com into a repository of articles from the magazine and focus on that. The world doesn’t need an old media publication half-ass its web offerings.

Other Points of View:

• A Web Design Critique of the Newsweek Redesign (Joey Baker)
• Newsweek’s Redesign: Nice Try (BNet Media)
• Newsweek Redesign Coming in Two Weeks (PDNPulse)

With all of the turmoil about the future of journalism, the New York Times is taking a proactive role in staking out it’s future in what might be a newspaper-less world. Today the company released a downloadable Adobe Air application that brings together the immediacy of the online world with the serendipity and browsing of the physical world. See a video demo of the application in action.

The Times Reader 2.0 is a slick product with an advertising and freemium business model. The tool offers some sections for free, like the front page, while charging $14.95 a month for access to others. John Biggs from Techcrunch is thinking about making the switch to all digital from paper delivery which is costing him $40 a month in Brooklyn. I’m curious as to how many people will put up with a seperate app dedicated to news sitting next to their web browser and e-mail client. And how many will be willing to shell out $15 a month for the same content that is already available for free on their website.

I think this is the first step to the New York Times setting up a pay wall like the Wall Street Journal. Unlike the Wall Street Journal, The New York Times looks to be pushing a monthly fee over a micro-payment business model which will ultimately fail.

The other interesting idea involved the Research and Development group at the newspaper. First off, the fact that a large media company has a R&D group boggles my mind but it totally makes sense to tackle the new technology that will be shaping their business in the coming years head on. Second, the New York Times is very interested in making their content work on the slew of portable media devices that are popping up everywhere like netbooks, the Kindle, and mobile phones. The video below taken by the Nieman Journalism Lab shows how they’re experimenting with e-ink readers and figuring out how their content will work on devices that aren’t even invented yet.

The future of media is not a single medium with one or two supporting business models, but one with many outlets tailored to different devices with just as many different ways to monetize it. The New York Times is building the infrastructure to handle this, it’s the smaller news outlets that are going to have a tough time adopting to this new, fragmented world.