HTML5 Web Development – Brennen Smith http://brennensmith.local Peering into the thoughts and musings of Brennen Smith Fri, 08 Feb 2019 18:57:45 +0000 en-US hourly 1 https://wordpress.org/?v=4.7.12 Rapid Invoice Generator – Wild Wing Studios http://brennensmith.local/the-portfolio/rapid-invoice-generator-wild-wing-studios/ Mon, 01 Jun 2015 22:59:36 +0000 http://brennensmith.com/?post_type=x-portfolio&p=119 The Scenario… At Wild Wing Studios, we have to process a variety of different payment options. The majority of our revenue stream is sourced from recurring payments but we still need the ability to process one time payments for change requests or custom code projects. Given that our business model is different from our competitors, or payment and invoicing requirements ...

The post Rapid Invoice Generator – Wild Wing Studios appeared first on Brennen Smith.

]]>
The Scenario…

At Wild Wing Studios, we have to process a variety of different payment options. The majority of our revenue stream is sourced from recurring payments but we still need the ability to process one time payments for change requests or custom code projects. Given that our business model is different from our competitors, or payment and invoicing requirements are different than most companies. The core requirements for our billing system was as follows:

  1. Payments need to be processed online.
  2. Recurring payments need to be automated – we do not have the man power or sanity to chase down customers who forgot to pay a monthly invoice.
  3. Initial invoices need to be sent to clients rather than having a “self-serve” cart option – this was a UX decision which precipitated from AB testing,-we found that the majority of clients preferred to have invoices sent to them. This was due to a variety of psychological and pragmatic reasons, and warrants a post on its own.
  4. Low time impact on the Wild Wing Team – we want to focus on development rather than wasting time with complex billing systems.

While these requirements may sound trivial, we spent many weeks searching for a payment provider which provided an out of the box solution which met these four needs. We even had five student contractors work for ten weeks researching a solution, and they (independently) came to the same conclusion as our team – there isn’t an affordable option available that meets these criteria!

The Stopgap Solution…

Wild Wing Studios Sample InoviceWith the AB testing, I developed a very quick and simple cart solution for clients to go to a page on our website, select the options they wanted, and then checkout with their credit card. It worked well, but we found that we filled out the cart ourselves more often than the clients. The process flow would be as follows:

  1. Select base website and add-ons for a specific client.
  2. Click the Checkout button
  3. Copy the long (300+ chars – see example below) URL from the checkout page and paste it into an email
  4. Contact Brennen if any custom items are needed for the invoice and have him manually modify the cart to add the custom item
  5. Send to the client

This was ugly. Very ugly. Errors were often made, invoices were incorrect, and the “system” broke regularly. It was made even worse when we deployed a new website which didn’t have the cart page – we were forced to revert back to a legacy codebase whenever we needed a invoice. It was time to take this issue into our hands and develop a solution…

The Elegant Solution…

invoice_generatorI put together a two part system to generate invoices in a quick and efficient manner. This system enabled us to quickly put complex invoices together and shorten them into a pretty URL which could be sent over any modern communication medium (we haven’t tested HAM radio yet). We were able to select core products, and then add an “infinite” amount of custom line items (both recurring and non-recurring). This system is incredibly fast and flexible – we have made only two revisions on it since its initial deployment, and it has only failed when an IE6 machine was unable to negotiate the TLS connection (Sorry, but not sorry). The process now is as follows:

  1. Click the options needed and add any custom items
  2. Click the Generate Shortcode button
  3. Copy the shortcode and send it to a client

Let’s See Some Results!

An invoice generated by the previous tool:

https://www.2checkout.com/checkout/purchase/?sid=202235597&mode=2CO&currency_code=USD&li_0_name=Base%20Website&li_0_price=69&li_0_recurrence=1%20Month&li_1_name=SEO%20Optimization&li_1_price=15&li_1_recurrence=1%20Month&li_2_name=HTTPS%20Encryption%20&li_2_price=15&li_2_recurrence=1%20Month&li_7_name=Ecommerce&li_7_price=50&li_7_recurrence=1%20Month&li_100_name=Pretty%20Pictures&li_100_price=45&li_100_quantity=1&demo=Y

And here is the same invoice from the new tool:

http://payments.wildwingstudios.com/?i=9c352a76

Yep. That’s it. 422 chars shortened into 47. Not bad!

Overall, we rely upon this tool every day, and is one that we will use into the long term future.

The post Rapid Invoice Generator – Wild Wing Studios appeared first on Brennen Smith.

]]>
King County Foreclosure Address Resolver – Chrome Extension http://brennensmith.local/the-portfolio/king-county-foreclosure-address-resolver/ Thu, 02 Apr 2015 03:08:29 +0000 http://brennensmith.com/?post_type=x-portfolio&p=128 The Scenario… A friend reached out to me with an interesting problem. Currently, the foreclosure lists maintained by King County only show the legal description of the lot, basic statistics, and the parcel tax ID. While this may be useful for some, it is difficult/impossible to determine where houses are located without clicking each individual listing. With thousands of listings, ...

The post King County Foreclosure Address Resolver – Chrome Extension appeared first on Brennen Smith.

]]>
The Scenario…

A friend reached out to me with an interesting problem. Currently, the foreclosure lists maintained by King County only show the legal description of the lot, basic statistics, and the parcel tax ID. While this may be useful for some, it is difficult/impossible to determine where houses are located without clicking each individual listing. With thousands of listings, this is an undesirable process flow, and would take one hundreds of hours to sort through the data.

The Quest…

My challenge was to develop a method for resolving the individual property listings into functional data – preferably address and zipcode. This would enable my friend to be able to search by zip code, view the actual location of a property, and perform quick exporting into excel for additional manipulation.

The Process…

One of the initial considerations I had to surmount was determining the best method of collecting and processing information. I could have developed a program to pull the data down onto a separate server, manipulate it, and then display it to the user. While this would be the more traditional method, it would have required deep HTML parsing as King County does not have a API for forclosure lists. In addition, it would require either myself, or the friend, to maintain a server/hosting/application. I wanted this to be as stand alone of a program as possible, and require as little maintenance in the future as possible.

With server side processing out of the question, the next step was to look at client side possibilities. Immediately I turned to Chrome’s extension platform – the maturity and extensibility of this platform enabled me to perform the necessary DOM manipulations with little interference, keep the code contained to a single domain, and ensure that all of the data processing was performed on the client side. With this decision made, I dove into the netherworld of King County’s website to develop a solution…

The Magic…

Despite the spartan distribution of the foreclosure list, one of the most beautiful portions of the page are the Tax IDs. These IDs are essentially primary keys – they are unique values to every property within King County. I set out to discover a method on King County’s website to convert these IDs to addresses. After ruling out the official API, I dove into the deeper regions of the King County’s website. After a few hours of searching, I stumbled onto an ancient XML based API which had unrestricted access to converting Tax IDs into addresses (and much more!). Needless to say, I was ecstatic – the data was there, now it was time to put the puzzle together…

The Pieces Come Together…

king_county_address_resolverLeveraging the API I discovered, I put together a quick JQuery library which would resolve the Tax IDs into addresses. One of the major issues I ran into was rate limiting the requests – there are thousands of listings on the foreclosure list, and each one required a connection. Even with forcibly keeping connections open, it was trivial to crash a Chrome process on a machine with less than 3 GB of memory. To get around this, I had a master process which controlled how many child processes were spawned at any given instance. In addition, I leveraged HTML5 storage to store the address values – by performing a custom hashing method on the quadratic field locations, I was able to determine if the page had changed with reasonable accuracy. If it had not changed, it would leverage the stored values rather than reaching out to the external server.

I also modified the action of the URLs themselves – rather than leading to the tax parcel details, they now would link directly to Google Maps so that my friend could view the location of the property on the map in a quick and easy fashion.

Needless to say, they were impressed beyond belief, and with the incredibly “hot” market in Seattle – every little advantage in the real estate market counts.

Other Notes…

The API had a 91% success rate of converting Tax IDs into Addresses – I am not sure why there was the 9% failure rate. My guess is that the API may have been running off of an older dataset which did not contain these IDs. Either way, a 91% success rate is considerably better than having to click every single listing.

Due to the sensitive nature of this project, I will not be releasing code samples or API endpoint locations. Happy Hunting! 🙂

 

The post King County Foreclosure Address Resolver – Chrome Extension appeared first on Brennen Smith.

]]>
What Should I Ride? – An Intelligent Transportation App http://brennensmith.local/the-portfolio/what-should-i-ride/ Sun, 01 Dec 2013 22:30:35 +0000 http://brennensmith.com/?post_type=x-portfolio&p=105 The Scenario… As a student, I relied heavily upon public transportation and my bicycle to get between classes and locations off campus. Many of my friends also relied on this hybrid method of transport, and used both methods regularly. One common question, especially when traveling shorter distances, was if the bus or bicycle will be faster. Depending on the traffic ...

The post What Should I Ride? – An Intelligent Transportation App appeared first on Brennen Smith.

]]>
The Scenario…

sidebar_whatshouldiride

As a student, I relied heavily upon public transportation and my bicycle to get between classes and locations off campus. Many of my friends also relied on this hybrid method of transport, and used both methods regularly.

One common question, especially when traveling shorter distances, was if the bus or bicycle will be faster. Depending on the traffic and bus schedule, it was many times faster to use a bicycle than to wait for a bus. However, riding long distances can be slower than the bus, and bicycling in acclimate weather is not fun.

The Solution…

Given that I encountered this problem on a daily basis, I put together a small, responsive, web-application which solves this issue! What Should I Ride determines the travel times between two points (or your current location to a remote point) by bus and by bicycle, determines the weather at both ends, and makes a recommendation about what transportation method is optimal. The recommendation algorithm takes both weather and distance/time into account. It also allows for an “appointment” time – this will also tie into the recommendation if one transportation method will not arrive at the destination in time for the given time.

The solution is fully responsive for mobile devices, and leverages the Yahoo Weather and Google Maps APIs.

Given that it is not tied to a particular geo-location, I have used it with great success in Tel Aviv, Israel, and my friends have used it while traveling abroad in Europe.

 

The post What Should I Ride? – An Intelligent Transportation App appeared first on Brennen Smith.

]]>