Go Straight to Content

What I'll Be Ranting About

Good development practices bring us quality code, confident systems, and missed launch windows. When do you refactor and when do you factor in the passing time? As engineers we need to design what is possible and capable. As programmers we need to turn imagination into reality without a physical product. As developers we need to bridge the gab between that engineered vision and the end product.

I also blog more personally over at my tumblr page.

I am available for small contracts, consultations, tutoring, and other development services. My "skills" as a technical writer are also available. If you've got anything you'd like to talk to me about or for me to see, drop me a line.

Tuesday, September 08, 2009

How To Select from a Range

I had some down time today to relax, and in true obsessive fashion I spent it coding for the hell of it. I got something in my head and whipped up a demo of the idea. Do you ever need to let someone select a range of things? Maybe they need to pick which and how many items to show in a search result or which letters of names they want to see from an address book? I wanted to allow selection of both "what" and "how much" in one click.


click for demo

The range being selected from can be anything: numbers, letters, weeks of the year, etc. Users can click among that like a list of a page numbers, like they would expect. I think this would work well in situations where you don't need the entry to be exact, although it can be used for precise entries. Multiple quick selections would also be easy here, maybe quickly changing the range you're viewing in an analytics app. I'd also like to look at adding a "zoom" feature, so that one selection fills the entire widget and then you can select within that to narrow down on the exact range or specific item you want.

Fork away! Especially if you're the kind of developer/designer who can make this not look like government grade bread

Github: http://github.com/ironfroggy/rangeselection/
Demo: http://ironfroggy.github.com/rangeselection/
License: MIT

2 comments:

Lennart Regebro said...

Not bad. But will non-programmers get it? It's worth a try.

Calvin Spealman said...

It does fall back on expected behavior. You can click on the range labels as if they were page numbers and it works as expected, but the highlighting will make the more-than-one selection ability obvious (I hope).

Blog Archive