How my hackathon idea became an actual product
A case study for FreshBook’s Business Name Generator
Introduction
I was involved in a number of projects during my three years at FreshBooks. However, I can simply say that FreshBooks’ Business Name Generator was by far the one project that stands out. This project allowed me to step into a role beyond my job title and it influenced the creation of one of the biggest undertakings in the organization’s history, the relaunch of FreshBooks’ website.
Origin
From October 7–9, 2015, every developer and designer throughout the organization participated in a company-wide hack-off, where we had full autonomy to work on any project outside our day-to-day responsibilities. Inspired by a personal project, The Wes Anderson Character Name Generator, I thought it would be neat to ‘remix’ a project of that vein but gear it towards ‘potential’ FreshBooks customers, the small business owners. The original thought behind this would be a great way to introduce the FreshBooks brand to potential small business owners since there is a high chance that one-day they will be needing an invoicing and expensing solution for their business; and as a result, the business name generator (BNG) was pitched.
I enlisted then co-op student, Dylan Cooper, where we explored ‘how others’ developed their own BNG. We looked a many examples; however, Shopify’s version stood out the most. Aside from generating a wide array of potential business names, there was the ability to also purchase a Shopify store domain, based on any of the business names that the BNG instantly came up with.
Within two days, Dylan and I created a working BNG from commonly used words found in business names from a spreadsheet provided by the data science team. That was orchestrated by Chris Conway, then Director of Analytics and Performance Marketing. Aside from creating new business names, Dylan and I also implemented an application programming interface (API) checking whether a .com internet domain was available for the newly created business names. For the purpose of the hack-off we used a free-tier of the API; thus, we were limited on the amount of API calls we could make. As a result, the API was non-operational when it came time to present our project to the company.
After the presentation, Chris shared that the search term business name generator is a popular search query on Google; therefore, introducing FreshBooks to an audience who may not already be familiar with it. Chris and I also discussed the possibility of developing a toolkit made up of an array of applications that is aimed at helping small business owners at any stage of their business. As we were listing them one-by-one it became apparent that the possibilities seemed endless.
From Hack-Off to Kick-Off
Two weeks has passed since the hack-off. While approaching the finish line on a major project, I got word that there was interest in promoting the business name generator from a hack-off idea to an actual landing page on FreshBooks’ website.
The time-frame for this project was two weeks. Even though two weeks sounded like a luxury, especially in comparison to two days, we decided to approach this project as a minimum viable product (MVP).
Many of the same players who were involved in the hack-off joined this project with the exception of adding Chris as the stakeholder, and Erin Morris, then Art Director, as designer.
Kick-off Meeting
Observation:
At the project’s kick-off meeting, we, the team, revisited the top five business name generators, returned from a Google search, which also included Shopify’s approach, where we painstakingly reviewed how each one worked, and the quality of generated business names it returned.
After reviewing the top five BNGs we agreed that the generated names returned were not great. Sure they each returned a large number of generated business names, but all it did was add a random word either before or after the word that the end-user had input themselves. Shopify’s Business Name Generator was the only one that didn’t look “cheap”. What helped was not only allowing the end-user the opportunity to purchase a store domain, but it engaged a conversation by providing insight on the importance of creating a great name for your business.
Our Approach:
We wanted the interaction of our BNG to be unique in comparison to what we’d seen. We decided to focus on four industry segments to keep in line with the organization’s marketing objectives at the time:
- Creatives & Marketing
- Legal Services & Business Consulting
- Trades & Home Services
- Information Technology
As a result, we agreed that our BNG would ask which of the four industry segments their business was in. In putting these parameters around their business’ industry, the results would be more targeted instead of yielding a much longer list of names as seen in Shopify’s Business Name Generator.
Since this project originated as a hack-off, where its ethos centered around exploration and experimentation, we discussed ways of showcasing the fun tone via the combination of both original illustrations and animation working together, something that had yet to be employed on the website. Aside from experimenting with the aesthetics, we also discussed about exploring the use of flexbox, a new layout module in CSS3 growing in popularity, all the while working within the established development system.
In regards to the domain name check feature that was “implemented” during the hack-off, it was decided that it be abandoned for the time being, due to the two week timeline and extra overhead to consider especially without any prior research or knowledge whether that feature was even worth investing our efforts in. Although that was the case, there was a possibility of exploring that feature at a future date.
With everything laid out, it was time to bring out the markers and blank pieces of paper for the design charrette. Not only did it initiate a conversation with everyone in the room, it also presented ideas when creating the medium-fidelity designs.
Before concluding the kick-off meeting, and setting-off to the races, we agreed on holding our own stand-up rituals/check-ins to ensure we remain on track and field any questions/concerns throughout its production.
From Kick-Off to Production:
Now that we were off to the races it was time for everyone to get to work. While Erin was designing the medium-fidelity versions of the BNG, Dylan and I began researching whether web animation and flexbox could work hand-in-hand with the system and setup already in place.
The following day, Erin shared three medium-fidelity designs where everyone got a chance to share their viewpoint. From the three designs we narrowed to one. Also, Dylan and I shared our insights regarding the challenges and work-around required to implement web animation and flexbox to this project. Traditionally, once the high-fidelity design/prototype was complete development would begin there after. However, for this project, Dylan and I began laying down the HTML foundation and back-end architecture in order to get a head-start.
Even though Chris was the project stakeholder, he was hands-off during its build. As a result, both Erin and I adopted a Product Manager (PM) mindset, ensuring that we launch according to the two-week timeline we had agreed upon, all the while focusing on our designated duties.
As construction continued, the daily stand-ups were helpful, especially during moments of unexpected surprises. For example: the switch from one animation library to Animate.css, sourcing/creating illustrations that also happen to be minified scalable vector graphics (SVG), all the while building/compiling a library of words to generate business names.
For two weeks straight we all worked extremely hard to ensure we don’t go beyond our time-frame. In early November of 2015, at the two-week mark, the FreshBooks’ Business Name Generator went live. Also, within three months, it ranked on the first page of Google’s search result for the query business name generator, and continues to rank on that page even to this day.
The fall of 2016 saw the launch of a new version of FreshBooks, built entirely from the ground up, which is the biggest undertaking in the company’s history. In conjunction with its release, the website also underwent a complete redesign. During the development process the two technologies that were piloted on the BNG, flexbox and SVG, were used throughout the development of the redesigned website and had continued to be used on all website-related projects there after.
Lessons Learned
The setup of innovation days/hack-offs are not only good for the culture of an organization, but can also inspire the creation of projects like the business name generator. Not only that, but it’s also a great opportunity to experiment with emerging technologies that can be used in future projects. Even though my designated role within the company was a front-end developer, this project allowed me to step into a PM role, overseeing the production and launch of such a project within a two week sprint.
Looking back, I wish we had allocated some time to talk to people who may use this tool. Allocating time for research not only helps to further develop existing tools, or create new ones, but ultimately helps better serve the end-user by finding out the “actual” problem at hand. This experience, helped me realize that, and is a lesson that I now carry with me even to this day.
