{"id":1402,"date":"2009-03-16T19:08:29","date_gmt":"2009-03-17T03:08:29","guid":{"rendered":"http:\/\/mozillalabs.com\/?p=1402"},"modified":"2009-03-16T19:08:29","modified_gmt":"2009-03-17T03:08:29","slug":"firefox-new-tab-next-iteration","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/labs\/2009\/03\/firefox-new-tab-next-iteration\/","title":{"rendered":"Firefox New Tab: Next Iteration"},"content":{"rendered":"

Since releasing an experimental new tab page for Firefox a week ago, we’ve got a lot<\/a> of<\/a> great<\/a> feedback<\/a>.<\/p>\n

For the past week we’ve been using the feedback as a springboard for designing the next iteration. If you’d like to watch the design iterations as they happen, follow #mozconcept<\/a> on Twitter.<\/p>\n

Current Design<\/h2>\n

<\/a><\/p>\n

We’ve done away with the thumbnails as they just didn’t seem to be providing large amounts of value. As we played with different methods of taking screenshots, we discovered that it was the top-left corner that was most distinctive in identification because it generally contains the site’s logo. We have a much stronger association with a site’s logo or favicon than with the low information-density thumbnail of the page itself.<\/p>\n

<\/p>\n

We’ve also turned the contextual actions into an actionable sentence. Previously, the actions were large, separated buttons. The actionable sentence connects the actions into a cohesive whole. Further, we now only show the contextual actions if the copy action has happened within the last 40 seconds, so that random chunks of text don’t appear on the new tab page.<\/p>\n

<\/p>\n

Finally, the interface for undoing a tab close now uses the familiar info-bar. This gives less weight to the undo action, while still keeping it visible. By design, the undo doesn’t feel like a part of the page so the eye skips over it if your intent is to interact with the page.<\/p>\n

Overall, the design feels faster, politer, and more functional.
\nThe visuals still aren’t exactly right (help wanted!), but this feels much “righter”.<\/p>\n

Instead of talking more about the design, give it a try and give us feedback:<\/p>\n

Step 1. Download and install<\/a> the latest development build of Firefox 3.1.
\nStep 2. Download and install<\/a> the latest version of the New Tab prototype.
\nStep 3. Let us know what you think<\/a>, including what works, what doesn’t and how we can improve the design.<\/p>\n

You can switch back-and-forth between the old design and the new design by clicking the star in the lower-right corner.<\/p>\n

Other Thoughts<\/h2>\n

There are still a lot of possible directions to take the new tab screen. Here are a couple of the ones we’ve played with. More to come soon. For instance, we want to revisit the first design.<\/p>\n

With Thumbnails<\/h3>\n

<\/a><\/p>\n

<\/a><\/p>\n

<\/a><\/p>\n

<\/a><\/p>\n

Out There Designs<\/h3>\n

<\/a><\/p>\n

<\/a><\/p>\n

Oliver Reichenstein<\/a> has joined Sean Martell<\/a> to form a “new tab” visual design team. They’ve already separately produced almost all of these fantastic visual artifacts, and we are looking forward to more. If you’re a designer and interested in this project from a design perspective, this is a great opportunity to get involved in an open source project. Please jump onto either #labs on irc.mozilla.org or link your mockups in the comments section of this post.<\/p>\n","protected":false},"excerpt":{"rendered":"

Since releasing an experimental new tab page for Firefox a week ago, we’ve got a lot of great feedback. For the past week we’ve been using the feedback as a springboard for designing the next iteration. If you’d like to … Continue reading<\/a><\/p>\n","protected":false},"author":51,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[33],"tags":[4863],"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts\/1402"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/users\/51"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/comments?post=1402"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/posts\/1402\/revisions"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/media?parent=1402"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/categories?post=1402"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/labs\/wp-json\/wp\/v2\/tags?post=1402"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}