Each May, birders from across the country gather in Cape May for the World Series of Birding, a competition to identify the most number of birds in 24 hours. Besides bragging rights, the competition is also a major fundraiser for bird conservation.
Through 2015, all record keeping and reporting was done on paper, and the competition culminated at midnight with a mad dash to get the reports in, at which point the organizers would verify records, tally up scores, and figure out the winners.
I quickly identified 3 major users-
- Competitors, who needed to quickly find and report a sighting, with proof as needed
- Organizers, who needed to monitor progress throughout the day, verify questionable sightings, and tally scores quickly
- General public, who needed live updating stats throughout the day
For competitors, I wanted to provide a way to submit sightings through their smart phones. Due to the quick turnaround, and wanting to make sure it was accessible to all competitors, I opted for an HTML 5 web app. I used the Framework 7 framework, which provided theming as well as some methods that allowed me to quickly build navigation and views.
Since competitors would be moving throughout the entire state, I implemented an HTML5 Offline web cache. I used WebSql for local storage.
Since the rest of the website was being built in WordPress, I decided to build the component for organizers on top of WordPress. The data from the web app needed to get to WordPress, so I used an open source library called WebSqlSync to implement a 1-way sync that used a custom API. There was a clear separation of species data that was coming from competitors and the approval data that was added by the organizers.
Through a Wordpress plugin, I built custom post types, added custom permissions, and implemented a custom API. I also added multiple custom tables using DataTables that showed organizers the information they needed. In order to allow them to quickly approve sightings, I added a modal overlay that allowed authorized users to perform actions from the front end.
For the general public, I created and themed a heads up display with key stats as well as a tag cloud display of the species reported so far.
Testing was a big concern for me- since this was a 1 day event, there wasn’t an easy way to replicate all the variables. I wrote unit tests to verify calculations, and also used a small group of beta testers to make sure the app worked on a variety of devices. I also provided extensive support on the day of the event to ensure that things ran smoothly.
The event ran smoothly, with only minor glitches that were quickly fixed. Competitors found the app simple to use, and seemed to prefer it over the old method. Organizers were able to more quickly tabulate results, and were grateful to have an earlier night. The general public seemed eager to have live updates.