Summary Of An Event Apart DC Day 1

The Event Apart conference series is the top-notch gathering for people who make websites. Making its way across various cities in the U.S., the Event Apart tour stopped in Washington, D.C., which I was fortunate enough to attend. The speakers themselves were amazing but interacting with the attendees in real-time during the talks opened a whole new level to the experience. Below are some of the best tweets I curated from each of the sessions. All of which came from afeedapart.com, the official feed aggregator for An Event Apart.

Web 2.1: The Medium Comes of Age by Jeffery Zeldman

Zeldman started things off with a presentation covering the history of communication from the printing press to HTML5, and everything in between. In 2010, standards based design is no longer fringe, HTML5/CSS3 are viable technologies, and the mobile web is taking shape.

  • The death of the web is greatly exaggerated. @tomkruk
  • If the web is dead, then print must be mummified. @Merlaak
  • “There are 241 newsgroups on 1986. 240 are porn…” @grum_dot_com
  • Zeldman calls the telegraph The Victorian Internet @eduiconf
  • R. Cailliau – leading man’s best friend. Worked with Tim Berners-Lee to invent the web. @mad_sunshine
  • 1991 AOL… remember 9600 baud modem? = yuck @lavinia
  • “there’s a history of the internet being ugly and being designed by people who can’t design their way out of a paper bag” @ashleyjoost
  • 1993. Mosaic. We’ve come a long way. #aea http://yfrog.com/jcem8mj @eTapWeb
  • I remember using MOSAIC on my Amiga 500, wondering why “forms” are not showing… @tomkruk
  • And you had to PAY for Netscape @cityrider49
  • Netscape Gold FTW! @tomkruk
  • Zeldman breaking down landmark moments in web history: “1995 brings us the tiled background” @mattmediadc
  • “IE no longer sucks, IE is awesome” – Zeldman, #aea … hear it from the man! @franksedivy
  • 1998 — internet traffic doubles every 100 days @ashleyjoost
  • the phrase “best viewed…” should be left to history @cityrider49
  • dot com bust = coming off a coke bender @tonyvia
  • 2000 dot com bubble burst brought us benefits: people were forced to learn standards, improve their skills to make a difference. @mihswat
  • The CSS Zen Garden changed my professional career… Design for the web became a whole different concept @mattmediadc
  • “you can’t burn every house down because we have this new idea for architecture” @TheTroz
  • XHTML 2.0 was burning every house in the world just to propose a new architecture. @mihswat
  • “HTML5. You keep using that word. I do not think it means what you think it means.” @eTapWeb

Object Oriented CSS by Nicole Sullivan

Nicole developed a technique for managing CSS called Object Oriented CSS. The basic premise is to recognize visual patterns and mark them up consistently. Consistent markup results in more compact and efficient CSS code to style which in turn results in more manageable code and faster performing websites.

  • If you write CSS for any site of significant size or traffic you MUST hear @stubbornella talk on OOCSS. This is my second time listen. @aebsr
  • Reason for CSS optimization, CSS Blocks progressive rendering @eduiconf
  • 42% of Alexa’s Top 1000 don’t gzip CSS. 44% have more than 2 files. 56% serve with cookies. 62% don’t minify. 21% have > 100k of CSS. @mihswat
  • “Our sites are choking on the amount of CSS we’re throwing over the wire.” @eTapWeb
  • OOCSS makes me intellectually erect @grum_dot_com
  • Object oriented CSS sound a lot more complicated than it really is. @kingkool68
  • wow around May 2009 FaceBook had over 700 CSS files that totaled more than 1.9Mb @160mph
  • “If you fighting your CSS, your architecture failed” @franksedivy
  • Facebook has all of their headings bold. Non-bolded headings looked weird to users. @kingkool68
  • People aren’t viewing your home page or reading your about section anymore. It’s all Google hit-and-runs, and it’s changing our design. @brian_klaas
  • Css objects were better for humungo sites like Facebook. Seems overkill for smaller, simple sites. @kingkool68
  • Dust-me Selectors to find unused css. http://www.sitepoint.com/dustmeselectors/ @chrismjones
  • A ‘giant pink heading’ should not become a ‘small blue heading’ when placed in another part of the site. @phej
  • Elements should be styled globally, avoiding area-dependent declarations in CSS. Rules should be predictable, avoid overwriting them. @mihswat
  • Love how @stubbornella uses the story of the lady who swallowed a fly in relation to CSS @candiRSX
  • Writing CSS to correct previous bad CSS is the legacy of the old woman who swallowed a fly. It makes sense when @stubbornella says it. @achellios
  • Nicole Sullivan’s Grids on github – http://wiki.github.com/stubbornella/oocss/grids @Merlaak
  • Classing elements with element names (“.h1”) is one step removed from or similar. @jgarber
  • hmmmm…not sure about @stubbornella rec. on eg h3.h6 Isn’t that sort of hacky? Shouldn’t we re-examine design first? @ryanhoonlaverty
  • Among Alexa’s Top 1000, there’s a site with 511 declarations setting styles for h1-h6. Facebook used to have 958. @mihswat
  • After a CSS rewrite, there were only 25 declarations. @mihswat
  • Amen to the underscore hack. I use it all the time. @kingkool68
  • Avoid styling IDs. IDs are for JavaScript. @mihswat
  • styling IDs messes up specificity @eduiconf
  • “You should definitely suffer if you use hacks” @chrismjones
  • Not sure about this ‘not styling IDs’ and have class driven styles .that on top of the things aren’t semantic (.h1, .h2 etc…) … :/ @franksedivy
  • “AVOID !IMPORTANT – except on leaf nodes” Good advice!! @JudyBad
  • “I try to get specificity out-of-the-way so my cascade can really shine.” @andysherry
  • agree with not using !important, disagree with not styling IDs. style IDs if they’re used sparingly or if “lead nodes”. @courcelan
  • Styling using IDs, !importants, and too many nested elements is like fighting whose CSS rules are going to win. @mihswat
  • who knew? the way I wrote CSS as a n00b was on the right path – lots of class selectors and few element/ID selectors! @raelehman
  • I think OO CSS takes the art and craft away from CSS and gets it ready for consumers world! 🙁 @franksedivy
  • The blinking cursor says, “You don’t remember anything.” (Referring to the command line) @Merlaak
  • Find and replace is really why I use Dreamweaver as my coding tool of choice. No need to figure out grep. @kingkool68
  • See how many times a declaration if when your css from command line. grep -r font-size . | wc -l @chrismjones
  • Hmm, @stubbornella‘s OO approach to CSS preso has some good QA tricks, but her philosophy has too much scaffolding for general use @talbs
  • Feeling a little weird about @stubbornella‘s approach to object-oriented CSS, but liking some ideas about finding duplication. @graphicsgirl
  • OOCSS sounds like the best approach for Facebook, but not most sites we design and build. @graphicsgirl
  • afraid newbs will get the wrong idea with @stubbornella‘s methodology and not consider scale/context/semantics @talbs
  • I found taking the general idea from this presentation and building a custom framework for our approach to build sites worked great @aeaattendee
  • Looking at CSS in a way I never have thanks to @stubbornella @TheTroz
  • Facebook reduced CSS size by 19% and HTML size by 44% after optimizations @mihswat
  • * and _ hacks > conditional statements @160mph
  • Been using OOCSS for the past year and a half. Have never found a site that did not benefit. @chrismjones

The CSS3 Experience by Dan Cederholm

Dan emphasizes that sites don’t need to look and behave exactly the same in every browser. Case in point, he owns http://dowebsitesneedtolookexactlythesameineverybrowser.com/ and http://dowebsitesneedtobeexperiencedexactlythesameineverybrowser.com/. CSS3 is available in modern browsers today and suitable for non-critical elements of a design. His presentation consisted of several demos showcasing how CSS3 could be used to sweeten interfaces.

Mobile First! by Luke Wroblewski

Luke covered designing Web applications for mobile platforms first before the desktop. This helps you focus a website down to its bare essentials and functionality. The mobile web is exploding, and in some cases, is the only access someone has to the Internet.

  • “Web products should be designed for mobile first, even if no mobile version is planned.” @eTapWeb
  • desktop internet devices: 1 billion, mobile devices: 10 billion @tonyvia
  • “50% of people who were new to the web last year were on mobile devices.” @eTapWeb
  • Why build mobile first? More growth and future users. @tyrale
  • Mobile Web growth has outpaced desktop Web growth 8x. Smartphone sales will pass PC sales in 2011. @mihswat
  • Mobile is the new black @JudyBad
  • Great mobile products are created never ported. @kingkool68
  • mobile stats from #lukew http://lukew.com/ff/ @eduiconf
  • “27% of searches on Yelp! come from 4% of users (i.e. the users who access Yelp! via iPhone.)” @zeldman
  • “Designing for mobile forces you to focus and prioritize.” @eTapWeb
  • Moving from desktop to mobile… First remove 80% of the crap @tyrale
  • Design for mobile first and you will get down to the things that matter. @mad_sunshine
  • “everything else on this page needs to pixelate and die.” @courcelan
  • Mobile devices’ limited screen size makes you focus on what’s important – main features, straight communication. @mihswat
  • Use vector to design for the web, build with css3 it will scale automagically! @tyrale
  • Mobile design is all about adaption @kingkool68
  • for mobile, make the content the UI @rkunboxed
  • 100ms delay results in 1% sales loss for Amazon ($191 Million) @eduiconf
  • Google says 500ms delay drops search traffic by 20%. Wonder what our 8,000ms server hangs do. Cough. @itmaybejj
  • optimize for mobile:speed eg, eliminate redirects & use app cache for local content storage @dinalew
  • Mobile is quick bursts, and mostly at home on usage. @tyrale
  • Your mobile is with you all the time, so designing for mobile means designing something that can be used all the time. @zeldman
  • Only make content and web apps that are useful to people *all the time @halvorson
  • People spend only about 2 to 4 seconds on a webpage using a mobile device. Optimize your site for this behavior. @mihswat
  • design = constraining until an elegant solution presents itself @lavinia
  • Many users will interact with mobile devices using one hand and one thumb (one-handed touch), so the UI has to be simple. @jessicaivins
  • 1 million per day = touch based phone purchase @lavinia
  • mobile: must accommodate “french fry fingers” @JudyBad
  • wow. ‘1.1 billion consumers with Nokia devices in 2009’ @westerndave
  • 8-10mm = average human finger pad , so design for 9mm touch area @lavinia
  • touch me = Touch Gesture Reference Guide http://www.lukew.com/ff/entry.asp?1071 @westerndave
  • Hovers are not intentional, clicks are @eduiconf
  • great stat: People spend only about 2 to 4 seconds on a webpage using a mobile device. Optimize your site for this behavior. @lavinia
  • Hovers are not intentional. Just because a user’s mouse has paused somewhere doesn’t mean they expect to see a menu. @zeldman
  • most devices use wifi for location (gps is narly indoors) @lavinia
  • Yes! Hover cannot be considered an intentional interaction on a mobile device. I activate them accidentally on my *desktop*. @kissane
  • Yelp’s augmented reality feature boosted their sustained traffic by 40 to 50 percent @mihswat
  • Wonderful presentation from Luke Wroblewski. This really jives with a lot of stuff that get talked about in IxD these days. @iwilsonjr

Message and Medium: Better Content by Design by Kristina Halvorson

Kristina sure knows how to develop a killer content strategy. A website’s message carries through to other places on the web than just the main website. Customer support, social media, and meta data should all echo the tone of the main message. And there is a lot more to a good content strategy than determining what text goes on the front page. How will this content be produced? Who will update it? How often will we add new content?

  • Kristina Halvorson (@halvorson) asked us to sing Happy Birthday to her son. How sweet… @shiota
  • @halvorson on two of my favorite topics: teeth & content strategy! @dinalew
  • haha. User-scented content. “Smells like user.” @ryanhoonlaverty
  • Content strategy plans for the creation, delivery, and governance of content that people care about. @eTapWeb
  • website content: stop talking about what you do and talk about what your users want. hello user-centered content @dinalew
  • content requirements ≠ content strategy @tonyvia
  • content strategy = content (substance + structure) & people (workflow + governance) @tonyvia
  • messaging is not a mission statement, brand promise or tagline @eduiconf
  • nobody cares about your mission statement [so true!] @tonyvia
  • First second visiting a website is an emotional response @kingkool68
  • user forms an impression of your site in ONE SECOND (load time + design) & decides to trust you or not within 10 seconds @tonyvia
  • In 1 second user should have an emotional response. 10 seconds, understand your primary message. 2 minutes, secondary msg. @eTapWeb
  • Reminded of how some of the traditional #ux roles/deliverables can suffocate copywriters’ creativity/skills. Preach on, @havlorson. @talbs
  • Include maintenance requirements for key pages – great content strategy idea @graphicsgirl
  • Consistency inspires trust in your readers. @JudyBad
  • consistency inspires trust in your readers @lavinia
  • Visiting every page of your site with its main message in mind helps to see if you’re communicating it the right way with consistency @mihswat
  • #aea is really driving home the importance to collaboration across roles/disciplines to tackle those important grey areas of an experience! @talbs
  • And your FAQ page is inconsistent. Where’s the fun, Ben & Jerry? @mad_sunshine
  • pet peeve: “contact us” page hiding phone/address 10 layers deep. after all, that’s all we want from “contact us” page 99% of the time @sarahdippity
  • Workflow and governance are crucial for good content strategy. @kingkool68
  • “whats our facebook strategy?” “that depends… what are you trying to do, who’s going to do [keep up with it]?” hear, hear. @courcelan
  • What is your social media strategy? Is it successfully delivering your message? Or do you have a Twitter just for the sake of it? @mihswat
  • Page descriptions. Tweets. Facebook posts. Google results. Your message should be consistently delivered everywhere. @mihswat
  • @halvorson‘s talks on content strategy are ALWAYS timely and poignant. Maybe because content strategy is a never-ending struggle… @ryanhoonlaverty

Anatomy of a Design Decision by Jared Spool

Jared pointed out that every site on the web came to be from a series of decisions. He has identified 5 styles to design decisions and when each style might be appropriate for a given project. Oh and university homepages feature images of girls under trees way too much.

  • Seen it before, but it’s easy to forget just how awesome http://havenworks.com/ is… @davidocoulter
  • “it validates” – Jared Spool (sarcastically referring to havenworks.com) @SethBlanchard
  • “Someone actually designed this on purpose. This way.” – @jmspool on a particularly egregious web design specimen. @alykat
  • Sites like havenworks.com or arngren.net went over design decisions. Now that’s something to think about. @shiota
  • Jared is talking about the famous 37signals vs. Donald Norman “celebrity deathmatch”. @shiota
  • “Self design works great when you’re designing something for your own use, or for use by people just like you.” @eTapWeb
  • Crappy and unhelpful error messages are the perfect way to frustrate your user. @shiota
  • Unintentional design happens on its own. Works great if user will put up with whatever or we don’t care about support costs. @eTapWeb
  • Airline websites: helping AEA speakers make their point since 2005 @ryanhoonlaverty
  • “Genius design: when we’ve previously learned what users need. We’re solving the same problems repeatedly.” @eTapWeb
  • “Activity Focused Design: designing for new activities unfamiliar to us.” @eTapWeb
  • Well @jmspool‘s talk includes a reference to @lingscars‘ website www.lingscars.com… and well, just check it out. @hellogeri
  • Jared is comparing Six Flags map to Disney World’s map. Both amusement parks, yet totally different maps. Each with its own focus. @mihswat
  • Disney. Someone has thought about what happens between the rides. Thinking about the experience. @mad_sunshine
  • experience is the stuff that happens around usage. @lavinia
  • “User experience is what happens in between activities” @simplebits
  • University website traps — girl under trees. WOW! So many of them… @mad_sunshine
  • OMG I can’t search – the search box is on the left [side]! @raelehman
  • Rule #17: Always put the search box in the upper right @grum_dot_com
  • Hmm. design style guides and guidelines never work. @mad_sunshine
  • Informed Decisions > Rule-based Decisions @160mph
  • Rule-based decisions prevent thinking. Informed decisions require thinking. @sarahdippity
  • Design is about the exception cases. If everything was always the same, we would not be interested in this work. @beep
  • Instead of spreading dogmas/methodologies, try spreading tricks/techniques. People will learn, think, and won’t struggle with rules @mihswat

Inspiration From Vintage Childrens Books

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.

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

Angus and Cat
Angus and the Cat Marjorie Flack ~ Doubleday, 1931

Tico and the golden wing
Tico and the Golden Wings Leo Lionni ~ Knopf, 1964

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

The Three Robbers
The Three Robbers Tomi Ungerer ~ Atheneum, 1962

Rotten Island
Rotten Island William Steig ~ Godine, 1984

Tommys trip to the moon
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:

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.

Drummer Hoff Cover

Grooveshark 2.0 Keeps Getting Better

My favorite online streaming music service just keeps on getting better. Today Grooveshark gave their VIP members a peek at their new 2.0 release.

Grooveshark 2.0 Screenshot

According to their blog post these are a few of the major enhancements.

  1. A brand new interface: almost everything has changed in the visual look and feel
  2. Add any song on Grooveshark to your library without uploading
  3. Sorting: You can now sort lists by Song Name, Artist Name or Album Name
  4. Drag-and-drop playlist editing
  5. Themes: Make Grooveshark look the way you want
  6. Improved player: more room for your songs
  7. Better caching: back and next should be much faster now
  8. Seeking: now you can skip to your favorite part of a song with the click of a mouse.

Seeking in Grooveshark 2.0
The seek bar lets you jump to any point in a song.

Left side navigation Grooveshark 2.0
The left side navigation lets you seperate different groups of music for easy access.

Bigger album art Grooveshark 2.0
Bigger album art puts the current playlist front and center.

The new interface is a joy to use. The new sorting options and the ability to jump around to any point in the song make Grooveshark like an online version of iTunes that has an Internet-wide shared library. Bigger album art is a nice upgrade over the thumbnails used in the old interface. It used to be a pain going through your favorite songs but now you can add them to your library (which has much more robust sorting options) with the click of the music note icon. New themes are interesting to keep things fresh. I imagine there will be dozens more added over the next few months.

One of the new features I stumbled on that wasn’t mentioned everywhere were RSS feeds. Right now there are three: Songs I Favorite, Songs I Listen to, My Zeitgeist (which is empty at the moment). It would be nice to see Grooveshark automatically send song info to your Last.fm account.

The only other feature really missing from Grooveshark is a hook in the player for controlling it with global shortcuts. I would really love to set up a key combo to play/pause, skip tracks, and favorite tracks without ever bringing the app into focus. The best part is how Grooveshark listens to their community through Get Satisfaction.

I’m confident this is only the beginning of improvements and I’m glad I plunked down my $30 for a year of VIP membership.

Firebug Gets A Little Buggy

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?

Screenshot of Firebug 1.4 vs the older 1.3 interface.

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

Firebug 1.4 interface paradigm

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.

Timelapse Of iPhone Interface Design

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

(via bobthecow)

Turn Your Fridge Into Photoshop Using Magnets

Have you ever waned to turn your fridge into a graphic designers computer screen? These $25 magnet kits from meninos.us will transform any plain, metallic surface into an industry-standard graphics app. There’s a kit with Adobe Photoshop panels and a kit with Adobe Illustrator panels so no graphic designer will feel left out. Because if you spend most of your day in front of the interface, getting up for a quick snack might seem a little confusing without the familiar screen.

Adobe Photoshop Magnet Kit

This reminds me of my first, and only, drawing class in college. I’m not much of a physical media guy so when I made a mistake on my sketch pad I immediately made a gesture to undo. It took me a second to realize I wasn’t in front of Photoshop. I suppose these magnets wouldn’t help, but that’s besides the point.

(via s2999.com)

Veer’s Top 10 Typefaces For 2008

I got an e-mail from Veer.com, distributes of fine fonts, today celebrating their picks for the top 10 typefaces of 2008. I really like their first pick, Calgary Script, with it’s curvy strokes that create a retro feel that is so popular today.

Sample of Calgary Script typeface

The 5th typeface, Memoir, has the feel of Papyrus (which is a bad thing) due it’s rough edges. I kind of like it as a regular script typeface.

Sample of the Memoir Typeface

Guedel Script is kind of freaky. It reminds me of a Halloween dance.

A sample of the Guedel Script typeface

You can see the entire list on Veer’s blog.

Multifarious Design Links

I’ve been doing a lot of reading and not a lot of blog-idea-generating lately. So here are some of the best stories I’ve stumbled across during the last couple of days.

ESPN to De-Clutter With New Redesign – “Instead of inundating visitors with its intense coverage of every major sport from the get-go — something that the company now believes can drive away certain fans — ESPN.com is moving in a less-is-more direction, at least on the home page.”

ESPN is simplifying it's homepage in an effort to grow it's brand.

Consumer Reports identifies the Top 5 Smartphones – The Black Jack II came out on top, followed by the T-Mobile Wing, Motorola Q9C, T-Mobile Shadow, and BlackBerry Pearl Flip. The iPhone 3G and T-Mobile G1 tied. Verizon was ranked the best carrier followed by T-Mobile. Sprint was last in most markets. T-Mobile still doesn’t have any 3G phones worth getting excited about.

Rated best smartphone by Consumer Reports.

Last week was Web Design Week at PSDTuts.com – Two of my favorite articles were Five Looks, One Layout and How a Simple Layout Can Be Mixed ‘n’ Matched with Patterns, Photos and Backgrounds. Both cover how to transform the message of a single layout using different colors and styles. This is a great step by step resource for the design impaired like myself.

Web Design Week

Speaking of the design impaired…
Smashing Magazine has put together the Ultimate Collection of Custom Photoshop Shapes – If you can’t draw, custom Photoshop shapes become invaluable.

Custom Photoshop Brushes

The Amazing Shitbox

TheBrownCorporation.com Header

I have no idea if these portable cardboard toilets are serious products or some sick joke but I got a kick out of the page design. Featured in Smashing Magazine’s Texture and Patterns Design Showcase, TheBrownCorporation.com lured me in with their simple, to-the-point layout and Little Jack, the quirky mascot.

At any rate, working at The Brown Corporation must be the shit!

Mozilla Shows Off Firefox Mobile Interface

I stumbled across this Mobile Firefox Interface Concept video today over at Aza Raskin’s blog. Taking a cue from Apple’s iPhone, the Mozilla team envisions a browser controlled by finger gestures. But rather than just being able to zoom and “throw the page around” the mobile Firefox guys built an interface around simple actions. For instance, if you flick your finger slightly to the left a navigation sidebar appears revealing the back, forward, bookmark, and page info buttons.

The beauty of this design is it maximizes every pixel available on a tiny mobile screen for the content itself. The interface only appears when you need it and neatly tucks away when you don’t. Here is the full video to show these ideas in action:

I really like where this is going and wait in anticipation for the official release of Firefox mobile in the next year or two. For now though you can play around with the limited web demo.