Ajax を使って友達リストを取得し、Template を使ってその内容を表示する例です。

people-friends.templates.xml

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="Fetching a group of people"
  description="This example is fetching a group of people using jQuery.ajax method."
>
<Require feature="dynamic-height"/>
<Require feature="opensocial-0.8"/>
</ModulePrefs>
<Content type="html" view="canvas"><![CDATA[
<style type="text/css">
<!--
#wrapper {
  font-size: .8em;
  margin: 10px;
}
div.person, div.pager {
  margin: 5px 0;
}
div.person img {
  vertical-align: middle;
  margin: 0 5px 0 0;
}
-->
</style>
<div id="wrapper" style="display:none;">
<div repeat="${people}" class="person">
<img alt="${Cur.displayName}" src="${Cur.thumbnailUrl}" width="30" height="30">
<a title="${Cur.displayName}" href="${Cur.profileUrl || '#'}" target="_top">${Cur.displayName}</a>
</div>
<div if="${people.length > 0}" class="pager">
Showing friends from ${people.startIndex + 1} to ${people.startIndex + people.length } of ${people.totalResults}
</div>
<div if="${people.length == 0}" class="pager">There's no friend yet.</div>
</div>
<script type="text/javascript" src="opensocial-jquery.min.js"></script>
<script type="text/javascript" src="opensocial-jquery.templates.min.js"></script>
<script type="text/javascript">
jQuery(function($) {

  var url = '/people/@owner/@friends';
  var data = { fields: 'profileUrl' };

  $.getData(url, data, function(data) {
    $('#wrapper').render({ people: data }).show();
    $(window).adjustHeight();
  });

});
</script>
]]></Content>
</Module>