IBM-Connect-2016

IBM Connect 2016 - Day1 基調講演

基調講演 (Open General Session)

今年の基調講演はなぜかPart1とPart2に分かれて行われました。

8時AMからの基調講演が始まる前のスクリーンにはIBM Championの紹介が行われており、日本からもチャンピオンの顔写真とともにでかでかとスクリーンに紹介がされていました。

ktrick-ibm-connect2016-ogs

基調講演 Part 1ではゲストスピーカーのHost of National Geographic’s Brain GamesのJason Silvaさんがテクノロジーの進化を人類の進化になぞって独自の視点で語っていました。

IBM Connectの基調講演はそれ自体が映画のような見ごたえのあるエンターテイメントになっていて、参加するといつも、なにか新しいことにチャレンジする精神を呼び起こされます。

 

Part2ではIBMプロダクトのデモが全般にわたって行われ、IBM Verseの新機能がまず紹介されました。

 

rsz_img_4304

例年通り、General ManagerのJeff氏による紹介で始まりました。

rsz_img_4314

IBM Connect 2015から断片的に紹介されていたカードスタイルのUIがより具体的に紹介されました。

IBM Connec 2016 OGS

IBM Verseの進化としてメール本文にもAnalyticsの技術が使わるデモが紹介されました。

 

IMG_4316

IBM Verseのカレンダーも一新されてます。今まではiNotesのWebカレンダーと変わらない見た目で間に合わせで作ったようなUIになっていましたがようやくIBM Verseっぽい進化を遂げてくれたみたいです。

 

IMG_4318

目玉になる新機能の部分がハイライトで強調されています

Extensibility: 開発者によってIBM Verseに手を加えることが出来るようになります。

Homepage; カードスタイルで一新されます。

Calendar; Verse用UIが大幅に強化されるようです。

Verse Offline: アクションメニューからオフライン設定に切り替えて使用するデモが紹介されました。


rez_ogs

モバイルアプリの機能が強化され、Connections CloudやMeetingとの連携がよりシームレスに行われるようになっていました。

 

rez_ogs2

モバイルアプリにもAnalyticsの機能が組み込まれるデモがありました。

 

IMG_4322タブレットでConnections Cloudのファイル共有やアクティビティーストリームを使いPCユーザーとも円滑に業務を進めていくデモが紹介されました。


IMG_4324

Personal Assistant: Analyticsの機能によりまるで個人のアシスタントがそばにいるような感覚でツールを使えるようになる、という意味であると理解しました。

 

IMG_4325

IBM Connections Cloud とSalesforceの連携を行っているデモがありました。前日のBP SummitでAppFusionsの開発者によるデモが行われましたが、おそらくこのデモではAppFusionsのAPI連携の機能が裏で動いていると考えて間違いないと思います。 その時のデモでは、Connections Cloud 上にSalesforceのIssue 一覧を表示させ、Salesforceに遷移後にFieldを変更するとその変更内容がConnections CloudのアクティビティーストリームにEmbedded Experienceと共に更新される、というデモでした。

IMG_4326

カードタイプUIによるConnections Cloudのコンテンツを表示する一例がデモされました。例えばこの画面右側に表示されているものがConnections Cloudのアクティビティーストリームに相当するようです。

その他、コンテンツマネージメントシステムとConnections Cloudのファイル共有、アクティビティーストリームがシームレスに行われるデモなどが行われました。

 

TOSCANA Projecと呼ばれる新しいプロジェクト

デモの後半ではToscana Projectと呼ばれる新しいプロジェクトの紹介がありました。 以前にもIBMではProject Vulcanというコードネームで進められるプロジェクトがIBM Connect(Lotusphere)で紹介されたことがありました。その後、Project VulcanはIBM Verseへと製品名を変えProject Vulcanのコンセプトや機能はIBM Verseへと引き継がれた、という流れになりました。

Toscana Projectというコードネームの製品はメッセージングのソリューションであるようです。(LINEのような?) 今回のデモではアウトドアアイテムを製造、販売する会社を例にとって紹介が行われました。

メッセージをやり取りするなかでConnections Cloud Fileを使ったり、Docsを使ったりして業務を進めていくデモが行われました。


ケートリック関東オフィス

ケートリック 関東オフィスが移転致しました。

2016年2月2日(火)より、弊社関東オフィスが以下の住所に移転致しました。

〒141-0021 東京都品川区上大崎2-15-19 MG目黒駅前 512

ビジネスの拡大にむけて

XPAGES開発パートナーである(株)ライブネスと同じオフィスになり、よりビジネスの連携と開発スピードを強化していくことになると期待しています。
最寄り駅は目黒駅になります。お近くにお越しの際は是非お立ち寄りください。
ケートリック関東オフィスケートリック関東オフィス


IBM-Connect-2016

IBM Connect 2016の濃い一週間が始まります。

今年も開催地はフロリダ オーランド、でもホテルが違う

毎年この時期に開催されるIBMビジネスカンファレンス「IBM Connect 2016」に今年も参加するためトータル17時間のフライトを経てアメリカ、フロリダ州 オーランドへやってきました。

自分は参加者として訪れるのは去年に続き2年目になります。 2006年から2013年までの7年間はIBM ConnectがLotusphereと呼ばれていたころから、実はカンファレンスの運営側の人間としてIBMベンダーとして働いていましたので合わせると9回目の参加ということになります。

そしてずっとIBM Connectが行われてきた会場が今年からDolphin Swan HotelからHilton Orlandoへと変更になりました。

ibm-connect-2016-hilton-orlando

敷地の大きさは今までのDolphin Swanよりも小さく感じますが、ホテルのランクとしてはHilton Orlandoのほうが少し上なのかな、と思います。(なんとなくですが・・・)

ビジネスパートナー向けセッションが1日、IBM Connectが3日

1月31日のイベントが正式に始まる前の日を使ってビジネスパートナー向けのセッションが1日用意されています。

そしてIBM Connect 2016自体は2月1日の基調講演(Open General Session)を皮切りに怒涛の如く3日間セッションが行われます。

注目のセッション

毎年、基調講演ではIBMの今年一年の方向性を示し様々な新しい発表が行われるため、今年はどのようなものが発表されるか楽しみです。

また、今年のセッションは開発者向けのセッションが多数用意されているように思います。

個人的にはIBM Verse APIやIBM Connections Cloud APIのなにか新しい情報が公開されるのではないかと期待しています。また近年勢いのあるnode.jsとDomino開発者を対象にしたセッションが行われたり、他のシステム、プラットフォームとの連携を加速させるセッションも多数用意されているため、新しいスキルやアイデアを習得する機会になることを期待しています。

参加予定のセッション

以下、自分が組んでみたセッションアジェンダです。


日曜日(BP Summit)

Coffee/Refreshments for IBM Business Partner Summit
09:00 午前 - 10:00 午前 - Hilton Orlando, Florida Foyer

IBM Connect Business Partner Opening General Session
10:00 午前 - 11:30 午前 - Hilton Orlando, Florida 4
Lou Sassano (IBM), Katrina Troughton (IBM)

The Path Ahead: The Enterprise Social Software & Digital Experience Roadmap
01:00 午後 - 02:00 午後 - Hilton Orlando, Florida 4
Carol Sormilic (IBM), GARY DOLSEN (IBM)

Making Money in the Cloud!
02:15 午後 - 03:15 午後 - Hilton Orlando, Florida 5
Ted Brufke (IBM), Glenn H. Newlove (IBM)

The XPages of Things: Integrate Bluemix with Your XPages Applications for a World of Possibilities
03:45 午後 - 04:45 午後 - Hilton Orlando, Lake Mizell AB
John Jardin (Ukuvuma Solutions)

Getting Technically Cozy with IBM Connections Cloud APIs and App Dev
05:00 午後 - 06:00 午後 - Hilton Orlando, Lake Highland AB
Patrick Li (AppFusions), David Simpson (AppFusions)

Solution EXPO Grand Opening Reception
06:00 午後 - 07:30 午後 - Hilton Orlando, Solution EXPO

Welcome Reception
07:00 午後 - 08:30 午後 - Hilton Orlando, The Promenade


月曜日

Opening General Session Part I: Turn Moments into Momentum
08:00 午前 - 09:00 午前 - Hilton Orlando, Orlando Ballroom
Jeff Schick (IBM), Clive Lightfoot (RURAL AFRICAN VENTURES INVESTMENTS LTD), James Weru (http://www.trutrade.net/), Vinith Misra (IBM), Peter Cardon (Marshall School of Business), Brianna Mayer (University of Southern California), Jamie Winger (University of Arizona)

Opening General Session Part II: The Engaged Enterprise Comes to Life
10:00 午前 - 11:15 午前 - Hilton Orlando, Orlando Ballroom
Rob Enright (IBM), Sarah Gibbons (IBM), GARY DOLSEN (IBM), Jeff Schick (IBM), Chris Crummey (IBM), Christine Kraemer (Deutsche Lufthansa AG), John Henderson (Texas Children's Hospital)

What the App? : A Modernization Strategy for Your Business Applications
11:30 午前 - 12:30 午後 - Hilton Orlando, Orange G
John Head (PSC Group, LLC), Mat Newman (IBM)

IBM Verse AppDev and Extensibility
02:00 午後 - 03:00 午後 - Hilton Orlando, Florida 6-7
Yun Zhi Lin (IBM)

Optimus XPages: An Explosion of Techniques and Best Practices
03:30 午後 - 04:30 午後 - Hilton Orlando, Orange F
John Jardin (Ukuvuma Solutions)

Outside The Box: Integrating with Non-Domino Apps Using XPages and Java
04:45 午後 - 05:45 午後 - Hilton Orlando, Lake Eola A
Julian Robichaux (panagenda), Kathy Brown (PSC Group LLC)


火曜日

Design Thinking for Application Development
08:00 午前 - 09:00 午前 - Hilton Orlando, Florida 6-7
Joseph A. Russo (IBM)

IBM Domino App.Next - Broadening Your Horizons with Bluemix
09:15 午前 - 10:15 午前 - Hilton Orlando, Orange F
Pete Janzen (IBM), Martin Donnelly (IBM)

node.js for Domino Developers
10:30 午前 - 11:00 午前 - Hilton Orlando, Solution EXPO Theater
Matt White (LDC Via)

Deploying, Securing, Customizing and Extending the IBM Connections Mobile App
01:15 午後 - 02:15 午後 - Hilton Orlando, Lake Mizell AB
Rusty Godwin (IBM), Jack O'Donnell (IBM)

Carnival Sailing Safer Seas with Domino
02:30 午後 - 03:30 午後 - Hilton Orlando, Florida 5
Hunter Medney (IBM), Walter Carvalho (Carnival Corp)

Extending the XPages Extension Library
04:00 午後 - 05:00 午後 - Hilton Orlando, Orange G
Padraic Edwards (IBM), Brian Gleeson (IBM)

Break Out of the Box - Integrate Existing Domino Data with Modern Websites
05:00 午後 - 05:30 午後 - Hilton Orlando, Solution EXPO Theater
Karl-Henry Martinsson (Deep South Insurance)

Deep Dive: Building Apps with IBM Connections Cloud APIs
05:15 午後 - 06:15 午後 - Hilton Orlando, Orange G
Patrick Li (AppFusions), David Simpson (AppFusions)


水曜日

#UserBLAST 2016
08:00 午前 - 09:00 午前 - Hilton Orlando, Lake Eola B
Mat Newman (IBM)

Building Responsive Applications Using XPages
09:15 午前 - 10:15 午前 - Hilton Orlando, Orange F
Brian Gleeson (IBM)

Real-time Video Chat XPage Application Using Websocket and WebRTC Technologies
10:45 午前 - 11:45 午前 - Hilton Orlando, Orange G
Csaba Kiss (Los Alamos National Laboratory)

GURUpalooza!
12:45 午後 - 01:45 午後 - Hilton Orlando, Florida 4
Amanda Bauman (IBM), Mat Newman (IBM)

ASK the Developers and Product Managers
02:00 午後 - 03:00 午後 - Hilton Orlando, Florida 4
Heidi Ambler (IBM), Brian Chaput (IBM), Carol Sormilic (IBM), John Woods (IBM)

Closing General Session: Discover your Inner Artist
03:30 午後 - 04:30 午後 - Hilton Orlando, Orlando Ballroom
Liz Urheim (IBM)

 

時差ボケとの闘い・・・

今年も例外なく、初日の夜は早くに起きてしまいました。 そこでこのブログを朝から書き始めたのですが、書き終わるころにはすっかり夜も明けていました。

IBM Connect 2016 BP Summitの朝
IBM Connect 2016 BP Summitの朝
すっかり夜の明けたHilton Orlando ホテルより
すっかり夜の明けたHilton Orlando ホテルより

イベント開催の間は時差ボケと戦いながらセッションを受け、慣れるころには帰国というタフな日々が続きますが、現地レポートとして時間をみつけてこちらのブログを投稿していきたいと思います。


IBM Champion

IBM Champion 2016に任命されました

ibm champion

2015年11月24日にIBMよりメールが届き、自分がIBM Champion 2016に任命されたことを知りました。

今年でIBM Championとなるのは2年目となり、前年初めてIBM Championになった時の感動が思い起こされました。と同時にこれからもっとコミュニティの発展に寄与していけるようにと、改めて気が引き締まる思いです。

なお、日本から選出されたIBM Championは以下の4名です。

海老原 賢次 様 (リコーITソリューションズ株式会社)
加藤 満 様 (チームスタジオジャパン株式会社)
田付 和慶 (ケートリック株式会社)
御代 政彦 様 (株式会社エフ)

おめでとうございます! すでに皆さんがブログ等で言っていますが日本から選出された方が今年は6人から4人へ減ってしまいました。 IBM Championの選出基準がよりグローバルな視点へとシフトしたと聞いていますのでその影響は大きくあったのだと感じています。

自分は2015年、IBM Championとして初めての年を過ごしましたが、XPAGESDAYをはじめ、より積極的にスピーカーとしてセッションをさせて頂く機会がありました。

  1.  IBM XCITE 2015 Spring (05/20/2015 Day2 OGS)
  2.  XPagaesDay 2014 (11/18/2014 web session)
  3.  Tek Tek Lotus, Feb 2015 (02/25/2015 IBM ConnectEd 2015 feedback session)
  4.  Teamstudio Notes/Domino Web Seminar, April 2015 (04/22/2015 web session)
  5.  Notes Shikoku Festa 2015 (10/23/2015 XPages and IBM Verse session)

振り返ると5回のセッションを行いましたが、やはり一番大きく緊張したのはIBM XCITE 2015 Springの基調講演の数十分間でした。ただおかげ様で何か一回り大きくなる機会を頂いたのだと感じています。

2年目のIBM Championとしての抱負・・・

例年通り、IBM側でIBM Champion を選出するにあたり以下の様なことを基準にしているとあります。

  • IBM Collaboration Solutionsを広める
  • 知識と専門技術の共有
  • コニュニティへの貢献と成長の支援
  • IBM ポートフォリオ全体に範囲を拡大
  • ネガティブ、ポジティブ両方のフィードバックを建設的かつ専門的な方法で提供する

1年前、IBM Championとして日本発の情報を世界に発信することで、「日本のエンジニアもまだまだ世界に負けてませんよ!」という印象を世界に持ってもらいたい、ということを抱負として書かせていただきました。そこで行ったのが PlanetLotus.org へブログを登録し英語で情報発信を少しずつ行うということでした。 こちらの分はまだまだ不十分だったと反省点も残りますが、近いうちに英語でNotes/Dominoの技術を説明した動画配信なんてのも行いたいと考えています。

最近ではXPages on bluemixでドローンを操作するというセッションをXPagesDay2015で行ったので、それちらを英語で配信してもいいかもしれません。

2年目、引き続き”てくてくLotus”や”ノーツコンソーシアム”などをはじめコミュニティーへ貢献していきたいと考えております。 またNotes/Dominoを取り巻く環境もBluemixやXPagesの進化で様々なテクノロジーとの連携が強まり、より複雑さを増している気がします。沢山のエンジニアがNotes/Dominoを使い新しいものを生み出していけるよう、自分は新旧どちらのNotesエンジニアの視点にも立ち、少しずつ情報を発信し続けたいと思っています。

以上、2年目もどうぞよろしくお願い致します!


2015.11.18 XPagesDay 2015セッション 「XPagesとIoTでドローンを飛ばそう」

XPagesDayが今年も開催されます

2015年、今年のXPagesDayは11月17,18日にオンラインセッションが行われ、18日には、IBM箱崎で行われるNotesコンソーシアム「パートナーソリューションセミナー」に参戦する形で、昼から会場でのセッションが2つ用意されています。

Xpage on bluemixとIoT Foundationでドローンを制御!

弊社ケートリック 田付のセッションでは(株)ソルクシーズ吉田さんと共同で、Bluemix, XPages, IoTと旬のキーワードてんこ盛りにWebからジャイロ・モーションセンサー、WebGLを使いドローンを制御してみせます。
セッションで触れるテクノロジーの数々は以下の通りです。

  • XPages on Bluemix
  • IoT Foundations on Bluemix
  • JavascriptでのMQTT通信
  • Node.js
  • Node RED
  • WebGL
  • スマートフォン、タブレットのジャイロ、モーションセンサー

現在も開発中のプロジェクトですが、一部公開するとこんな感じです!
xdrone-webGL02xdrone-webGL01

お申込みは以下のリンクより「H1-3」をお選びください。
http://partner.cons20.info/portal.nsf/pages/pub

XPAGESDAY 2015 開催概要について

日時:2015年11月17日(火曜日)、2015年11月18日(水曜日)

場所:2015年11月17日オンライン、2015年11月18日はオンラインと 日本アイ・ビー・エム箱崎

スケジュール

11 月 17 日 (火)

10:30~11:30 【初心者】Notes 技術者のためのはじめての XPages 講座
13:30~14:30 【中上級】REST の総復習
15:00~16:00 【初心者】誰も教えてくれなかったXPages のデバッグ方法。どうやるの?

11 月18 日 (水)

10:30~11:30 【初心者】Bootstrapと@式で作る簡単&CoolなXPagesアプリ
13:30~14:30 【中上級】実践!XPages on Bluemix
【オフ会】
15:05~未定 第1部 XPages on Bluemix で IoT を実感!XPages でドローンを制御、モニタリング
15:05~未定 第2部 今年も!? どこよりも早い XPages 最新情報

XPagesDay 公式サイトhttp://xpagesday.com/xpagesday.nsf/home.xsp

■XPagesでドローンを飛ばす私のセッションは会場セッションになるため、こちらの申し込みフォームより「H1-3」を選択ください。
http://partner.cons20.info/portal.nsf/pages/pub


ノーツコンソーシアム九州地区研究会にてXPagesのセッションを行います

ノーツコンソーシアム九州地区研究会にてセッションを行います

2015年11月11日、ノーツコンソーシアム九州地区研究会にて代表 田付和慶がXPagesによるWEB化の際に役立つTIPSの数々をご紹介します。

【 開催概要について 】

日時:2015年11月11日(水曜日)13:00-15:00

場所:日本アイ・ビー・エム福岡事業所

【詳細について】

ノーツコンソーシアム イベントページhttp://member.notescons.gr.jp/studygroup/3450/


ノーツ・しこく・フェスタ 2015にて講演致します

nsf

ノーツ・しこく・フェスタ 2015のご案内

毎年恒例の「ノーツ・しこく・フェスタ 2015」が、2015年10月23日(金)に開催されます。 今年度のテーマは『メール革命!』です。

今年はケートリックもXPages開発事例とIBM Verse活用事例についてお話しさせて頂きます。

【 開催概要について 】

日時:2015年10月23日(金曜日)10時30分~18時

場所:サンポート高松 高松シンボルタワー4階 情報通信交流館 e-とぴあ・かがわ

入場料:無料(事前登録制)

【詳細及びご登録について】

オフィシャルサイトhttp://kokucheese.com/event/index/335530/


IBM Champion 2016のノミネーションは2015年10月31日まで

IBM Champion 2016へのノミネーションが始まっています

その年のIBM Championを決めるノミネーションが先月より始まっています。

以下のIBMのソリューションやソフトウェアに対し、年間を通してそのテクニカル・コミュニティーに優れた貢献をしてきた人たちに送られる称号がIBM Championと呼ばれています。

  • IBM Social Business (Lotus, ICS, ESS)
  • IBM Power Systems
  • IBM Middleware (Tivoli, Rational, WebSphere)

2015年、弊社ケートリック株式会社からも私、田付和慶がIBM Championに選ばれるという栄誉を頂きました。2015年では計6名のIBM Championが選ばれました。

IBM Championに自薦、他薦しよう

その年のIBM ChampionはこちらのURLからのみ応募が可能となっています。ここでノミネートされた自薦、他薦を含むエントリーからIBMが毎年IBM Championにふさわしいと思う人たちを任命する流れになります。

ただ、こちらのエントリーフォームが英語であるため、日本人にとっては少々ハードルが高くなってしまっているという話を聞きました。

そこで、以下にエントリーフォームの和訳を載せてみました。(記載は英語でなければならないのでそこが一番ハードルが高いのかもしれませんが・・・)

(こちらはIBMからの正式な和訳でもなく、私が勝手に訳したものですので最終的な判断は自己責任でお願いします。)

IBM Champion ノミネートフォーム和訳

IBM Championノミネーションフォーム和訳

IBM Championノミネーションフォーム和訳

日本からも沢山のノミネートが行われるといいですね。

エントリーフォームは<こちら>から。


WIRED誌に弊社代表のIBM Verseに関するインタビューが掲載されました

ibm-verse

wiredjp

  WIRED誌に弊社代表のIBM Verseに関するインタビューが掲載されました。

2015年9月14日、WIRED誌によりIBM Verseに関する弊社代表、田付和慶のインタビューの記事が掲載されました。

http://wired.jp/innovationinsights/post/social/i/verse/

こちらはWIRED誌のオンラインサイト(http://wired.jp/)内の特設コーナー「INNOVATION INSIGHTS」(http://wired.jp/innovationinsights/)で見ることが出来ます。

IBM Verseに関して、IBM XCITE 2015 Springで登壇してお話しさせて頂いた内容がこちらにもまとめてあります。

https://www.ktrick.com/ibm-verse/

取材をして頂いたWIREDの方、IBM関係者の方々、掲載にあたりご尽力くださり、ありがとうございました。


XPagesのラジオボタンをカッコいいデザインに変える方法

通常、ラジオボタンをCSSだけでデザインする場合によく使われる方法

通常、ラジオボタン、チェックボックスをデフォルトのブラウザの持つデザインではなくカスタマイズしようとした場合、HTMLソースコードを以下のように用意します。

ここでまず、ラジオボタンのINPUTタグとLabelタグを兄弟関係で持たせるということが重要になります。その後、CSSによって以下のように指定します。

これにより、丸ポチを100%透過してしまい見えないようにしてやります。
次にLabelタグを使い、好きなようにボタンのデザインを作成してやります。

こうすることでこのようなラジオボタンにカスタマイズすることができます。

custom-radio

このCSSで重要なのは ”input[type="radio"]+label:before” としている点です。
つまり、+label とすることでinputタグの兄弟関係にある labelタグのデザインをカスタマイズしています。
なお、なぜこのような遠回りなことをしなければいけないかというと、input タグには「:before」が使えず、またinputタグ自体は非表示しなければならないため、labelを使ってこのような対応になってしまうわけです。

と、ここまではXPagesに全く関係のないHTMLとCSSのお話なので、ラジオボタンをカスタマイズしたい場合はググってみると色々なデザインを発見できると思います。
前置きがかなり長くなりましたが、XPagesで同等のことをしたい場合の説明をします。

XPagesのラジオボタン(ラジオボタングループ)はHTML構造が違う!?

同様のことをXPagesのラジオボタンで行いたい場合、まずXPagesが出力するHTMLソースコードをチェックします。ここではラジオボタングループを利用します。

すると出力されるコードは以下の通りです。(Domino 9.0.1)

見て頂いて分かるようにinputタグを子にもつようにlabelタグで括られています。これがXPagesでラジオボタンのデザインをカスタマイズすることを難しくしています。

ラジオボタンがチェックされたか、親のタグのLabelから分からない

上記CSSで、"input[type="radio"]:checked+label:before"というセレクターがありますが、「ラジオボタンがチェックされたとき、その兄弟のラベルのデザインを変更する」という箇所になります。CSSでは「XXXという子要素を持つ親の要素」という逆順のセレクターを指定することが出来ないため、XPagesの「INPUTタグ(ラジオボタン)を選択された時の親のLabelのデザインを変更する」ということが技術的に不可能になります。
(jQuery等を使いJavascriptで処理する場合は可能であったりします。。。)

それでもCSSだけを使って頑張って実装する!

上記CSSによるラジオボタンのデザイン変更が出来ないため、別の方法による実装をする必要があります。

「box-shadow」を駆使して実装する!

XPagesのラジオボタン用のCSSは以下のようになります。

こちらのCSSでは"label:before"でラジオボタンの外枠を描画、"label:after"で選択時の丸ポチを描画しています。キーはクリック時の丸ポチの表示・非表示を"box-shadow "でマスクすることで実装しています。
多少複雑ですが、こうすることでXPagesの出力するHTMLにCSSを被せるだけでデザインをカスタマイズすることができるようになりました。

なお、このCSSですが、IE8以前のブラウザでは残念ながら正しく動作しません。"box-shadow"がIE8ではまだサポートされていないためです。

おまけ

上記CSSの応用みたいなものですが、ラジオボタンに画像を使うなどアイデア次第でより大幅にデザインを変更することができるようになります。
以下のソースコードでは"box-shadow"を使い選択された値の画像を濃淡により表現しています。

こちらのコードを実行した場合のイメージがこちらです。アイコン画像をクリックすると選択状態を表すように色が濃くなります。

custom-radio-img