Recent Work: Smarkets Animations
I’ve spent the last week on some animations for Smarkets explaining some of tricky concepts in betting exchanges. The animation is nothing special, but the workflow was nice.
Each scene was sketched on paper before writing a script and recording it with Audacity. My high tech recording studio involves sitting on the floor with a coat over my head to reduce echo. I then draw the scenes in Illustrator and create the animation in Flash CS3 (if I had CS4 then the bones tool would have come in very useful) and export each scene out as a .mov.
Each .mov is imported into Screenflow and then the sound effects and voiceover are combined. Screenflow is a really good tool for this job, features such as still creation, video splitting and audio playback during scrubbing make it easy to tie down the timing.
Cycling Innovation in 1896
On December 12th 1896 the countries finest manufacturers of frames, components, clothing, accessories and even a few cycling celebrities gathered at the ‘Stanley Show’ in Hatton Gardens in London. Even though the chain driven bicycle had only been in serious manufacture for a few decades, some of the innovations on show could easily pass for modern inventions and the issues (such as speeding cyclists ignoring road laws) are much the same as we have today.
I stumbled across this copy of the 1896 Cycling magazine, which doubled as the event brochure, in an antiques shop in London. According to the New York Times, The Stanley show was the “oldest and most influential bike show” in the world. It was run by the Stanley Cycle Club and was first staged in 1876. The modern equivalent would be the Cycle Show which is put on each year at the Excel Centre. This magazine is packed with advertising for the companies on show (including illustrations of their display stands so you can pick them out at the event) and I’ve picked out a few of the innovations.
Pneumatic Shoes & Portable Mudguards
The clipped shoe was invented a year earlier by Charles Hanson in 1895 so at the time of this Stanley Show most people still rode a standard shoe. This innovation from Aerope is a bladder in the sole of the shoe which can be inflated to improve comfort. Note the “well-known riders” testimonies, celebrity endorsements are nothing new.
The other innovation in this advert is a portable canvas mudguard which “Keeps the rider un-spotted from the world” and can be rolled up when not in use. Nice idea, but I’m assuming the metal frame to attach the mudguard would still be there… so perhaps not that neat. Portable mudguards feature a few times in the brochure, another example has a strip of fabric which runs from the front forks, under the bottom bracket and clipped to the seat. I’m guessing, as the horse was still the most prominent form of transport, the roads would have been pretty messy.
Rapid Invisible Inflator
“Sure to be the next big thing” and “a Capital idea” which “should be in great demand” this is actually pretty smart. The seat slides forward and a handle is attached behind. An adaptor is then attached to the bottom of the frame and behold! The seat-tube then becomes a powerful pump to inflate your tyres without having to carry extra kit.
It’s nice to note that weight was uppermost in the cyclists mind, but 7.5 ounces doesn’t seem too heavy.
Osezi Pneumatic Saddle
In the early days of steel frames, hard rubber tyres and barely mettled roads, vibration was a big problem. The modern cyclist is a pansy compared to the Victorian rider. I always thought pressure relieving cut-out saddles were a modern invention, but this pneumatic saddle made from the ‘finest pigskin’ is over 100 years old.
A year later Osoezi had taken this a step further with the addition of a valve under the saddle so you could vary the pressure whilst riding.
Strength
Strength is a theme running throughout the show, this example shows sixteen men (collectively weighing 2,448 lbs) standing on a bike to demonstrate it’s fortitude. “Eclipse Cycles stand the test!” it proudly proclaims. Sadly it’s just an illustration (there are only a few photographs in the entire catalogue) so we can’t really vouch for the credibility of the test.
The manufacturers of the “America” Truss Frame put together a nice PR stunt and demonstrated how their frame was pretty tough because it managed to carry the worlds heaviest rider “Baby Bliss” (all 502 lbs of him) a whopping 3,000 miles!
That’s a long way to go on a single speed even with modern tech so god knows how long it took him (or how much he weighed at the end of it). I can’t find any reference to Baby Bliss anywhere on the internet but I’d love to know more about him.
Clothing & Fashion
That’s enough for innovation for now, next time I’ll collect a few of the clothing adverts.
Geeks on Bikes gets a new home
Now that I’m back in the UK I’ve put together a permanent home for Geeks on Bikes. The next ride will be on the weekend of the 23rd of January, if you’re interested, put your name down!
Cycling Statistics for 2009
I set a goal at the start of the year to ride more than 3000 miles in 2009 so I’ve been keeping track of my cycling all year. I use bikejournal to store my stats but their graphs aren’t very nice so had a bit of fun visualising the data.
The start of the year I lived in Miami and I was riding pretty much every day exploring the surroundings. The blip in August is because I went travelling to South America for a month (still managed to get one ride in Peru!) and since returning the UK in September I’ve only ridden a daily commute to work and a few rides on the weekends.
Improving the experience of pagination
I’ve been talking about creating an improved system for paginating for years, but only at my current employer (Smarkets) did the planets align and we were able to build it.
Traditional pagination
The standard method of pagination involves a 1 to 10 list of pages with a ‘next’ and ‘back’ button and perhaps a ‘first’ and ‘last’ link.
This works fine for a small set of pages, but as soon as you’re paginating more than 50 records, its hard to navigate to the midpoint or fuzzy areas like ‘near the end’ without lots of clicks. Some implementations chunk the records into groups of ten, or a hundred but this doesn’t scale when the number of records could vary over time.
Bell Curve Pagination
What we wanted to create was a pagination system where the distribution of links changes in relation to both the number of records in the set, and the current position in the set. Users need small jumps close to their current position and then wider jumps towards the end.
The mathmatical model we use is a slightly modified Bell Curve. The user can access the nearby pages as well jump to midpoints or the start and the end without the needs for pre-defined links. Note: the numbers I’m showing here are just examples.
If there are 100 records in the set and the user is at the mid-point they will see links to 49, 48 and 51, 52 but as the range extends outwards, the granularity of the links changes.
Using this system the user can navigate in a more natural way such as ‘it was near the end’ or ’somewhere around 40′ and can find a record far faster than the traditional method.
The added bonus is that this is SEO gold. Google only navigates a few pages deep and by exposing your entire record set (rather than just the first 10) search engines can index the entire range with just a few jumps.
Extensions & Open Source
You can see Bell Curve pagination in action on any long list page on Smarkets. I’m pretty pleased with how this has worked out and props to Hunter and Brad for getting this done.
We can set the number of items to display and the fall off of the curve (to allow control over the number of links close to the current position) but we have a few more settings we want to implement before we open source the code and release it publicly.