Posts Tagged ‘google’

Panoramio Launches Look Around

Tuesday, June 3rd, 2008

Panoramio Logo Panoramio beat Microsoft to the punch. Techcrunch has an article on the software so I won’t steam their thunder. Executive version; they’ve launched a new featured called “Look Around” which gives users the ability to scan through popular locations and see the area from different angles etc. Does this sound like Photosynth? That’s because it’s the same idea. This example from the top of the Empire State Building in NY is really cool. It’s way cool because it works now - and it works on a Mac.

OpenSocial Could Learn Some Things From Facebook’s Platform

Thursday, May 29th, 2008

OpenSocial, a group effort to create a widget platform spear headed by Google, has a few glitches that I’d love to see fixed. They are largely comparison items from Facebook, who has recently announced that it will open source it’s own platform. Regardless of the motivation, there are a couple of items I’d like to see ported from Facebook to OpenSocial.

  1. Support for FBML like syntax: “Hold on a second! Standard HTML is the benefit of OpenSocial over Facebook” folks are probably thinking. While that’s true, without an effective way to capture and store user information for more than 24 hours (pesky terms of service documentation) developers are left querying for friends pictures etc over and over and over again. While this isn’t inherently a problem, if you wanted to display a 1,000 profile pictures for some unknown reason, you need to call the API a large number of times. Then generate the HTML and pass it to the client. This makes applications painfully slow. It’s great to store the numeric id (12345678) and be able to pass it back to the pre-client for parsing. The best examples are and . These really are very handy.
  2. Support for FQL like syntax: OpenSocial does a great job of providing methods for gathering most of the information you would want from the social graph, but it’s lacking in the ability to remix the data in new and interesting ways (easily). OpenSocial requires all of the heavy lifting to be done on the client (or the application backend if their API allows it). Most clients have a reasonable limit as to how big data structures can effectively be and have the application still function. Processing on the applications infrastructure negates another advantage of OpenSocial which is requiring very little in the way of hardware to operate.

There are also some learnings here for Facebook. I’d like to see a few OpenSocial conventions ported from OpenSocial to Facebook.

  1. OAuth Signature: To be fair, Facebook does provide signed requests, but it would be great if they’d use a standards based signature instead of their own homegrown version.
  2. External JavaScript Libraries: Facebook’s FBJS is powerful and provides most functionality that developers need. It’s even been open sourced so it can be used outside of the Facebook universe. However, developers who’ve been working with jQuery, ProtoType or any of the other numerous javascript libraries have to start at the beginning again. Additionally, they may be missing the functionality in the FBJS library that they need.

Both platforms still have a ways to go in terms of making developers life’s easier and users application experiences more robust. I think it’s great news that Facebook is opening their platform more. It’s really more symbolic than anything, because they still ultimately control what they do or do not implement on their platform. Bebo is the only other social network using Facebook’s model and it still requires some re-writing for developers because of syntax difference and lack of some features.

Getting Accurate Metrics in WordPress

Thursday, May 22nd, 2008

WordPress + Google Analytics Google Analytics does a great job keeping track of visitors, sessions, geographic locations and with the addition of the Benchmarking feature, even compares your traffic to other blogs of similar size and topic. However, there’s a problem. It counts you too! If your using a fancy plug-in to manage your Google Analytics account, you won’t need this. I, however, have been tweaking and tuning my template over time and have my it all stuffed right in header. Today I made a minor tweak to my WordPress template it to suppress my views when I’m logged in and updated to the new tracking code from the old Urchin based code. This snippet is from my ./wp-content/templates/header.php file.

<?php if($user_ID != 1){ ?>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-123456-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>
<?php } ?>

Be sure to add the id (or id’s) you want to suppress and to put the correct Google Analytics account information (the UA-123456-1 bit) in your code.
Happy tracking ;)

Tagging Done Right

Tuesday, May 20th, 2008

Google Image Labeler Logo It’s not for everyone, but the Google Image Labeler is the best tagging application I’ve ever seen. It does a great job of filtering out spam by matching you with another human being to concurrently tag items. This avoids any sort of oddities with linguistic issues such as car vs. auto because both people have to use the same lexicon. This is crowd sourcing at it’s best.

A similar system could be implemented using caching to hold submissions for sites with significantly lower traffic than Google (that’s pretty much all sites right?) Once an image is tagged by 2-3 individuals, it could be “accepted.” Determining who’s who of course becomes the challenge, but a mixture of IP, user names, session information or any other number of “fingerprint” type technologies could help narrow it down to a reasonably accurate representation. Additionally, you could expire words after a predetermined time. Additionally, the concerns of spam may be trivial since 20 character tags are hardly helpful for spammers promoting products. Of course Google’s method avoids all caching all together by only letting live posts associate with the image.

Google Image Labeler Screenshot

The other thing Google does is make tagging a game. While this is hardly sufficient to help people get motivated to actually use the application for long periods of time, it’s a good effort and it can be addictive. Points are awarded to folks as the complete matches, giving them little actual value beyond seeing their names on a Google top 5 leader board (if they make the cut).

Who’s Data Is It Anyway?

Friday, May 16th, 2008

DataPortability Logo Data portability has been a hot topic as of late. What I think everyone has neglected to consider is who owns which bits of data. For example, my email address is mine. I choose to give it out to friends, family, associates that I want to be able to contact me. That doesn’t, however, mean that it’s also theirs to use how they see fit.

For example, if you’re my friend and you wish to download your social graph to port it to Hi5, Ning or somewhere else, you should be able to do that. However, that doesn’t mean you can take my email, phone, physical address etc with you. What needs to be preserved is our association, not my data. This could be achieved by a public identity such as OpenId and a UUID value tied to each user - ideally the solution would be easier to create so even my mother could do it. Conversely, your data should be able to be ported to the new network without interference from Facebook, MySpace or anyone else.

What makes this discussion difficult is shared property. Consider a tagged photo on Facebook for a minute. I’ve taken the photo which includes you. To make it more complicated, let’s say you tag yourself in the photo. I still own the photograph, it’s even protected under US Copyright law should I choose to exert my rights. But you’re in it - and you want to use it as a profile picture… what to do? This type of shared relationship requires permission in my opinion. Since we’re friends, you know if I’m likely to grant you permission or not when you ask. This process could easily be automated. This could even be automated to the less vague bits of information such as contact information (email, phone, address etc).

Presenting Data Visually

Thursday, April 24th, 2008

Anyone who’s immersed in the world of data and its presentation knows the value of a well designed and laid out graphic can lead to a project. Currently application developers have two primary tools at their disposal, Adobe Flex and the Google Chart API for making dynamic graphics. Silverlight may offer some similar features, but I’ve no experience building with it. Additionally, Java is also very capable, but when you see how simple the Google product is, you’d need a very strong reason to consider running anything like this in house again. As such I have left them out of the discussion.

I’ve used Flex for some simple reporting graphs. The real power in Flex lays in it’s ability to create entire interfaces, even entire websites entirely in a rich multimedia capable environment. I’ve been intoxicated with the raw power to manipulate the data in real time and interact in a way not easily possible on the web before. However, all of this power comes at a steep price, while the core SDK is free - for time pressed developers - the IDE environment saves a huge amount of effort. Because of it’s great power, sometimes using Flex is a little like bringing a machete to the dinner table - a little bit more power than you really need to cut the vegetables with. This is where Google Charts comes in.

Group Male Female
0 52 38
1 48 34
2 61 40
3 77 63
4 79 89
5 120 102
6 138 125
7 125 154
8 172 155
9 156 173
10 193 193
11 217 189
12 291 293
13 300 345
14 292 321
15 297 333
16 321 348
17 365 366
18 364 337
19 327 306
20 243 248
21 161 179
22 122 110
23 74 68

Way back when in December of 2007, Google anounced the Google Chart API. This revolutionized graphing for developers, although I suspect many may not realize it yet! Lets start our exploration with some fake data and see just what we can do with the API. We’ll use a small slice of some new user signup data I have at my disposal to get our hands dirty with.

Generating this table is no special feat, some simple database queries against your own internal data and presto, you’ve got a column of numbers too. But that’s where the fun begins. Consider this table for a minute, it’s pretty clear there’s a normal distribution curve there, but are they the same? Are there more men or women - or is it nearly equal? Are there other things this data could be telling us?

Let’s start with the marketing department’s questions. Are we attracting more men or women? If we sum the numbers in the table together, we get 4,595 men and 4,609 women. We can create a pie chart with these numbers so folks can look at a glance and see what that would look like.

Google Chart API demo

http://chart.apis.google.com/chart?
cht=p&
chs=250x100&
chd=t:4595,4609&
chl=Male|Female&
chco=0000ff,ff0000

The line break is for clarity only. To walk through the pieces, the cht is simply the chart type, p for pie (p3 is a 3d pie), chs is a width x height value, chd is the data, chl are the labels and chco are the colors. Interestingly, you can actually skip the labels on and still generate a graph, but obviously it becomes much clearer when you provide the labels.

Now lets look at the curves - obviously we have a peak during the day and lows at night, but just what does that look like and is it the same for men and women? Here we can use the bar chart.

http://chart.apis.google.com/chart?
cht=bvg&
chs=630x150&
chbh=10,0,5&
chco=0000ff,ff0000&
chg=101,33.3&
chxt=x,y&
chxl=0:|12a|1a|2a|3a|4a|5a|6a|7a|8a|9a|10a|11a|12p|1p|2p|3p|4p|5p|6p|7p|8p|9p|10p|11p|1:|0|125|250|375&
chd=t:13.9,12.8,16.3,20.5,21.1,32.0,36.8,33.3,45.9,41.6,51.5,57.9,77.6,80.0,77.9,79.2,85.6,97.3,97.1,87.2,64.8,42.9,32.5,19.7|10.1,9.1,10.7,16.8,23.7,27.2,33.3,41.1,41.3,46.1,51.5,50.4,78.1,92.0,85.6,88.8,92.8,97.6,89.9,81.6,66.1,47.7,29.3,18.1&

Now with this chart, there’s quite a bit more going on. Google recommends that for larger data sets you use their special encoding system, but in order to keep this simple I went ahead and used the decimal encoding so it would be easier to understand. For those who are ready for that next step, take a look at the docs for the API, there’s excellent pseudo code there for how to transition to the encoding method they use. cht still defines the chart type, in this case a horizontal bar chart with grouped data. chs is the size again; read the docs carefully if you decide to implement one of these. The bar chart can extend past your chosen size and you’ll simply crop your data. chbh comes in handy here by letting me shrink the size of the bars to 10 pixels and removing lots of padding. Last but not least chco sets the colors bringing us to the really new stuff.

For bar charts the data has to be limited into a range of 0-100. If your maximum data point is less than 100, you’re in luck, just feed the data in place of this method below. However, if your data doesn’t live in the realm of 0-100, you’ll need to consider doing some more work. The simplest method is to create a percentage (some PHP code is below outlining how to do that). The X and Y axis are blank by default with a bar graph. There are a number of methods for making them display but I find this method the most logical. If your data is broken out by percentages already, using the default Y axis value is fine, however, in our example, it’s not. So we’re going to pass two parameters. First chxt=x,y, what this does is tells the API that the first label set I pass in is for the X axis, and the second is for the Y. Now we can pass in the values we want to display on the X and Y axis. chxl defines our labels using position indexes to reference back to the values we had assigned in our chxt parameter. In our example, index 0 is X and index 1 is Y - notice they’re bolded: chxl=0:|label1|label2||labeln|1:|label1|label2| … and so on. The last parameter I skipped over from before is chg which sets up the grid based on a percentage. I passed in 101% spacing for the vertical bars along the X axis, and 33.3% for the horizontal bars because they lined up with my increments.

For those unsure how to generate the percentages in PHP, it’s very simple. The first thing we’ll do is loop over our dataset to determine what our largest value is. Then, instead of passing in the raw values as we did with the pie chart above, we’ll actually pass in their percentage of the maximum number. If your like me, you might want to step the scale up to the next logical number. I did that on my graph, but did not do it in the code below - I’ll save that for another blog post. Then you can at last loop over the data one more time to create the actual data strings. Once it’s all done, you’ll have a single string you can drop into your image call.

$result = $conn->query($select);

// get the maximum value in our data
$max = 0;
while($row = $result->fetch_assoc()){
   if($row['Male'] > $max){ $max = $row['Male']; }
   if($row['Female'] > $max){ $max = $row['Female']; }
}
$result->data_seek(0);

// generate the two datasets
$data_male = "";
$data_female = "";
while($row = $result->fetch_assoc()){
   if(strlen($data_male) == 0){ $data_male .= ","; $data_female .= ","; }
   $data_male .= round($row['Male']/$max,1);
   $data_female .= round($row['Female']/$max,1);
}

// Concatenate the strings to complete the data parameter
$data = $data_male . "|" . $data_female;

There are so many different graph types available, I obviously can’t share them all in this already rather long post. I highly encourage you to read over the API. It’s very simple to understand and extremely easy to use. Google only requests that if you’ll use more than 250,000 graphs a day, you let them know.

Great New Google Docs Feature

Wednesday, April 2nd, 2008

Google Docs Logo Companies spend a lot of money collecting data and shoving it into a database. Small businesses and organizations just got a serious leg up with the latest round of revisions from Google Docs. Now companies can put together quick surveys which they can then collect and parse the results of using Spreadsheets all online. The best part, you can always save a local copy and generate all the statistical analysis information you want using your statistical package of choice on your desktop. This is a huge leap forward (and a huge hit for small development shops looking to make a quick buck on a simple survey form).

~10 Days to Receive Spam

Monday, March 31st, 2008

Original Can of Spam The blog has been picked up by spammers. We are now receiving daily spam comments. This would be inconsequential, however, until only a few days ago I had a site map that did not include the blog entries thus preventing it from being indexed by Google. I removed that map around the 19th and so Google has since indexed the blog pages. I believe spammers are using Google (and possibly other search engines) to locate sites running WordPress and other blogging software and adding them to their bots in hopes the blogs are unmoderated. I know nothing earth shattering here, but curious that until I was indexed by Google’s search engine - not a single spam comment. I noticed a similar effect on my personal blog when I removed the registration requirement (still moderated) for posts.

Comparative Website Metrics An Open Market

Tuesday, March 11th, 2008

People CounterCompete, one of my favorite website metric tools, shows an interesting trend between three bloggers, two of whom I have met (Rodney Rumford and Nick O’Neill) and have a great deal of respect for. But neither the merits of these individuals or their websites, is the point of this discussion. What concerns me is the lack of quality metrics for this type of comparison. Google Analytics may have the best approach to solving this problem yet. With their new data sharing options, it will be possible for website owners to more accurately track their performance against other websites, including their perceived competitors (assuming they’re running Google Analytics too).

Alexa also offers online metrics and shows some similar trends but neither get the whole picture because the technology used to capture the data is browser based - ie, you install a plugin/toolbar and away you go. This doesn’t accurately capture many devices, including the quickly growing mobile device market, game consoles and non-plugable browsers (Safari anyone?).

Alexa graph showing traffic of three blogs

Google’s AdSense tool has some drawbacks as well because JavaScript is device dependent - but over time that will become less of an issue as devices become more and more robust. Full integration of plugin enabled browsers on the phones seems much MUCH further away.

Michael Arrington pointed out on TechCrunch, that a share “With Everyone” option was needed. While we can certainly create accounts that have read access to our data and publish that information on our sites - it might be nice to get a 30,000 foot view of multiple sites without needing to authenticate to each and compare the numbers manually. I suggest a full Compete / Alexa type interface allowing users to explore not only a single site, but trends within a vertical, industry or even across industries is where the real data is.

Does the slow and steady decline of these three sites over the last few months indicate burn out on Facebook or is their user audience switching to MySpace centric blogs and news sources? I want to know and quite frankly, I don’t have a good way to find out.

© 1998-2008 AF-Design, All rights reserved.