Ultimate Frisbee Rules App

ultimate frisbee rules app

As far as could tell, there wasn’t an easy way to navigate the absolutely ridiculously confusing rules of ultimate frisbee. The closest thing I could find was the Montreal Decision Tree, but who wants to print that out and bring it to the field?

So I created a web app to get to rulings faster. I don’t think it will be useful for rulings at the time of a decision needing to be made, live, in a game – but it would be great for followup and clarification after the fact.

Hopefully this little web app goes a long way in helping make the rules of ultimate frisbee more accessible, and less intimidating.


What Are You Doing With Your Free Warehouse?

We’ve all left websites because we’ve been asked to log in to access what we want. Nobody wants to set up yet another account if it can be avoided. So, as a business, how do you grant certain powers to your visitors (like making a wish list) without making them log in first?

Without getting technical on you, it’s called LocalStorage, it’s relatively new, and very awesome. Instead of storing user information in your database, you store this information in their browser!

Prior to LocalStorage, the only ways (that I knew of) to store information in the user’s browser was with cookies and session variables. A cookie was limited to 4kb in size. How much more space does LocalStorage allow? A lot more. How much is “a lot” you ask? 10x more? 100x more?


1250x more space on mobile (5MB), and up to 50MB on desktop. For free.

That’s like someone coming to your house and turning your garden shed into a warehouse.

Warehouse contrasted with a garden shed.

The only question you need to ask yourself now is, what are you going to do with your warehouse?

Here’s an example of what we did for Creative Landscape Depot:




The Machines Are Taking Over

And that’s a damn good thing because who wants to stare at excel sheets for the rest of their lives when a computer can do it?

Saving time is the best. It’s even better when it’s a computer doing it for you, and simultaneously increasing likelihood of someone actually buying your products. There are all kinds of ways of making our business processes easier by letting computers do more of our work – we just need to get better at asking ourselves what we’re doing that we shouldn’t be.

Clues a given task doesn’t need to be done by you:

The task is repetitive.

The task requires no human judgement.

There are hard rules and absolute outcomes for the process.

One of the strange and awesome side-effects of outsourcing tasks to algorithmic apps (like the Backsaver Finder) is that it improves User Experience (UX). People have fun using intuitive programs to find what they’re after. And that’s the whole name of the game right there. Give your users what they want, and make it as enjoyable as possible.

An Egg Timer for Your Life

Sometimes we need an egg timer for our lives, like when we spend HOURS sitting at a desk. I’ve written a little script that lets you set an alarm for yourself – to remind yourself to get up and stretch? Eat? Blink?

This project provided opportunities to make a sexy user experience, like preventing the “minus” sign from appearing if you count down to 1 (to prevent negative numbers from being possible… otherwise we’d be setting an alarm for a point in time that has already passed, no?).

Another bit of UX: the text in parenthesis disappearing when you run the timer. You only need to read that once, then it can go away.

The flashing green bar indicates how many seconds remain per minute. It’s 60 pixels wide, so I remove a pixel with each passing second. This wasn’t terribly obvious at first, so I also made the seconds countdown toggle between a lighter “limegreen” and just normal “green” css values. This gives the impression that it’s flashing. The dark grey background makes the colours feel like they’re lights on a digital display, which makes the whole application seem sleeker somehow. I don’t know how or why, but it looks cool that way.

If you’ve already started the countdown but don’t want to wait the full 25 minutes to hear the alarm, just click the minus sign furiously until you’re down to 1 minute.


Baking up a Colour-Randomized Calculator from Scratch

While coding a calculator from scratch (using HTML/CSS/Javascript) I thought it would be good, wholesome fun for the buttons to change colour randomly. They probably make buttons on calculators boring for good reason. Once the random colour-changing was in place I found myself forgetting about the math and taking far too much pleasure in clicking buttons at random. Like a child.

Go ahead, try it out!

I thought this project was going to be way trickier than it turned out to be. Apparently you can pass an ugly string into the javascript eval() function and it does all kinds of magic (including treating strings as numbers and operators (like +-/x) as operators. It just crunches through and gives you an answer. This last bit is super helpful because I was trying to store an operator in a variable and getting all kinds of errors!

Eval() does its best to resolve whatever you throw at it. Even if you try something stupid like 5 – + 5 it simply ignores the first operator and adds the 5s together to give you 10.



Freshly Launched Website: Craig Containers Inc.

Smell that? It’s a freshly launched website! http://craigcontainers.com/

The coolest part about this website is the intro video, no doubt about it. In 47 seconds you get a vivid sense of the history and values of Craig Containers – which is to just keep making damn sturdy laundry carts.

Another massive addition to Craig Containers’ online arsenal is the “Products for Home” section. This is exciting because it exposes them to an entirely new market (their old website only showed the industrial stuff).

industrial website categories

I also got heavier into Photoshop than I generally do for a website because everything needed to be on a white background for consistency. This cart was a nightmare, but worth it:

As with most of my sites, I’ve used native Bootstrap hidden classes to show text phone numbers at wider widths (computer screens) and dialer buttons at narrow (mobile) widths. Really hoping this drives up inbound phone calls for these guys!

dialer phone number button


New From Google: Posting on Your Business Listing

Google business listings are so insanely important because they appear alongside search results (over on the right hand side of the page) and contain reviews for a business as well as hours, location, and so forth. Today I got an email from Google announcing a brand new feature: the ability to create posts directly on your business listing and include fancy “call to action” buttons like “buy now” and “learn more”. Video screencast opportunity? I think so:

50 Years in 50 Seconds

Well, the day has arrived: we’ve reached a point where mobile data is fast enough to justify having video on pretty much every type of website I can think of. This is why I’m now pushing for video content wherever possible on my clients’ websites. And, when appropriate, I enjoy handling production of the video personally.

A video can communicate in seconds what might otherwise take minutes (using photos and text). And with the damn-near-zero attention span of typical website visitors, we just don’t have minutes anymore.

If a picture says a thousand words, a video says a million.

Consider this 50 second cross-section of a 50-year-old company:

Using Magic Elf Buttons to Drive Sales

The question I most frequently ask my clients is: “What are the first few questions you always ask your prospective customers?” The reason I ask this is because the answers clients give usually reveal compelling opportunities to ask those same questions through the website in some kind of interactive way.


The Creative Landscape Depot Materials Calculator.

All day, every day, CLD employees ask their customers questions like “What material will you be using for your landscape?” and “What is the shape of the area for the project?” and “What are dimensions of the area?”

CLD employees then run materials calculations for customers. So building an online application that could automate these materials calculations was a compelling project for me. I really wanted to automate this process as much as possible, while establishing communication with a CLD sales associate as soon as possible (and with next to zero effort for the website visitor).

Originally, the application was just a standard calculator. Users could select a material (mulch, sand, lava rock) and an area shape (rectangle, circle, triangle) then input dimensions and depth. Hitting “Calculate” produced the cubic yardage and weight in pounds. At this point I thought the app was pretty cool, but not quite there yet. It was still falling short from a user-experience perspective.

I always try to design user-experience around the absolute best-case scenario. So I run my materials calculation and then what? Stare at the screen and figure out what to do next? Bad. Do I call the depot? Is there a phone number? That’d be a bit of a pain in the ass… and probably a good number of website visitors wouldn’t be bothered to follow through if not prompted to do so.

Back to designing around an idealized experience. Ideally, “something” would happen at the click of some “magic button” which would seamlessly alert a CLD sales associate of my needs. This sales associate would then take care of the legwork like a magic elf. Wait a minute! Good ol’ javascript can get the CLD elves mobilized!

While Googling my way into the mailto: attributes of an anchor tag (fancy coder lingo for an email link),  I discovered that not only was it possible to specify a Subject line in an email link, but one could even build the entire email beforehand, injecting relevant outputs gathered from the user’s materials calculations.

Building a custom email automatically = Super Awesome.

So now the calculator arrives at a volume and weight, and a magic button appears prompting the user to “Get an Estimate”.

Clicking this button pops open a new window and builds the following email:

auto generated email

And now the user has only to click “Send” and the elves do the rest!

I really hope this calculator drives literal tonnes of bulk material for CLD. I also suspect that most businesses could dream up some kind of custom-tailored interactive lead generator like this – one which combines awesome value for their visitors with resultant jet-fuel for sales conversations.

If you have any such ideas for magic elf buttons and care to spitball, please do so in the comments below!