Bluemix – 使い方手順

Bluemixは、IBM が提供するソフトウェア込みの クラウド環境 (PaaS) です。ローカル環境無しで アプリ開発できる使い方手順を、以下にご紹介します。(ID登録以外の以下の流れは、30分もあったら完了します!)

こちらは少し古い画面になっているため、新しいBluemix画面の使い方は以下をご覧ください。
⇒最新のBluemix使い方手順はこちら

Bluemixのログインと環境構成

Bluemix は 30日間は無料で使えるので、以下を見て自分のメールアドレスを 「IBM ID」 に登録すれば、すぐに使えるようになります。

=> Bluemixログインのための、IBM IDの登録のしかた

2回目からは以下の Bluemixコンソールからログイン(右上のボタン)します。(この画面の「無料で開始」からID登録も可能)

https://console.ng.bluemix.net/
Bluemixとは何か

すると、以下のような 「ダッシュボード」 画面が表示されます。Bluemix のクラウド環境を構成する場合は、この画面から実施します。[アプリの作成] で自分の Bluemixアプリケーションを作れますので、クリックします。

1.Bluemix_dashboard

すると以下のように、[WEB] と [モバイル] を選択する画面が出てきます。何と、これだけでどちらかの環境が自動的に構成されます(これは素晴らしい)。 [WEB] をクリックしてブラウザ用アプリを作りましょう。

1.Bluemix_select

次に、まずどの実行環境でプログラムを動かすか聞いてきますので、一番簡単な、Node.js を選んでみましょう。[SDK for Node.js] というのがソレです。js つまり JavaScript言語がクラウド上で実行できます。[続行] ボタンで次に進んでください。

1.Bluemix_nodejs

次に、新規作成するアプリの名前を入力します。以下の [アプリ名] のところに自由な名前を入れることができますが、既存の名称と重複するとエラーになるので、重複しないように名前を入れます。(この名称がURLになるため)
私は 「BMSample」 にしましたが、これとは違う好きな名称にしてください。入力し [完了] をクリックしたらすぐにアプリケーション環境が起動されます。

1.Bluemix_bmsample

すると以下のように コーディング環境 の解説画面が表示され、しばらくすると [アプリは稼動しています] となります。コーディング環境は、クラウド上の GITでコード開発をする、一番右の [GIT]にしてみます。

1.Bluemix_git

上の画面は単なる解説で、画面一番下にスクロールして、[アプリの概要の表示] ボタンを押して、後で開発環境を構築します。

1.Bluemix_gaiyou

すると以下のような 「アプリの概要」 の画面になり、既に自分で追加したアプリケーションがクラウド上で稼動しているのが確認できます。右に [アプリは稼動しています] とありますね。

1.Bluemix_apligaiyou

Bluemix開発環境: DevOpsサービスのセットアップ

次に、開発環境を作成します。上の画面の右上に、[GITの追加] がありますので、そこをクリックしてください。すると、以下のように Gitリポジトリ用の別名入力画面が表示されますので、何かしらのIDを入力して [作成] をクリックしてください。確認画面が表示されたら [続行] をクリックします。(エラーになったらしばらく待って再実行)

1.Bluemix_GITid

自動的に初期サンプル・アプリケーションの 「スターター・コード」  がGitに取り込まれます。Gitリポジトリは、ソースコードを置くクラウド上の保管場所のことです。自分のPCのEclipse等でプログラムを編集して、クラウド上のGitリポジトリに同期を取ることが可能です。また、それを自動的にクラウドのサーバーで稼動(デプロイ)させることも可能です。

「アプリの概要」 の画面に戻ると、左上のサンプル・アプリ名の下の、[経路:] の右のURLがサンプル実行のURLとなります。それをクリックすると以下のような画面が表示され、実行が確認できます。

2.Bluemix_sample

Node.jsサンプルを変更して稼動確認

「アプリの概要」 の画面に戻ると、右上に[GIT URL: xxxx] と、 [コードの編集] が表示されるようになります。GIT URLがソースコードの置かれる場所のアドレスになります。右の [コードの編集] をクリックして、クラウド開発環境である 「IBM Bluemix DevOps Services」 に入りましょう。左のツリーの [public]フォルダーから、[index.html] を選択してみてください。右にソースコードが表示されますが、これが初期サンプルの 「スターター・コード」 です。

2.Bluemix_index

そのソースコードの 18行目は、以下のようになっていると思います。

<h1>Hi there!</h1>

there! の後ろに以下のように、「こんにちは!」 と入力して以下のように変更してみましょう。(その下のイメージは変更後)

<h1>Hi there! こんにちは!</h1>

変更したら、左にある、[ファイル] メニューを開いて、[保存] をクリックして保存しましょう。

2.Bluemix_index2

以下のように メニューバー のやや右にある [2.デプロイアイコン] をクリックして 「ワークスペース・コンテンツを使用したアプリケーションのデプロイ」 を実行してください。サーバーが一度停止し、再起動します。

2.Bluemix_index3

しばらくして以下のように サンプルアプリ が [実行中(標準)] で緑の表示に変わったら、サーバーに更新が反映されています。
次に、この変更したプログラムを実行してWeb画面に結果を表示しましょう。先ほどの2つ右のアイコン [2.実行アイコン] をクリックし 「アプリケーション URLを開く」 を実行します。

2.Bluemix_appliURL

すると、以下のように自分で入力した 「こんにちは!」 が、画面に追加されているはずです!これで自分で変更したアプリが クラウド上で動いたことが確認できます。

2.Bluemix_updated

ブラウザに表示される URL も、以下のように自分が指定したアプリ名称のURLになっていることが確認できます。

https://bmsample.eu-gb.mybluemix.net/

これは自分のPCではなく、既にクラウドで動いているため、どのPCのブラウザからでもこのURLを入力すれば画面を見ることができます。

次にもう少し編集してみましょう。以下のように、一度 <body> と </body> の間を全て削除して、「こんにちは!」 だけ残してください。

2.Bluemix_index4

再度 [2.デプロイアイコン]  で デプロイ して [2.実行アイコン] で実行すると、以下のように表示されるはずです。

2.Bluemix_result2

後はこの部分を自分の好きに編集してみてください!

Bluemixとは何か 、実際使って分かった気がする

クラウド上の開発環境、面白いですね。実際に使ってみて、直感的で使いやすいし、自分でミドルウェアとか導入・セットアップしなくて良いし、 Bluemix とは何か 納得できた気がします。
Bluemix DevOps Services は、まさにクラウドで開発してすぐにクラウドで動かせる 「Dev(開発)Ops(実行)」 環境ですね!

以前よりもだいぶ使いやすくなりましたね。いろんな端末から使えるので、これからちょっとプログラムを動かす サーバー が必要な時に使えそうです。

=>次は、Bluemix DevOpsで作る、Node.jsで動く 簡単サンプル!

=> Eclipseを使ってBluemixの開発をしてみよう!

=> Bluemix開発シリーズ全体

FacebookTwitterGoogle+LinkedIn

FinTech Summit – FinTech企業の方々とのパネル・ディスカッション

9月に開催された 「FinTechサミット」 での FinTech企業の方々とのパネル・ディスカッションを、日経電子版さんに記事にしていただきました!

⇒日経電子版さん 「FinTechを加速する共通APIというアプローチ」

テーマは「APIバンキングによる FinTech共創戦略」 で、FinTech企業の方々(Zaim, freee, Moneytree)、我々金融機関さんのシステムを預かる立場とそれぞれの観点で、今後のFinTechの方向性についてディスカッションしました。

それぞれの観点はいろいろあるものの、今後のFinTechの方向性としては、振込みなどの更新系や、FinTech企業間での取引などにますます発展するでしょうという話ができました。その中でもやはり、API (Web API)とそのセキュリティの確保が今後もFinTechのキーになるというのが共通認識でしたね。

このような日本をリードする素晴らしいFinTech企業の方々と協業し、今後も日本の新しい金融サービスの実現を開拓していきたいと思います!

 

FacebookTwitterGoogle+LinkedIn

FinTech Summit – FinSumパネルディスカッションで感動

9/21に丸ビルで、金融庁・日経新聞さん主催の FinSum: FinTech Summit でパネル・ディスカッションをしてきました。かなりのセッションが英語で実施されており、インターナショナルなシンポジウムでしたね。

fintechsummit%e4%bc%9a%e5%a0%b4b

我々のセッションは日本語でしたが、マネーツリーさん、freeeさん、Zaimさんと一緒に、FinTechのAPIバンキングについて、各社の考えるFinTechのポイントや、APIのこれからの課題についてディスカッションしました。

パネル・ディスカッションを実施して感動したことが一つ。会場で何かせっせと作業している人がいるなぁと思っていたら、終了した瞬間に、ディスカッションした内容がきれいにまとめられた以下のイラストが出来上がっていました。

fintechsummit%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88%e3%83%bb%e3%83%91%e3%83%8d%e3%83%ab

似顔絵も似てるし、何よりほとんどチャートも使わないパネル・ディスカッションだったのに、要点がイラストで分かりやすくまとめてありました。感動!こういったディスカッションの可視化の方法、あるんですねー。

驚いたことに、以下のようにほとんどの主要セッションで、このイラストパネルが作成されていました。

fintechsummit%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88%e3%83%bb%e3%83%91%e3%83%8d%e3%83%ab%e9%9b%861a

fintechsummit%e3%82%a4%e3%83%a9%e3%82%b9%e3%83%88%e3%83%bb%e3%83%91%e3%83%8d%e3%83%ab%e9%9b%862b

これは分かりやすくで良いですねー。うちのイベントでも作って欲しいです!

 

FacebookTwitterGoogle+LinkedIn

FinTech – イノベート九州のハッカソンで、お手伝い預金が最優秀賞!

INNOVATE HACK 九州で行われた ハッカソン のコンテストで、お手伝い預金アプリが最優秀賞!スマホで子供の口座に気軽におこずかいをあげるなんで、楽しくなるアイデアですね!

子供が欲しい おもちゃなどの金額を目標に、お手伝いをしておこずかいを貯めるという ユースケース。子供がお手伝いして自分でそのおこずかい額を入れると、Watson がAIでその相場観を見てくれるというおまけ付き。

お手伝い預金

親がオッケーすると、スマホから、我々が提供した FinTech共通API 経由で子供のお小遣いが振り込まれます。(FinTech共通APIも記事にしていただき、ありがとうございます~) ただし、同じ支店内の口座であれば、振り込み手数料はかからないので、安心!

ハッカソンはこれまで何となくプログラマーの祭典ってイメージがありましたが、こんな子供にも嬉しいアプリが世の中に出て行くなんて、楽しいですね。ハッカソンや受賞の様子はネットでライブ中継されて、その熱気が伝わってきたのも良かったです。

イノベート九州ハッカソン

しかも今回は、高校生のチームによる受賞もあって、びっくりしました。しかも、VRで九州 福岡の街に仮想広告を表示するという本格的なもの。若者がここまでやってくれると、ITのここまでの浸透にびっくりすると同時に、今後がとっても楽しみですね。

高校生チームもハッカソンで受賞

これからも金融機関や様々な企業にサービスを外部提供するAPIをたくさん作っていただき、多くの人にこういった新しい体験ができるアプリをたくさん作ってもらえるようがんばります!

これこそまさに APIエコノミー!

⇒お手伝い預金に最優秀賞! 凄すぎる高校生も登壇!「INNOVATE HACK KYUSHU」決勝戦

 

FacebookTwitterGoogle+LinkedIn

ionic – スマホ・アプリの簡単な作り方は、これで決まり!

iPhone、Android の両方で動く、ハイブリッド な スマホ・アプリ が簡単に作れるという 「ionic」。使ってみましたが、コレは本当に良くできてます。特にクイックに スマホ らしい アプリ を作りたい時には最適でしょう。

⇒ ionicフレームワーク

ionic はモバイル・アプリを開発するためのフレームワークですが、イチから作られたモノではなく、既にポピュラーなオープンソースである AngularJSと、 Cordova (Phonegap) をベースにより簡単にアプリを開発できるようにしたものです。文字やボタンの画面部品が良くできていて、いわゆる iPhone っぽいアプリ画面を簡単に作ることができます。

ionicの、Windows で Androidアプリを作る際のセットアップ方法を、まず以下に共有します。(iOSアプリを作りたい時はMacでのセットアップが必要になるので、別途)

まずは今どきのオープンソース利用の基本、Node.jsのnpmを利用してパッケージをインストールします。また、Android SDKの導入も必要になります。これらの取得がまだの方は以下のリンクの最初の 「ダウンロードと環境準備」 を見て、それらのインストールを行ってください。

⇒ionic に含まれる Cordova 用環境設定

ionicのセットアップ

続きを読む ionic – スマホ・アプリの簡単な作り方は、これで決まり!

FacebookTwitterGoogle+LinkedIn

self-driving – 自動運転車に初めて乗ってみました!

幕張で自動運転車に乗れるとのこと。無人運転バス「ロボットシャトル」です。早速夏休みを利用して行ってみました。混んでるかと思って平日に訪れたのですが・・・何と、私一人でした。若干閑散感。

自動運転 幕張全景

やや世間の関心薄いのかな?と思って係りの人に聞いてみたところ、「そんなことありません、一日200名は来てくれます」 とのことでちょっと安心。というわけで、貸切り自動運転バスを堪能することになりました。

200円払って、WAONカードをもらったら(さずがイオンさん主催)、待ち構えている自動運転バスへ。トップのフォトにもあるようになかなかカワイイ。

自動運転 バス乗り込み

貸切であることをいいコトに、まず前方に向いてカシャ。

自動運転バス前

そして、後方に向いて、カシャ。

自動運転バス後ろ

全然変わり映えしません。なるほど、完全自動運転車ってこうなるのね。ハンドルがいらないので、前方も後方も同じ椅子。前も後ろも座席で向かい合って座れます。そして、前方にも後方にも走れます。 続きを読む self-driving – 自動運転車に初めて乗ってみました!

FacebookTwitterGoogle+LinkedIn

Pokemon GO – ポケモンGO ついに凱旋!遊び方はこちら

世界的に 「ポケモノミクス」 とまで呼ばれる ブームを巻き起こしている 「ポケモンGO」 がついに日本に凱旋!ということで、早速ダウンロード。と思ったのですが AppStore で見つかりません。

Pokemon go AppStore

試したら 「pokemon go」 と英語で検索すれば見つかりました。そういえばこの ポケモンGO、任天堂さんではなく、旧Google傘下の Niantic社の提供。それもあっての英語名称ですかね。

Pokemon go 設定W

早速インストールして立ち上げたら、上のキャラ設定画面。肌の色や服の色が選べます。後はニックネームの登録。これがなかなか使えるニックネームが無く何度か入れ直しましたが、結局Ingressと同じにしたらOKでした。(Ingressと連携してる?) が、設定はこれくらいですぐ楽しめます。しばらく歩いていると、ブルっとしてトップのフォトのように近くにポケモンが出現。このポケモンをタップするとGET画面になります。
おっと、駅に ニャース 出現!(以下の背景は実写モード)

Pokemon go ニャース

続きを読む Pokemon GO – ポケモンGO ついに凱旋!遊び方はこちら

FacebookTwitterGoogle+LinkedIn

FinTech共通APIの接続検証を完了しました!

FinTech共通API の、FinTech企業さんとの接続検証が完了したので以下にアナウンスしました!

⇒「FinTech共通API」、FinTech企業との接続検証を実施

また、日経BPさんのIT Proに、インタビュー記事も記載いただきました。

⇒日本IBMが銀行API提供サービスで5社と接続検証完了(日経IT Pro)

接続検証を実施いただいたのは、マネーフォワードさん、マネーツリーさん、Zaimさん、freeeさん、オービックさん。いずれもあまりサポートしなくても、サクっとつなげていただいたのは、さすが名だたるFinTech企業の技術者の方々ですね。

実はこれまでも、FinTech企業の家計簿アプリ等は既に銀行と接続できていて、いろんな口座を一つの画面で見られて便利でした。

⇒FinTechアプリを使ってみて分かった

が、裏の仕組みは 「スクリーンスクレイピング」 と呼ばれる、裏で画面をシミュレーションしてデータを取得するような方法が多かったようです。その場合、銀行が少し インターネット・バンキング の画面を変更するとしばらく接続できなくなってクレームが来たり、パスワードをFinTech企業に預けないといけないのに不安を感じる人がいたりといった課題がありました。

FinTech Screen

そこで、銀行さんに API (アプリケーション・プログラミング・インターフェース。Web API とも呼ばれる)を公開いただき、画面ではなくプログラム間通信にすることで解決するのがこの取り組みです。このような形態を 「APIバンキング」 (API Banking) と呼びます。

FinTech API Banking

そのAPIを共通的なものとすることで、FinTech企業的にも一つのインターフェースの仕様に合わせて開発すれば済むし、銀行的にも多数のFinTech企業といちいち折衝しなくても済むようになるということで、多くの銀行さんにこの 「FinTech共通API」 をご検討いただいています。

FinTech共通API

技術的には、REST/JSON といった最新の汎用的な技術を使ったAPIを構築して接続いただいていますが、認証のところを OAuth 2.0 という仕組みで銀行でログイン認証してから FinTech企業に銀行が接続を許可(認可)するというのが、ポイントになっています。

この FinTech共通API で、さらに便利なスマホ・アプリが世の中にたくさん出てくることを願っております!

⇒FinTechシリーズ全記事


FacebookTwitterGoogle+LinkedIn

Virtual Reality – 千円でVR体験!Googleカードボード

千円で VR (Virtual Reality) 体験ができると聞いて、試してみました。まず以下のGoogleカードボード (Google Cardboard) を Amazon で購入。

Google カードボード

正確には本体代1080円 と、送料 350円の、計1430円でした。家に帰ったら郵便受けに入っていたので、そのコンパクトさに驚きつつ早速開封。以下の袋入りの段ボール風のモノでした。(まさに「ボード」)

Google Cardboard Package2

その段ボールをベロンと展開すると、以下に。この縦長の上2/3は組み立て手順で、下1/3が本体のため下をミシン目で切り取ります。後は上の組み立てて順どおりに組み立て。

Google Cardboard 展開

・・・と思いきや、その組み立て手順が全然手順になってない!ということで一瞬悩みましたが、しばらくやってみると理解。要するに、①と①の部分、②と②の部分など、丸数字のところを合わせていくということなのね。以下がその①、②、③、④を合わせようとしているところ。こんな感じで組み立てていきます。

Google Cardboard 組み立て2

すると、トップのフォトのように組み立て完成!その後以下のようにスマホを組み込みます。が、その前にアプリのダウンロードが必要。あれ?アプリは?・・・と思って見たら、上の上の展開図の真ん中辺にQRコードを発見。あやうく捨てるところだった・・・と思いながらそのQRコードでアプリにジャンプ。・・・しようと思ったけどなんかうまく飛ばなかったので、結局書いてあった g.co/cardboard を入力して以下からアプリをダウンロード。

Google Cardboard アプリ

すると簡単にインストールできて、そのまま立ち上げられました。が、そこで何やらカメラが立ち上がり、何かを写させろって雰囲気が。そこで再度先ほどのQRコード(以下の左)をかざすと、無事動くようになりました。ちゃんとこの段ボールのQRコードが無いと立ち上げられないようになっているのね。 続きを読む Virtual Reality – 千円でVR体験!Googleカードボード

FacebookTwitterGoogle+LinkedIn

Watson Summit – コグニティブ時代の ワトソンの使い方

本日はWatson Summit。昨年まではエキサイトという名前のカンファレンスでしたが、Watson Summitという名前にした瞬間すごい集客率だったそうで、やはりWatson効果は絶大ですね。トップのフォトのポール与那嶺社長のスピーチで幕を開けましたが、Global IBMのGinni Rometti会長も以下のコメントを寄せている通り、

Watson Summit Ginni

もうIBMはコグニティブとクラウドの会社です。とのこと。他にもいろいろあったような気もするけど・・・もうその二点に全て集約させるくらい、力が入ってますね。

私も今年からWatsonの技術統括も担当しているので、うまく活用してお客様の役に立てたいですね。ということで、すっかり有名になったこのWatson君をどう使っていくかが、このカンファレンスの主題であると思いました。

基調講演の一つは、PepperでWatsonと強力に協業させていただいている、ソフトバンク社の宮内社長からお話いただきました。最初の話は、アメリカの大学で、大学の履修科目などの問い合わせ対応にWatsonを使っていたが、5ヶ月間誰もWatsonが答えていると気付かず、人だと思ってたという話がありました。

Watson Summit 大学

この話はシンプルで分かりやいですね。もうそういう時代になったなと。そういう使い方があるんだなと。Watsonなら夜中でも休日でも休まず答えてくれますしね。また、三菱東京UFJ銀行様のLINEを活用したサービス提供事例も話していただきました。

Watson Summit BTMU

ソフトバンクさんに多大なる強力を得て開発した日本語Watson、既にこのように活躍していますね。面白かったのは、次のソフトバンクさん自身の事例 「Softbank BRAIN」。ソフトバンク社用Watsonをどんどん賢く教育して、コールセンターの電話や、携帯ショップでの問い合わせに対して、難しい質問でも即座にWatsonが答えてくれるようにしようとするもの。さすがソフトバンクさん、取り組みが一歩先を行っていますね。

Watson Summit Softbank宮内社長

続きを読む Watson Summit – コグニティブ時代の ワトソンの使い方

FacebookTwitterGoogle+LinkedIn

nikami.org – デジタル時代の自分デジタル化の軌跡