While working at Rosemont Media, I was tasked with building a tool for the sales team to utilize at trade shows to see if the company could provide marketing for potential new clients. The idea revolved around the ability to search for a lead’s address, simulate their approximate marketing exclusivity area, and display the surrounding current client locations and radii. If the lead’s radius overlapped with an existing client’s in the same practice category (plastic surgery, dentistry, etc), then Rosemont would not be able to provide that lead marketing within that particular radius.
I was given a deadline of 4 weeks, which was when the next trade show happened to be. The only technology requirements were the use of Google Maps and to have it “work on an iPad.” It was requested that a maintainable list of clients be stored in a database.
Planning
Before planning an outline and creating a schedule, I decided to interview the sales reps to determine their functional requirements. Unanimously, the reps required several ways to filter their searches: by address, by state, by practice category, and by which rep. Additionally, they wanted a way to simulate a lead’s potential exclusivity radius.
Once the user requirements were documented, I began creating an outline of tasks to be completed, and developed a schedule, spacing out the workload over a two week period. This left the remaining two weeks for testing and revisions. I settled on the CodeIgniter as the MVC framework for the project for its numerous helper classes, short learning curve, and plentiful documentation. The application would require user login, allowing several access levels. Admins could create new users, create new practice categories, and assign user rep status. Editors could add clients, viewers could utilize the map tool, and all users could edit their own login credentials.
Building
First, I created basic map functionality by manipulating the Google Maps v3 API with JavaScript/jQuery using static data. From there, I dropped the map functionality into the CodeIgniter application and constructed a query string to reflect the user’s requested client filtering. Using jQuery and AJAX to send the query string to the application, the application retrieved a JSON object containing the search results queried from the database. The filtered current clients were added to the Google Map, which then zoomed to the lead’s location. If no lead address was entered, the application would display all the filtered clients.
The design department was tasked to theme the application, which I then applied. To account for many screen sizes, the application utilizes a fluid design. jQuery supplements this by resizing the map iframe upon any window size changes. I made sure to carefully document the entire application in case another developer had to alter anything in the future.
Testing
Once cross-browser and iPad testing was complete and all obvious bugs were accounted for, I had the sales team trial the application under close observation. Several fixes were implemented, including the addition of an information bubble displaying current client website addresses, reps, and practice categories. Several UI tweaks were requested, such as the ability for the application to search once the enter key was pressed, and the addition of a reset button.
Results
The project, including testing and revisions, was completed within the time estimated. The total time to completion was approximately 45 hours. The sales team was pleased with the application, having great success at the trade show by quickly determining whether Rosemont could provide services and addressing as many leads as possible. Because the map positively changed the way the reps worked, they met shortly after the trade show to redefine their definition of client exclusivity mileage and, in turn, maximize their efficiency. Additionally, they were able to find many new regions of the country to focus on.
