Citywise

I began working on this project at the beginning of 2013 with two others. It has changed a lot since then. Initially, it started as a mobile app that would allow you to explore virtual representations of different cities. In a virtual city, you could click on buildings and see the business info and ad for the businesses in that building. We did this using Unity3D.

In order for a business to be in our app, they would have to sign up through our website. I felt sorry for any business that had to do this because the developer responsible for the website wasn't a “UI guy” and made it using jQueryUI.

Eventually, though, that developer quit. When that happened, the remaining developer and I decided to rebuild the website using a more modern stack Like Ruby on Rails, Bootstrap, and jQuery. As the months rolled by, the website became more and more UI heavy, eventually becoming the infamous “jQuery soup.” Figuring we couldn't keep on going like this, I sought a solution.

Around this time, Angular was all the rage amongst JavaScript frameworks. After reading through the docs, I decided to use it to rewrite our application. Using it was leagues better than using jQuery alone. My favorite part of it was the mustache templating and two-way data binding. These two features alone made my colleague and I productive enough to rewrite our front-end in Angular in about a week.

After a few more features were added, the project went on pause for a while until the company could get more funding. During this time, I picked up MeteorJS, a full stack framework. There are reasons why, at the time of writing, MeteorJS is the most stared web framework on GitHub. Real-time data, no configuration, and ReactJS support to name a few features. So when funding came in along with a bulk of new features, we converted over to the MeteorJS stack and never looked back.

What I Did

The feature I worked on the most was the “ad player.” Essentially, it was a short digital magazine a business could make. Each page could have a video, pictures, audio, and/or text. Getting this to work originally wasn't too difficult. One would fill out a fairly long form and the ad would be generated based on the data they entered. But our investors wanted to edit the content directly, without going through a form. Doing so meant using the contentEditable feature in HTML5. Getting this feature to work consistently across all platforms, I'm pretty sure, was the hardest thing I've ever done. But, all in all, it's one of the coolest and unique features, that I've seen, in any web application.