Launching the TheKnot.com Search BETA

Screen Shot 2012-12-24 at 4.22.03 PM

My major project of 2012, TheKnot.com Search BETA, launched earlier this month, the morning of December 14th, and it was a journey worth documenting. It began back in May when the company decided to start our own labs or internal incubator groups. One began right away in New York City and the other started a couple weeks later in Austin. I had the opportunity to join the Austin group with a team of developers and product people that I highly respected. I was grinning the whole time with excitement. With the direction that we were independent from the company but had access to the data we sequestered ourselves in a room for a few weeks. Over pots of coffee and pints of beer after work we brainstormed our some good ideas for our brides to find inspiration for their weddings. Our group started out as Judy Galani, Product Strategist, Forrest Andrews and Matt Oehlers, Senior Software Engineers, Erin Bender, Freelance Art Director, and myself as Interactive Media Developer. We “sold” the idea and working prototype to our “investors” by October and it was then time to go from prototype to production.

We had to take the design in house from this point on, but after a fond farewell and thank you to Erin we started to add in more management to the group. It was a greenfield project so our back-end developers Matt and Forrest were excited to push forward into new territories. Within a day or two we were able to deploy projects straight from Visual Studio to the AWS servers, I was blown away. Forrest focused on our MongoDB NoSQL data store and the API that I would later pull all the front-end content from, ASP.NET MVC. Matt worked on massaging the data into Apache Solr and in a matter of days we had an impressive result set coming back for queries.

Screen Shot 2012-12-24 at 4.22.40 PM copy

The front-end technology was built to be a responsive two page website that used a combination ofjQuery and Underscore.js along with HTML and CSS to create a multi-device interface that would be familiar and easy to use. The main grid view uses Masonry to create the Pinterest-esque layout for search results and Underscore.js templates to load in a different layout for different data types. The single page view focuses on a low browser width touch interface to give a very image focused search experience. To combine and minify the page scripts down I used the BundleCollection library in ASP.NET MVC which worked great. There are still a large number of extra scripts on the page but I’ve tried to load them asynchronously and not let them interfere with using the interface immediately.

The site has been up and working great for a few weeks now and launched along side a new look and feel for TheKnot.com. Go take a look, and of course let me know if you find any bugs here or on the feedback tab on the bottom!

Continue reading

Post-mortem report of my free online dating service; Part 2 of 2

My free online dating site launch in May of 2009 after a little under 2 years of work. Now I just need to get people to come to or write about the site and the real work has begun. I post it up to all the social networks at the time telling people to come check out my site. “SPAMMER!” I hear. Crap, how can I tell you about the site but not tell you about the site?

I thought my solution to organic marketing would be to get other people to write about it. I searched for and made lists of blogs and sites that wrote about online dating or dating in general and started crafting individual emails for each site. For hundreds of sites I found I spent a few hours each night trying to first find a method to contact them via form or email. If I was able to find a contact method I wrote up an email about how awesome my new site was and the work I put into it and they should take a look or write about it. After a few months of this I was completely burnt out. I had gotten next to no responses from all my work, less than 1% feels generous. No one responding to me after the hundreds of communications I sent out was crushing.

I tried a couple of paid per post services but that investment didn’t pan out. The services themselves were OK, the posts went up pretty quick but the types of sites doing this weren’t exactly well respected. With all their other pay per posts it was like trying to hold a quiet conversation at a concert. A worthless avenue for marketing.

The only reliable method to get new visitors from day one that I used was online advertising through Google AdSense and Facebook Ads. I setup accounts for both services and right away I was getting click throughs and new members. Everyday I was checking my cost per registration from both services and quickly found Facebook Ads just wasn’t performing well. With just Google AdSense to focus on I created a dozen campaigns with different keywords targeting states, cities and the different sexes. I spent a good amount of money here and it was extremely addictive. I would not recommend pay per click campaigns for anyone without extremely deep pockets or free services to use. Without this service I would not have gotten any users and with it I ended up hating the project more and more. I was spending money everyday and making a little money but it was never increasing over time.

One of my biggest mistakes was not developing a proper site administration system. I underestimated the amount of profile removals I would need to make per day. I spent about 30-45 minutes on some days just cleaning up bad profiles. I finally setup a rudimentary system but even then I sometimes had to resort to my set of SQL scripts to do some tasks.

My largest problem I never resolved was spam. The only people that actually wanted to seek out and use my site were spammers. Mostly from Nigeria and it’s surrounding countries but also from Russia for mail order brides. I had ReCAPTCHA in place but they didn’t care. These weren’t robots I was keeping out but tons of people that sent out hundreds of messages a day. My final attempt was a manual message and user approval process. That meant that before any new users messages were sent I had to approve them. This was just too much work and something I never considered before launching but could never solve afterwards. They ruined the site for me and the legit users that signed up.

I’m going to shut down the service this year and will be open sourcing my code, I need to clean out any S3 key stuff. There was a lot of important lessons I learned during this experience. My product didn’t have an interesting angle. I didn’t solve any new problems or solve an existing problem so well people wanted to talk about it. My marketing was underbudget to compete against the larger players. I under developed my application and failed to think through the spam factors.

I’m happy to have done the project but I’d be lying to say I’m not even happier to have it in the past.

Check out Post-mortem report of my free online dating service; Part 1 of 2 if you didn’t see the ramp up to launch

Magic Eight Ball with the Raphaël JavaScript Library (1.5.2)

Wrigley’s Magic Weight Ball is my first project using the Raphaël JavaScript Library and it just went live. I used Raphaël JS version 1.5.2 which you can download from GitHub. The project requirements came through as only being an iPad version that responded to a shake event. Getting to use a new technology for a front-end project where you only have to support one resolution and one browser is an excellent opportunity to try new things. I knew in the back of my head that they would want a non-shakeable static version as well but they just didn’t ask for it yet. Internet Explorer still came into consideration when I was evaluating technology solutions because I was certain it would come up eventually.

When I saw the Nissan Leaf site I was blown away by the heavy JavaScript animations being used. It really reminded me of the early Flash animations and sites in a way. The Hacker News submission I saw the site from pointed out that the animations were being handled by the Raphaël JavaScript Library. This was still fresh in my mind when I got this project so I loaded up the Raphaël demos pages in a ever browser I test on, IE6-9, Safari, Firefox and Chrome and they all worked! This was the library for this project.

I finished up the iPad version of the site http://content.theknot.com/sitelets/magic-weight-ball/ipad which requires iOS 4.2 or higher and was pretty happy with the results. It responds to a full shake event to give you another tip, the tip will bob lightly in the water when moved a little bit and the tip orients to the iPad. When the tip is touched it provides a little modal with more details. The site even supports landscape and portrait viewing.

About half way through developing the iPad version the email I was expecting arrived. “Oh no!” they said, “We need a static non-shakable version for desktop users to visit.” I was already prepared though. When I though about a desktop version I first defaulted to Flash but I wanted to give Raphaël a try first. With a IE6 PNG alpha transparency fix and a small work around for IE to get the Raphaël image src it was up and running on the desktop.

You can visit http://content.theknot.com/sitelets/magic-weight-ball/ to see the result and if you happen to hit the page in an iPad you will get a slightly modified version that still responds to the shake events, always giving the best experience possible.

The weight ball interface itself is a series of 3 layered PNG images. The top most image is a 24bit eight ball and the rest of the tips, triangles and back black images are all 8bit PNG images with the a properly picked matte color. The total site size was reduced as much as possible and the designers loved the look. I reduced the number of colors where ever possible and used a pattern dither, it really seemed to look the best even though it bumped up the file size a bit.

For this animation interface the Raphaël JavaScript Library was a perfect fit and I was able to provide a cross platform and cross browser experience that I was very proud of.