- We design and build extraordinary applications for companies looking to make the next great idea a reality.
- learn more
37signals and the pain of the below-the-fold button
Google Notebook finally got a feature I've been asking for since the beginning: The ability to remember whether I want my notebooks sorted alphabetically or by date of last update. When the service launched, notebooks were always sorted by last update. When they finally added the option of alphabetical sorting, they left out the ability to make your choice sticky across sessions. This little wrinkle annoyed me almost as much as the Google Calendar search box's default action of searching public calendars rather than my own. I can't believe what a difference it makes in your relationship with a webapp when you don't curse out loud every time you use it.
Many users have the tendency to get bent out of shape about deficiencies in a tiny, tertiary portions of an application - or, for that matter, an operating system. Mac users devote entire forums to complaining about changes to, or lack of changes to, the Dock. PC users are still cursing those stupid Windows XP "You have unused icons on your desktop" messages. When we spend increasingly endless stretches of our lives in front of a terminal, tiny annoyances add up.
I call this the Disproportionately Annoying Detail Syndrome, or DADS. It has a tendency to flare up worst when you're working late on a short deadline and your computing environment fails to read your mind.
A couple of years ago, when I first started abandoning desktop software for cloud computing, I gave Ta-Da List a shot. I couldn't get over the placement of the "Add another item" command. Instead of putting it at the top of the list, they stuck it at the bottom. Every time I wanted to add a task, I had to scroll down to the bottom of the page before I could start typing. I worked with this system for about a week before jumping ship to Remember the Milk, where I can hit the "t" key to add a task without ever picking up my mouse.
Topics: Usability, User Experience, User Interface Standards
Spending time with Mozilla prototypes: Weave and Prism
I've spent a bunch of time testing two nascent Mozilla Labs projects recently and thought I'd share my experiences, one awful and one awesome.
Failure: Mozilla Weave
After casting aspersions on Mozilla's progress in the mobile space yesterday, I thought I should probably back up my comments with a real-world example: my utter failure, after five attempts, to get Mozilla Weave up and running.
For those not yet acquainted with it, Mozilla Weave is an initiative to bind the Mozilla experience more tightly with web services. To date, that initiative has taken the form of a Firefox plug-in that syncs bookmarks, browser history and cookies between multiple machines through the power of the cloud. Eventually, Weave will provide a set of APIs for individual application and plug-in developers to provide similar syncing mechanisms. But at this early stage, Weave is more demoware than anything else. The folks at Ars Technica took Weave for a spin several months ago, but despite subsequent updates, the plug-in still offers a complicated, error-prone and just plain broken user experience.
Topics: Mozilla
Web 2.0 Expo keynotes
I spent a lot of time at Web 2.0 Expo session-hopping - and a lot more time hanging in the speaker's lounge fine-tuning my own talk. That's the curse of going on the last day. You can't fully enjoy the rest of the conference. That said, I had pretty strong reactions to some of the keynotes. The big platform announcements from Microsoft (Live Mesh) and Yahoo (SearchMonkey plus), were OK, but I was most struck by author Jonathan Zittrain and Mozilla exec Mitchell Baker.
Topics: Web 2.0
My Web 2.0 Expo slides now available online
Photo: James Duncan Davidson
Web 2.0 Expo is closing up shop. I think my talk went pretty well. Despite being the last session of the last day, I had about 100 people, most of whom stayed till the bitter end. Not a lot of questions, but quite a few folks stopped by to chat afterwards - including Mark Meeker, a friend and former colleague from Orbitz who's no stranger himself to the conference circuit.
I made a conscious decision not to focus on code, but rather to provide tools and advice to developers who want to be a part of the conversation between standards bodies, browser vendors and library authors about the future of the web. I'm not sure how much of it makes sense without my narration, but I've posted my slides to Slideshare.
Now, out for Afghani food with old friends. More about Web 2.0 Expo next week!
Topics: Ajax Development
“Crowds can be wise, but they can also be destructive” - Annalee Newitz on social media censorship at Web 2.0 Expo
Given my previously professed obsession with sci-fi blog io9, I had to check out the Web 2.0 Expo session hosted by its editrix, Annalee Newitz. User Generated Censorship tackled the ways in which community policing and content flagging can damage the value of social networks.
Using case studies from Blogger, Flickr, YouTube, Digg and Wikipedia, Newitz explored the various ways in which user-generated content can be flagged by community members and summarily banished to the void. She harshed on services - Blogger, Flickr, Digg - with poor transparency into their processes and insufficient recourse for those flagged. She also showed the love to services - Wikipedia, YouTube - with more complex, detailed and "byzantine" rules for flagging content.
Her logic? Such complex rules force would-be community censors to get specific about why they're flagging particular items. Wikipedia, for instance, offers seven different directives for its content. To flag content for removal, users must cite the specific directives that have been violated. Lots of discussion ensues.
Topics: Social Networking
Web 2.0 Expo: Behavior-Driven Development with Rails and RSpec
At today's Web 2.0 Expo, Greg Pollack of Rails Envy introduced me and a few hundred of my latest acquaintances to Behavior-Driven Development. Basically a mash-up of Test-Driven Development and Domain-Specific Langauges, BDD empowers developers to turn English-language spec documents into working test suites with a minimum of fuss.
Pollack's talk was titled The Art of Testing Web Applications, but his copious code examples skewed, unsurprisingly, toward Rails. Easily mixing high-level concepts with nitty-gritty code, Pollack showed how to turn existing Rails unit and integration tests into BDD tests using the RSpec framework. Although the translation from one testing framework to the other seemed almost 1:1, the difference in readability was striking. I can actually see clients and product managers/business owners using these test suites in the real world.
Topics: Ruby on Rails, Test Driven Development
My talk at Web 2.0 Expo this Friday
I have arrived in San Francisco for Web 2.0 Expo. Over the next couple of days, I'll post about my favorite sessions and all that jazz. But here's the obligatory plug for my session, which takes place at 3.50 p.m. Friday in room 2003. I posted about my talk when I was first accepted, and I'm really pleased with the way it's come together. I did a dry run of it with my peers at Pathfinder on Monday and got a lot of excellent feedback.
As previously reported, my session is called Do Try This at Home: Ajax Bookmarking, Cross-site Scripting, and Other Web 2.0 Browser Hacks. In it, I'll examine the various draft WC3 specs that are already coming alive in the latest crop of browsers - and how you, the everyday developer, can help road-test the future of the web by employing the new tools sooner rather than later.
I'm part of the development track, but given that I'm speaking in the last session on the last day, I'm going to mix the technical details with a lot of strategy and DIY cheerleading. The best thing about my R&D job here at Pathfinder is the chance it affords me to play with all the latest toys. I want to encourage other developers to do the same, even if they can't find a way to work such forays into their day-to-day projects.
Hope to see you there!
Topics: Agile Development
Ext JS 2.1 Now GPL (was LGPL)
One thing I overlooked with the release of Ext JS 2.1 is that it is now GPL rather than LGPL. That means that if you build Ext JS 2.1 into your app, it would have to be GPL's if you planned to distribute it. (See this flame thread on the extjs forum).
Not a problem if you are providing a service, but if you are distributing the application, then you are GPL infected.
If we look at part of the GPL v2:
These requirements apply to the modified work as a whole. If identifiable sections of that work are not derived from the Program, and can be reasonably considered independent and separate works in themselves, then this License, and its terms, do not apply to those sections when you distribute them as separate works. But when you distribute the same sections as part of a whole which is a work based on the Program, the distribution of the whole must be on the terms of this License, whose permissions for other licensees extend to the entire whole, and thus to each and every part regardless of who wrote it.
Now IANAL, but if you distribute a stub application with at least 2 UI implementations that can be downloaded and installed separately, you might be OK. Another argument for designing your applications as service providers that can be accessed by multiple different clients. That way you can change UI frameworks as necessary, such as when your current framework changes open source licenses.
Topics: Ajax Frameworks, Ext JS, Open Source
Recent Ajax Framework Releases/Developments
Some noteworthy Ajax Framework releases have come out in the last few weeks, along with some other news of interest:
- Ext JS 2.1 and Ext GWT 1.0 Beta - Better performance, new Slider, StatusBar components. REST support (support for other HTTP methods beyond POST and GET). The Ext GWT 1.0 Beta consummates the love affair between GWT (Google Web Toolkit) and Ext that was started by gwt-ext and MyGWT, but provides the comfort of knowing that it is supported by the Ext JS folks. Note: Ext GWT is pure GWT, not an Ext JS wrapper.
- Dojo 1.1 - First off, API compatibility between 1.0 and 1.1. Unified timing loop (ala Scriptaculous) for animation effects, with increased performance. Syntactic improvements to dojo.query. Unification of XHR functionality into dojo.xhr() function.
- Backbase Enterprise Ajax 4.2 - Backbase has been in the commercial framework game longer than almost anyone. Among the new features: hierarchical data bindings and improved performance. If you've wanted data binding for tree widgets, have a look.
- Google Search, Feed and Translation API - I opined a while back that Google discontinued their SOAP search API because they didn't want people reordering or otherwise manipulating their search results. Looking at the terms of use of the new REST service, you can see that this continues to be a concern: You agree that you will not, and you will not permit your users or other third parties to: (a) modify or replace the text, images, or other content of the Google Search Results, including by (i) changing the order in which the Google Search Results appear...
- Google App Engine - it only runs Python apps right now, and it's a preview release available to a select few, but you can already see that this is Google's challenge to Amazon's EC2 compute cloud. In at most a year, unless you are security sensitive -- health care, financial services -- or running on Windows, you won't be building and maintaining data centers. The capital requirements for launching sophisticated and scalable online services is about to change.
- Echo3 (beta) - it's getting close. Superior performance to Echo2. Easier development of new components. Automatic serialization of objects between client and server. All HTML rendering now done on client. Overall the JavaScript client code is now of a design quality on par with the server code.
Lots of exciting developments for Ajax developers and Web 2.0 entrepreneurs. I, for one, can't wait to see how the Google App Engine compares to EC2 for deploying and scaling Facebook applications.
Technorati Tags: ajax, dojo, google app engine, gwt, ext js, backbase, echo3, google search
Topics: Ajax Frameworks, Dojo, Echo2, Echo3, Ext JS, Facebook, Google, GWT, Javascript Libraries
Facebook Application Logistics for Team Development
Facebook is a unique platform for application development -- Facebook applications have a powerful API, a large user base, and low barrier to entry. With the Rails Facebooker plugin, a Rails programmer can treat the Facebook user data as an extension of existing Rails session features. It's all very nice, and I'm not going to talk about any of that this time around.
I'm going to talk about the logistics of doing Facebook apps. When a user sends a request to a Facebook app, Facebook intercepts it and forwards the request to the third-party app server, along with some specific Facebook data, like the ID of the user making the request. Applications have to be registered with Facebook, and have a unique URL prefix at apps.facebook.com. You also provide the URL for your third-party server.
This sets up some challenges for a development team. First off, your application probably relies on Facebook services, meaning it can only be fully tested from within Facebook. This implies that the external Facebook server needs to be connected to your development server. Since many Rails developers run off their own development machine behind a firewall, this is potentially awkward. Similarly, the fact that the Facebook application has a single URL mapping makes it difficult for multiple developers to work on the same application without tripping over each others' work.
How can a development team make this work?
Topics: Facebook, Ruby on Rails
JSTM for GWT: An Interesting Solution for Object Replication and Synchronization
Didier Girard, the peripatetic publisher of onGWT, read my post yesterday and pointed me toward XSTM, the open source OO distributed object cache. It has Java, .NET and GWT implementations that can interoperate.
Hide, Seek, and Stay Dry, part two: Controllers
When last we discussed this, I was adding some hide-and-show functionality all over a Rails web site. In Part 1, I worked over the view code, trying to transform the HTML into a series of Rails helpers that allowed any block of code in view to have hide-and-show functionality just by surrounding the block with a helper call.
This time around, we'll cover the controller side, and when we're done -- SPOILER ALERT -- any controller can become a hide-and-show server with as little as a single line of code.
Topics: Ruby on Rails
GWT, Remote Models and the Need for Better Replication Algorithms
- PESSIMISM, n.
- A philosophy forced upon the convictions of the observer by the disheartening prevalence of the optimist with his scarecrow hope and his unsightly smile.
-- Ambrose Bierce, The Devil's Dictionary
I frequently crawl through the various GWT project hosted on Google Code, as well as the few that aren't (like the almost venerable GWT Widget Library). One type of solution that is emerging is what I would call model synchronization libraries. These build on top of the GWT-RPC mechanism and allow a synchronization of an object model on the client-side with a corresponding one on the server-side.
Right now there are two major choices available:
- hibernate4gwt - Number one with a bullet. Elegant and powerful library that allows you to ship domain objects back and forth between the GWT client and the Java server, persisting changes, all at the cost of extending one class: LazyGwtPojo. There are two basic flavors -- stateless and stateful -- with a couple of different subflavors to support a variety of development use cases.
- Gwittir - Developed by the two dudes who wrote GWT in Practice, this library provides domain object bindings without forcing a dependency on Hibernate (should we add "Hibernate infected" to our lexicon along side "Maven infected?").
It's clear why these libraries are gaining in popularity. The whole idea of writing applications in GWT is to have a commonality of language and domain model. You want to be consistent and not have to navigate the OO/RPC boundary every time you modify or retrieve your client-side model. (An additional alternative worth mentioning is IT Mill Toolkit 5, which as a server-side ajax framework with it's widgets realized in GWT, already has the client-server synchronization baked in.)
Topics: Ajax Development, Gwittir, GWT, Hibernate, MVC
jQuery fade-in spoiler revealer: The failsafe, progressively enhanced version
***Spoiler Alert***
Don't read too much further if you haven't seen "Citizen Kane" and want to be surprised when you do.
I'm a big SF nerd and lover of teen-angst dramas. (That's why "Buffy the Vampire Slayer" is the Best Show Ever.) I love spoilers, but only when I've asked for them. When watching the entire run of "Dawson's Creek" on DVD years after it aired (don't ask), I accidentally spoiled Matt Laffey, the buddy who'd turned me on to the series, on how the big romantic triangle ended up in the final episode. I had no clue he had been saving Season 5 for a rainy day.
Since then, I have endeavored to include a ***SPOILERS*** alert in the subject line of any surprise-detroying emails - and to make liberal use of the return key to make sure the contents of such messages are below the fold in email clients with preview panes. This has made me a much more responsible citizen of fandom - though it hasn't lessened my outrage when entertainment websites post spoilers in their headlines or intro paragraphs without warning me and my fellow geeks. (Sci fi blog io9, by the way, is pictured to illustrate the right way to do things.)
Hats off, then, to Chris Coyier of tutorial site CSS-Tricks for his recent post on using jQuery to create a Fade-in Spoiler Revealer for use on websites. My only reservation about Coyier's technique was its reliance on JavaScript, and only JavaScript, to hide spoiler-laden content. With RSS and mobile browsing on the rise, lots of people read content in user-agents without JavaScript support. Shouldn't we try to protect them, too? I commented to this effect on the original article, then realized that I should just write the code myself as proof of concept.
Design Pattern 6: Definition lists : point/counterpoint
I encountered a similar situation to Noel's when developing a site recenty. The design called for, or made reference to, a opening and closing header with details shown or hidden by a click on that header. I approached it in a different way, which may be interesting to compare the two, but leave it out there to debate the merits of each. When solving a problem, I normally begin with the same axiom that was mentioned in an earlier post - What is it? What is it's nature? HTML markup, as you may know doesn't have much in it, a mere 20 or so tags, but with the addition of ID's or classes, you can uniquely identify everything the web has to deliver, which is pretty powerful.
In looking at the elements controlled by another element, the most fitting markup is a definition list. For some reason these elements are mysterious and not too often used. It is a list <dl> that can contain two elements <dt> and <dd>. Normally they have a default display of one element being bigger and the other slightly indented, as to look like a directory. So, with little or no work we can describe the two types of list elements, the 'header' - <dt> and the information that can be 'opened' the <dd>.
So having my markup, well, marked up, I can set aside the HTML, produce some styles for the list, but what about the complicated part? Adding the behavior to hide/show, make the <dt> clickable, swap the GIF's that indicate opening and closing, and while we're at it why not a 'expand all' or 'close all'. Finding it was no mean feat, but with some very creative google searching I found the script - http://www.tjkdesign.com/articles/toggle_elements.asp. So this handles all the heavy lifting, and basically degrades nicely in a non-javascript situation to show all elements. Problem solved.
The satisfying thing about this solution is that the code is clean, and easy to change, and any presentation issues are handled within CSS, along with any behavior in javascript, and handled by the client. I think the two approaches compliment and contrast each other nicely, add your own solutions to the comments if there are even better ones.
About Pathfinder
Recent
- Roles Testing For Security
- Blackbird takes the pain out of JavaScript logging
- Making GWT JSON not Quite so Painful
- IDEA - preconference workshop 06 Oct 08
- HTML5, Ajax history management, and The Ajax Experience 2008 Boston
- A Look Back At Past Posts
- Flash Player on iPhone gossip
- Microsoft to Jump on Board EC2
- TAE Boston 2008: The Unsexy Presentations
- The Ajax Experience 2008: Hope to see you in Beantown
Archives
- October 2008
- September 2008
- August 2008
- July 2008
- June 2008
- May 2008
- April 2008
- March 2008
- February 2008
- January 2008
- December 2007
- November 2007
- October 2007
- September 2007
- August 2007
- July 2007
- June 2007
- May 2007
- April 2007
- March 2007
- February 2007
- January 2007
- December 2006
- November 2006
- October 2006
- September 2006
- August 2006
- July 2006
- June 2006
- May 2006
- April 2006
- March 2006
Topics
.NET
2d physics
3d
3D GPS
3D physics
37signals
Accessibility
actionscript
activerecord
Add new tag
Adium
ADO.NET Entity Framework
Adobe
Adobe AIR
Advertising
agile
Agile Development
AIR
Ajax
Ajax Applications
Ajax Bookmarking
Ajax Components
Ajax Development
Ajax Examples
Ajax Experience
Ajax Frameworks
Ajax history management
Ajax Intervention
Ajax libraries
AJAX Obfuscation
Ajax Performance
Ajax Products
Ajax Tools
Ajax Widgets
Amazon
amf
Analysis
Android
Announcement
Announcements
antennae
Apollo
Application Architecture
Application Development
AS3
ASP.NET
Asynchronous Processing
awards
Back Button
Benchmarking
Best Practices
BitmapData.draw
BJAX
Blaze Advisor
blog
blogging
Books
Browsers
Business
Business Reasons for Ajax
Business Rules
C#
Canvas
Case Studies
chess
Chicago
Cloud Computing
CMS
COBOL
code art
Code Generation
Color
COMET
Conference
Consistency
Content Management
CRM
CruiseControl
CSS
Custom Flex Component
data visualization
Degrafa
Design
Design Patterns
Desktop
Desktop RIA
Developer's Notebook
Diagnose
Dojo
Domain Knowledge
Drools
EC2
Echo2
Echo3
Editorial
ERP
Ethnographic Research
events
externalinterface
Ext JS
Facebook
ferret
FileReference
Firefox
Firefox Extensions
Flash
flash awards
flash player
flash player 10
Flex
flexunit
Flock
Flow
Frameworks
front end
front end development
Games
Gauge Component
getting things done
Git
Google
Google calendar
Google Gears
Grails
Graphics
Greasemonkey
Groovy
GStreamer
GTD
Gwittir
GWT
Healthcare
Hibernate
Hudson
IDE
Ideation
IE
IE6
IE7
IE8
ILOG JRules
Information Architecture
Innovation
Instructional Design
Interaction Design
Interview
iPhone
iTunes
Java
Javascript
JavaScript frameworks
Javascript Libraries
JBoss Rules
Jess
Jetty
JIT
Jobs
jQuery
JSF
JSON
JSR-94
JsUnit
Lazlo
Legacy Systems
lightweight
LinkedIn
LINQ
logging
Logical Model and Conceptual Model
Low Pro
Mac
Mash Note
Mashups
Meebo
MetaWidget
Methodology
Microformats
Microsoft
Mobile
Mootools
mouse scroll
mouse wheel
Mozilla
Music
MVC
MySql
NetNewsWire
Object-Oriented
Object Relation Mapping (ORM)
Office
OOP
Open Screen
Open Source
Opera
Oracle
ORM
osx
pagination
Pair Programming
papervision3d
Patterns
Peer Creation
Performance
Personas
PHP
physics
physics engines
plugin
preloader
process
Web/Tech
Product Definition
productivity
Progressive Enhancement
Project Website
Prototype
Prototyping
PV3D
QA
qooxdoo
Radiant CMS
rails
Really Simple History
References
Requirements
Requirements
Alice Toth
Requirements Visualization
Restlet
RETE
Review
Rich Interactions
ruby
rubyamf
Ruby on Rails
SaaS
Safari
San Francisco
Scalability
Scenarios
Scriptaculous
SDLC
Search
Security
Selenium
Semantic web
SEO
Server Side
Silverlight
SOA
Social Networking
Software Processes
Songbird
SpiderMonkey
Sprajax
Spreadsheets
Standards
Startups
STI
Story Telling
Struts
Tamarin
Task Flows
Test Driven Development
Testing
The Ajax Experience
Tilt Component
Tools
TraceMonkey
Training
Trends
Tumblr
Tutorial
Tutorials
Unit Tests
Usability
Usability Testing
User Experience
user experience design
user interface
User Interface Standards
User Research
UXD
Venture Capital
Video
Vision
Visualization
VLC
Volta
Web/Tech
Web 2.0
Web Design
Web Development
Webkit
Weblogs
Web Services
Web Standards
Widgets
will_paginate
Windows
Wireframes
WordPress
workflow
work life balance
XML
XML Metadata
XUL
Yahoo Map AS3 API
YUI
Zeigarnik
Zeigarnik Effect
ZK