Change url without refreshing the page

For years, I’ve used SWF Address to change and listen to changes in the urls hash (#foobar). Problem is hash’s aren’t able to be indexed and they don’t get picked up by Facebook’s linter.  I’ve used SWF Address a bunch of times in photo galleries,  Starting ‘back in the day’ with flash and flex applications and more recently jQuery based web apps.

Today I build the front end of a dynamic photo gallery for a client.  After seeing Github and Flikr recently adopt the new HTML5 ‘onpopstate’ functionality, I decided to dive in.  I decided to use this library: https://github.com/balupton/History.js/ to allow HTML4 browsers it will to revert back to using the old onhashchange functionality. Take a look at the JavaScript code below and then check out the links at the bottom.

Some Code:

//Listen for the 'statechange'
History.Adapter.bind(window,'statechange',function(){
var State = History.getState();
History.log(State.data, State.title, State.url);
});

// Initiate a url change
History.pushState({json_key:'val'}, "Example Title", "?url_to_go_to");

Further reading:

Posted in Uncategorized | Leave a comment

Professional Real Estate websites

Websites are purely marketing tools for many businesses.  One industry that I feel is behind the times is real estate online.  Property websites typically are terrible.  They aren’t user friendly and the focus is on all the wrong things.  Don’t show people 10,000 facts right way, sell them the dream of the property, and then get into the details.

People research online before doing anything.  They want to narrow their search.  The first thing potential home buyer typically will see is your website, make sure your property website is awesome.

Here is what I believe constitutes a good property website:

  • LARGE PICTURES:  lots of them.
  • SIMPLE: no clutter, keep it simple and to the point.  Most sites have 10 navigational links that distract the eyes.
  • FOCUS: allow the user to focus exactly where you want them to look.  You need to create an emotional connection to your property instantly.
  • DETAILS:  Give the user a full spec sheet of everything they’d possibly want to know about the property: taxes, school, etc.
  • MAP: Show potential buyers the exact location.
  • DOMAIN: it’s $10 at the most, buy the domain of the property.

Here are a few of the sites we’ve made:

I’d love your feedback.  Here is our landing page: http://www.domainsforproperties.com/

We built a tool that can automatically generate these real estate websites without the large price-tag that comes with completely custom work.

Posted in Uncategorized | Leave a comment

Google Car Dashboard

No, this isn’t real.  I’m writing this mostly to look back in 5-10 years hoping I’m right.  The other part of me just loves innovative software.

I don’t mean Google Cars, that is something different, however I’ll explain why maybe they aren’t so different.  What I envision is a replacement for that god awful software that sits in the center console of your car.  They lack the speed and overall awesomeness that accompanies Google products.  For example, which do you prefer, your cars navigation system or Google Maps?

Android is already built to handle this exact situation.  Based on Java, it’s the perfect tool to be able to plug into all the existing interfaces that cars have built already.  The infrastructure in cars is for the most part here, it’s the user facing software that needs the upgrade.

Why is this good for the consumer? We get to escape from the half assed current software that isn’t connected to anything we do.  Connectivity is important, how useless do you feel without the internet these days?  You’d be able to adjust your route in live time based on traffic.  You’d have the most complete business directory available.  You’d be able to have all your communication challenges (phone, email, text) right in front of your face and voice activated.

Why this is good for Google? All the tie ins to existing products.

  • Google Maps (obviously).  Traffic overlays, the best directional system out there, easy interface with voice.
  • Google Places: another obvious tie in.
  • Android Market: Apps for your cars? Awesome.  Hopefully their will be some governing body to prevent people from playing games while driving though.
  • Google Offers: although I don’t like the long term business model group buying has now, I think it’ll tie into Places nicely in the future.  I’d gladly stop off at a different exit to get a great deal on gas or food.  The targeting here would be incredible.  Impulse buys?
  • Google Contacts: soon enough every state will ban morons talking on their cell phones.  It’s awful.  That can all be solved via intelligent voice activated apps.  We’re not there yet, but we will be soon enough where you can easily have a conversation through text messages, using your vocal cords.
  • Google Music: At the risk of sounding like a spice girl, storing songs on a device is so 2003.
  • Google Adwords.  Most importantly this is good for their bottom line.  The major piece of magic in Adwords in targeting.  Google will get access to boat loads of incredible targeting data, all focused around location.  I drive down Route 495 in Massachusetts once a month or so, I could be easily convinced to stop at any restaurant instead of MacDonalds or any gas station (I currently just go to whatever is more convenient, either price or location) if there was a deal or a promotion going on.

Through RFID from the Android phone which is likely in your pocket upon entering a vehicle, the car could know whether to import your preferences or your wife’s.

Prediction: Android for car dashboards will be announced by 2015.

Posted in Uncategorized | Leave a comment

Gamer Changer for productivity: Vimium

Vimium is a browser extension for Chrome.  It takes about 40 Vim commands and makes the available to use in Chrome.  Great for speeding up browsing around.

Install it here: https://chrome.google.com/webstore/detail/dbepggeogbaibhgnhhndojpepiihcmeb

To see a list of available commands: http://vimium.github.com/

Posted in Uncategorized | Leave a comment

Prediction: Keys as we know them will be gone by 2018

I carry a wallet, a set of 4 keys, and an Android phone.  I believe we can eliminate 2 out of 3 of those things by 2018.  We will only need to carry around a smart phone with NFC.  Simply tap your phone on your door lock and poof, it opens.  Only your phone (or phones you assign) have access.  Apartment building managers – how many keys have you had to get made up in the last year?  NFC solves this problem be removing keys and making it all digital (lower costs over time).

NFC stands for Near Field Communication.  It’s a standard being very quickly adopted and will likely be adopted by at least 150 million people in the USA by 2014.  It’s a technology that uses radio communication at a very short distance (typically only a few centimeters) to pass data between two NFC enabled devices.  One device being your phone (the only item that is constantly with you) and the other is a lock.  The practical applications for this is for cars, homes, master locks, etc.  Instead of coming home and fumbling through your keys and unlocking a door, you simply whip out your smart phone and touch it to your door lock.  Your door lock will have an NFC “chip” in it only responds when your phone hits it.  The “chip” doesn’t even need power, although my mind immediately races to having the door lock connected to the internet so it can be controlled from anywhere.

I rarely use cash anymore, so I’ll be replacing my wallet with Google Wallet or some equivalent in a few years.  We need to wait until NFC is widely adopted to completely get rid of credit cards, license, etc.  Since your keys are used between you and a stationary object, mass adoption isn’t required.  The items in your wallet are typically out facing and require others to get their act together.

What I’d love more than anything is for startups to get involved in pushing this movement forward.  Google is a HUGE supporter of NFC right now and will likely be buying companies by the hour that focus on integrating the real world with technology in innovative ways.

Further Info:

Posted in Uncategorized | Leave a comment

Get started with a server on Amazon

Amazon, long thought of as purely a book seller has been expanding rapidly into the cloud computing space.  Amazon hosts about two dozen services including EC2, which is their on-demand server offering what in my opinion blows away anything I’ve seen to date.  I’m a huge fan so far.  I’ll do a full walk through post at some point.  Big thanks to Jared Stenquist for porting me over.  We’ve used Soft Layer and Linode for awhile now.  I like both services and don’t have anything bad to say.

For people who may have done a little coding before or have put together some websites, an obvious next step is to learn a bit about servers and how to manage them.  GoDaddys shared hosting doesn’t count, I mean that you actually have root access and set up the server yourself.

The easiest way to get started is to set up a little server “in the cloud” using EC2.  Read more about EC2 here: http://aws.amazon.com/ec2/.  Lots of providers charge you $70 a month to have a machine that can barely run a basic site.  With Amazon you pay by the hour.  This means you can practice setting up a machine 100 times and you only pay for when you are using it.  If you only have time on the weekends, you just kill your instance during the week and then start a new up up each weekend while you learn.  My suggestion would be to hack until you figure it out the first time, it might take a full day or a few days if you’ve never set up a linux box before, then kill the server, terminate it.  Restart the process and do it again until you feel comfortable and learned your way around it well.

I believe the easiest way is to get a linux image (I like Ubuntu 10.04) up and running, then install Webmin and then install Virtualmin.  At this point you’ll be able to log into your server through a browser and do basic management tasks.  Once you learn through there you can begin going on the command line more and learning all the behind-the-scenes commands.

Some helpful links:

If you haven’t done much coding before but would like to start, try starting here: http://www.miklavic.com/blog/2011/11/learn-how-to-code/

 

Posted in Uncategorized | Leave a comment

Moving to the new Facebook OAuth 2.0 authentication

My love/hate with the Facebook platform continues.  Yesterday, Facebook shut off the old way of authenticating apps, they changed the parameters and now force OAuth 2.0 on you as an app developer. After getting over my rage that our live site was broken (traffic is in the tens of thousands of hits a day) I realized that we should have kept better tabs on their timeline.  No worries Facebook, we’re back on good terms.

We have about 4,000 lines of PHP that dealt Facebook auth and the graph API. At first nothing worked correctly but it boiled down to a simple authentication problem. I ended up writing an interface between the new auth stuff (with OAuth 2.0) and our existing code. It took a little hacking to get the cookie we save for the session back to the way it was but we just launched it and everything appears to be working just fine so far.

Here is the new flow:

1.) Produce a url:

$dialog_url  = "http://www.facebook.com/dialog/oauth?";
$dialog_url .= "client_id=" . $this->facebook->getAppId();
$dialog_url .= "&redirect_uri=" . urlencode(base_url()."home/fb_callback/");
$dialog_url .= "&state=" . $state;
$dialog_url .= "&scope=email,offline_access";

return $dialog_url;

2.) Put some sort of ‘Facebook Connect’ or ‘Login with Facebook’ button on your site and link it to the above url you just created.  This will take the user to Facebook to authorize with them and will spit you back to the “redirect_uri” you gave them.

3.) Listen for a response that has two parameters:  ’state’ and ‘code’.  ’state’ ensures that no one can pull any cross domain trickery and ‘code’ is what you’ll need to request the auth token.

4.) Now that you have ‘code’, you pass code to Facebook along with some other parameters and they send you back an ‘access_token’ to the url that you specify.

5.) Hopefully all is well at this point and you have a valid ‘access_token’.

6.) Use this ‘access_token’ as a way to make calls on behalf of the user.

$graph_url = "https://graph.facebook.com/me?access_token=" . $access_token;

7.) We then store the ‘access_token’ in the database and proceed to use our own authentication from here on in. Anytime we want to request data from the user, we pull the ‘access_token’ from the database and make the call.

Our way of migrating from the old Facebook auth to OAuth 2.0:

  1. First read: http://developers.facebook.com/docs/authentication/
  2. We then separated out Facebook sessions and our own sites sessions.  Once we have the Facebook auth token, we basically switch over to our own authentication because even though you have a session with Facebook, our system doesn’t want to rely on it.  We took this opportunity to draw a hard line in the sand.
  3. Then we switched from using a purely JavaScript based with FBML to using a structure that put more responsibility onto PHP.  PHP creates the urls and it’s basically a redirecting and capturing urls game.  We deal with some level of scale, not millions of users, but almost 200k at the time of this writing.  We get a good amount of user feedback and the old Facebook auth would have problems from time to time but it was tricky to get solid enough feedback from the users about what exactly went wrong.  I like OAuth 2.0 because it’s a url redirecting game and therefore we can get our error logging working nicely to detect problems right away.

I just spent all day wiring up a new solution and then writing about it, if anybody has questions, don’t hesitate I’m happy to help

Posted in Uncategorized | Leave a comment

Learn how to code

1.) Start here: http://www.codecademy.com/#!/exercise/0.  It’s the basics.  See if it interests you.  It’s a process that’ll take a while, so it’s key to see if it interests you right away.
2.) Download Notepad++ if you are on Windows:  http://notepad-plus-plus.org/.  This is the editor that you’ll be typing code into.  There are 100 others, this is a great one to start with.
3.) Learn HTML and CSS. Get this: Beginning Web Programming with HTML, XHTML, and CSS. You’ll be able to build basic websites at this point.  You can get hired to build a basic business website.
4.) Learn a server side language.  I suggest PHP.  Buy this: Beginning PHP and MySQL: From Novice to Professional.  There is also .NET, python, ruby on rails and a few others, learn those if you’d like.  My resources are in PHP, so I suggest people learn PHP so they can use me as a resource.  At this stage, you’ll need to set up an apache server, if you’re on windows, try this: http://www.wampserver.com/en/.  If you’re on Ubuntu, I will bet you already know how to set up your own server.  You’ll likely run into questions at this phase, it’s the trickiest when stating.
5.) Now you have to build things.  Anything.  Pick a site and try and replicate it if you don’t have any ideas.  My first full scale php site was a beach database where people could rate beaches and look at nice photos of them. It wasn’t the coolest site in the world but it I learned a hell of a lot.
Ask me any questions you have, seriously, any.  I learned the hard way and didn’t have anybody to bounce questions off of. My goal is to help people learn.  Buy those books, yes they cost a few dollars, the return on your investment will be ridiculous.
Coding is crazy right now, every single company in Boston that I know of is looking for developers.  If you’re learning while at school, do part time coding for companies, don’t work at the dinning commons or at the gym, . You’ll make 5 times the money and come out with a skill that will get you hired with no trouble OR you’ll be ready to start hacking on your own projects as well.

Posted in Uncategorized | 1 Comment

Focus your startup with external tools

Don’t build in-house tools that aren’t core to your business. Focus on your core.

It’s easy to want to build everything yourself. It’s hard to train your mind to build your startup in a modular, lean way. Leverage the hard work of others and focus on your niche, your little problem that you solve in a unique way better than everybody else. Reinventing the wheel takes away very limited resources from your core focus.

An example: We first built a half-assed CRM for our startup that sold local restaurants. When I told one of my software advisors this, I thought he was going to physically hit me. “There are 14 million people that make sales-based CRMs at every price point you could imagine. What’s your unique spin on it?”  I didn’t have an answer, there was nothing unique about it, we had wasted our time.

The initial thought was “it’ll only take a few days, maybe a week at most.”  Problem there is several fold: your developer could have spent that time doing something else, now you have new database tables to maintain, the code base is now larger/less focused and now you have another whole feature or product to maintain.  The last part is the most important point: you think the sales guys just used the product that we made initially?  Nope.  100 feature requests later we’re finally “done.”  That took 3 more weeks.  It’s easy to want to build new things and have entrepreneurial A.D.D., it’s much harder to take the Steve Jobs approach and STAY FOCUSED.

Some Math:

  • 50 hours to initially develop + ( 10hrs/week * 3 weeks after launch) = 80 hours.
  • $20/hr for developers (it’s a startup after all)
  • $1,600 spent on an in house tool
  • We could have EASILY outsourced this for $20/month, meaning it would take about 7 years to spend our initial investment

Some tools you can use instead of building:

We’ve used and paid for 20+ web apps now that have allowed us to push off headaches. Here are some of my favorites…


Kontagent is a user analytics platform for the social web. It was originally built for Facebook games and has since pushed outside into web apps. It provides user level data on retention, revenue, acquisition and viral sharing components of your game or app. When we first started building social tools, we were basically shooting in the dark without Kontagent and have now come to rely on it for everyday business decisions.

 

Do not, I repeat, do not manage your own email server unless it’s core to your business. Did those emails actually go out? What was the open rate on the emails when users did xyz? Emails, especially in social applications are an extremely large driver of retention.  Postmark is a service for outsourcing your transactional emails. They have the simplest of APIs and handle everything for you for basically nothing. It pays for itself after the first time your server admin inevitably screws up your email server “in house” (nothing is really in-house anymore thanks to Amazon, Linode and others).

 

Setting up A/B testing for splash pages is a pain in the ass. It’s not hard to code, just a pain to do and thus never gets done. We ran the first two years of our first startup without landing page optimization testing.  Dumb move I agree, however in any startup there are 9 million other things to do and A/B testing sometimes takes a back seat.  It shouldn’t have.  Google Website Optimizer was a 1 day install for us. It took the graphic guys 5 hours and me on the coding end about 4 hours start to finish. We raised our conversion rate of our splash page by 10% over the two weeks after we pushed this live. 10% in our business equates to thousands of dollars, and we’re relatively small (20 full timers as of October 2011).

Those are a few, there are plenty more.  Once you have gotten off the ground, raised a little money, or better yet made some money, then it’s OK to start experimenting. Entrepreneurs learn a ton from screwing things up, we’ve noticed tons of niches we might be better suited for just by screwing so many things up over the years. I still advocate for focus at first, down the road there are a lot of opportunities that emerge when you’re out there hacking around all the time.

Focus on your core.

Posted in Uncategorized | Leave a comment

Cannon Mountain Summit

Takes about 2.5 hours up, sharp incline, great workout.  Highly recommend.

Posted in Uncategorized | Leave a comment