月別アーカイブ: 2013年4月

「Live Time Board(ライブタイムボード)」をリリース

livetimeboard_img01

 

株式会社クロノス(本社:大阪市淀川区、代表取締役:月村 俊之)は、ブラウザだけで利用できるインターネット上の共有のホワイトボード「ライブタイムボード」を2013年4月17日より提供開始します。

「Live Time Board(ライブタイムボード)」は、地球上で最も手軽な電子ホワイトボード!を合い言葉に作られたインターネット型ホワイトボードです。

■製品の詳細
「ライブタイムボード」は、タブレットやPCのブラウザに、リアルタイムで同時に書き込める共有のインターネット型ホワイトボードを実現します。 緊急事態もしくは危機管理のシーンや、多拠点合同会議などにおいて、タブレットやタッチパネルディスプレイを持つPCのインターネットブラウザ上で、手書きしたイラスト・文字を同時に多拠点・多人数で書き込めるクラウド型情報共有ソリューションです。

iPad/Androidなどのタブレット、タッチディスプレイに対応したWindows 8パソコンのいずれかに、インターネットブラウザがインストールされていれば使い始めることができます。 また、クラウド提供版(SaaS)も近日サービス開始予定です。

■体験版環境を公開中
クロノスのWebサイトから体験版を利用することが出来ます。
※下記サイトより「体験する」をクリックしてください。

◆Live Time Board
http://i.livetimeboard.com

■価格
20ユーザライセンス(税込) 105,000円
100ユーザライセンス(税込) 315,000円

※上記ライセンスを組み合わせて、サーバにアクセスするユーザ数分のユーザライセンスとします。
製品構成・価格は予告無く変更されることがあります。

■開発の経緯
本製品の前身であるクラウドコラボードは、2011年の東日本大震災における電話網断絶の経験を活かし、開発されました。多拠点のある企業様などから引き合いをいただいております。
クラウドコラボードについては専用の端末が必要であり、またiPhoneとiPadへのみホワイトボード画像の共有が可能でした。
これをより利便化するため開発されたのが、「ライブタイムボード」です。
専用端末を使用することなく、現在お使いのタブレット端末やパソコンをそのままお使いいただけます。

【会社概要】
商号   : 株式会社クロノス
代表者  : 代表取締役 月村 俊之
本店所在地: 大阪市淀川区西中島4丁目13-22 大拓ビル17 5F
事業内容 : ソフトウェアの企画・開発・コンサルティング、IT教育等
URL    : https://www.kronos.jp/

サイトリニューアルのお知らせ。

株式会社クロノスのコーポレートサイトを2013年4月11日をもってリニューアルいたしました。
主なリニューアル内容は以下の3点です。

1) より見やすく、親しみやすいデザイン
2) 知りたい情報にすぐにたどりつけるサイト構成
3) 新しい試み(試作サービスを集めたクロノスラボ、技術情報を集めたナレッジボックス等)

これからも、株式会社クロノスをよろしくお願いいたします。

カスタムURLスキームを使ったアプリ間連携

プラットフォーム: iOS、Android、Web

スマートフォンのWebブラウザからアプリを起動したり、アプリから別のアプリを起動したい場合、カスタムURLスキーム(URL Scheme)を使って実現することができます。当社でもWebアプリとスマートフォンアプリが連携するサービスを数多く手がけています

特徴

・Webブラウザからスマートフォンアプリを起動します
・アプリから別アプリを直接起動できます
・アプリを起動する際にパラメータを渡して起動時の初期動作を変更することが可能です

実装サンプル(iOS)

アプリ連携には当然、呼び出す側と受ける側がありますが、
他アプリをへ連携する方法をサンプルとして記載します。

 

呼び出し方法は3つあります。

1. openURLを利用したアプリ連携
2. UIDocumentInteractionControllerを利用したアプリ連携
3. UIActivityViewControllerを利用したアプリ連携(iOS6以降)

 

・openURLを利用したアプリ連携
カスタムURLスキームを指定し呼び出す、昔からある基本方法です。
データの受け渡し方法は、「UIPasteboard(iOSのクリップボード)」を使った方法や「カスタムURLスキームにファイルパスなどを付加」して渡す方法など
アプリによって様々となります。

 

呼び出しコード例

 

カスタムURLスキームは沢山あるので、一部だけ記載しておきます。

 

 アプリ名  カスタムURLスキーム
 メール  mailto:
 電話  tel:xxx-xxxx-xxxx
 iTunes  http://itunes.apple.com/jp/genre
 iBooks  itms-bookss:
 Maps  maps:
 リマインダー  x-apple-reminder://
 Twitter  twitter:
 Evernote  evernote:root

 

 ・UIDocumentInteractionControllerを利用したアプリ連携

 

カスタムURLスキームを知らなくても、利用可能なアプリ一覧を表示、連携してくる便利なAPIです。

 

呼び出しコード例

 

実行イメージ(iOS6)
【iPad】             【iPhone】
 

 

 

・UIActivityViewControllerを利用したアプリ連携

iOS6以降という制限が可能であれば、UIActivityViewControllerを
利用した連携が非常に簡単です。
UIDocumentInteractionControllerと見た目もほぼ同じですが、
UIDocumentInteractionControllerは連携できるファイルは1つでしたが、
UIActivityViewControllerは、複数ファイルを渡すことができます。
確認出来ているのは、文字、画像、URLが渡すことができます。
さらに、UIActivityViewControllerの場合は、表示しないアプリ指定したり、
表示するアプリに独自アプリを追加できるなど拡張も可能となっています。

 

システムで用意されているアクティビティを呼び出すコード例

 

独自アプリを追加したコード例

 

実行イメージ
【システム標準】     【独自追加】
 

 

開発経緯や開発者による苦労話

今では当たり前になったカスタムURLスキームを使ったアプリ起動。弊社がアプリ開発を始めた当初はまだ情報が少なく、GoodReaderなどの有名なアプリの挙動を調べたり、英語の文献を探しながら手探り状態で実装しました。

今では連携方法も増え、FacebookやTwitter等のSNSへ自動ログインしたりSNSアプリと連携することも可能になりました。

 

サービスの活用事例

・Webサービスとスマートフォンアプリの連携
・スマートフォンアプリ同士の連携
・SNSのアカウントを利用したサービスの構築

連携画面イメージ(iOS)

【iOS5 iPad】       【iOS6 iPad】     【iOS6 iPhone】
  

 

関連する記事

iPhoneアプリを外部連携させてURLで起動させる方法(ブログ)

カスタムURLスキームを利用する(ブログ)

まとめ

アプリの起動だけではなく、アプリ間連携、SNSへの自動ログイン等も弊社では
豊富なノウハウがあります。ぜひ一度ご相談ください。

Seleniumを利用したWebアプリケーションテストの自動化

プラットフォーム: Webアプリケーション全般

Selenium2とは、Webアプリケーションのテストを自動化するツールです。Selenium2はコマンドやAPIを使って、Webアプリケーションの動作確認テストをプログラム化できます。2011年にSelenium1とGoogle社のWebアプリケーションテストツールの「WebDriver」が統合し、Selenium2となりました。

特徴

・ブラウザ上でボタンのクリックやフォーム入力の自動化
・画面のスクリーンショットの撮影の自動化
・自動テスト実行中に取得した値との正誤判定

開発経緯や開発者による苦労話

Selenium2についての情報が少なく、なかなか新機能の情報が得られず苦労しました。

自動テスト実行中、まだSelenium2が動作処理の命令をを行う対象となるHTML要素を認識できていない時に、動作処理の命令を出してしまいエラーになるということが度々ありました。対処法として指定した秒数間停止するseleniumのコマンドや、ページが読み込まれるまで待つAPIを使用して回避しました。

環境構築の手順

実行環境

・Windows 7、Google Chrome、Eclipse(JUnitテストの作成に使用)

・JDK1.7.0_11、Selenium-java-2.29.0、Selenium-server-2.29.0

・chromedriver_win__26.0.1383.0.zip(Google Chrome用ドライバー)

1. Selenium2とドライバーのダウンロード

 1-1. seleniumダウンロードページからselenium-java-x.x.x.zipとselenium-server-x.x.x.zipをダウンロードし、任意の場所で解凍する。

 1-2. chromium プロジェクトのダウンロードページからchromedriver_win__x.x.x.x.zipをダウンロードし、任意の場所で解凍

2. eclipseに新しいプロジェクトを作成

 2-1. eclipseでプロジェクトを作成

 2-2. JUnitライブラリをクラスパスにロード

 2-3. selenium-java-x.x.x.jarとselenium-server-standalone-x.x.x.jarをビルド・パスに追加

3. クラスパス上にchromedriver.exeを配置

サンプルコード

Androidの並列処理部品

プラットフォーム: Android

Androidの非同期処理を拡張し、コールバック時のエラーハンドリングやUIスレッドの更新を安易に行えるようにました。

特徴

・Android非同期処理の終了時処理コールバック

開発経緯や開発者による苦労話

Androidアプリに時間のかかる処理させるとき、画面に見えない裏側で並行処理してほしいケースがよくあります。Androidの標準部品にはこれを実現するための仕組み(AsyncTask)が備わっているのですが、使いづらいところがありました。
エラーハンドリング、並行処理後のUI更新などなど。
Androidのアプリをいくつか開発していて、この部分で開発メンバーがいつも苦労していたので、安易に使える仕組みを部品にまとめました。

サービスへの活用例

・データーベースの更新などの時間のかかる処理
・クレジットカード会社への問い合わせ処理

利用イメージ

Android非同期部品

まとめ

非同期の並行処理を利用するとAndroidで長い処理の待ち時間でも、他の作業を実行できます。レスポンスでお悩みの方は、並行処理を検討してみてください。きっとこの部品が欲しくなるはず。

ブラウザDBを使ったWebサイトのオフラインモバイル対応

プラットフォーム: iPad / iPhone / PC(Chrome / Safari )

ブラウザDBを使ってWebシステムをオフラインでも利用できるサイトにリニューアルします。
iPadやiPhone、Androidに最適なアプリケーションを簡単に構築できます。
ブラウザ上で動作するアプリケーションなのでモバイルOSの種類に関わらず構築できます。

特徴

・オフラインで使えるモバイルサイトを構築します

・モバイルOS(iPad/iPhone、Android)に依存しません

・AppStoreなどに公開する手間がなく、ブラウザだけで利用できます

・モバイル端末の画面サイズや操作法に最適な画面レイアウトに組み換えます

開発経緯や開発者による苦労話

オフラインで利用できるシステムを作るための技術としてHTML5を採用しました。
HTML5が策定する機能の内、特に次の2つの機能がこの仕組みの肝に当たります。

 

・HTMLファイルや画像ファイルなどのリソースファイルをブラウザに保存しておく機能
・ブラウザにデータベースを持たせてデータを管理する機能

 

ところがHTML5の仕様群はまだ完全ではなく、ブラウザのバージョンが更新されたときに動かなくなる可能性があります。特に、ブラウザにデータベースを持たせる機能は動かなくなる可能性が高く、この仕組みの実現性が危ぶまれました。

 

そこで我々は今後実現が堅いだろうと言われている機能(IndexedDB)と現時点で一番実現が進んでいる機能(WebSQLDatabase)の両方を切り替えて対応できる共通部品を作成しました。

サービスへの活用例

・AndroidとiOSでプログラムを別々に開発したくない場合に!

・外に出ることが多い営業さん向けのシステムに!

・AppStoreやGooglePlayに公開したくないモバイルアプリケーションに!

・頻繁に更新するコンテンツアプリケーションに!

デモ or 利用イメージの画像

HTML5でオフラインWeb

技術詳細

・HTML5 Application Cach

・HTML5 WebSQLDatabase/IndexedDB

・jQuery / jQuery Mobile

 

HTML5のAPIでブラウザにデータベースを作成する方法は、2013年2月時点で2通りあります。
一つがWebSQLDatabaseであり、もう一つはIndexed Databaseです。
WebSQLDatabaseは、いくつかのブラウザで最も実現が進んでいるにもかかわらず、仕様として凍結が決まってしまっています。他方でIndexed Databaseは標準となるだろうと言われていますが、まだきちんと実装されたブラウザが少ないので現時点で使い物になりません。

 

Indexed Databaseは、KeyValueStore形式のデータベースであり、.put()や.get()といったメソッドでJavaScriptObject表記法(JSON)のデータを保持します。

 

後々に、Indexed Databaseを利用するとして現段階ではWebSQLDatabaseでKeyValueStore形式のデータベースラッパーを作成して、利用法を制限しておけば、後にIndexedDatabaseの実装が普及した時にも乗り換える事が出来るようになります。

 

下記に、そのデータベースラッパーのコードを記載します。
※ ChromeまたはSafariのみ対応です。

 

■ローカルデータベースを利用するための前処理部分

上記のコードにより、db.open()メソッドをコールしたタイミングで、WebSQLDatabase上にKEYとVALUEとTIMESTAMPというそれぞれのカラムを持ったテーブルが作成されます。(既に存在すれば作成しません)

 

■get()メソッド

 

get()メソッドは、取得したいkeyとonsuccessというコールバック関数を引数にとるメソッドです。
WebSQLDatabaseにしろ、IndexedDatabaseにしろ、このような非同期型のAPIの方が、同期型API(var returndata = db.get(key);のような)よりも実装が進んでいる傾向にあります。

 

同期型のAPIの方がコードぱっと見たときには理解がしやすいのですが、使ってみると非同期APIの方がパフォーマンスも良く、モダンなJavaScriptコーディングには向いてると感じられます。

 

■put()メソッド

 

put()メソッドもコールバック関数を受け付ける非同期型のAPIとしています。
データ存在時のコールバックなど、いくつも引数がありますが多くは省略可能です。

まとめ

今までのWebシステムをiPhoneやiPadでも快適につかえるようにオフライン対応できます。
またAppStoreやGoogle Playに公開する手間がなく、頻繁に更新するようなアプリケーションや社内だけで利用するようなアプリケーションには最適です。

期間課金モデル(Non-Renewing Subscription)

プラットフォーム: iOS

Appleが提供している期間課金モデル(Non-Renewable Subscription)です。

Auto-Renewable Subscriptionsは課金期間等をAppleが管理する一方、Non-Renewable Subscriptionは自社サーバ内で管理するため、柔軟な課金形態を用いることができます。

iOS向けの月額課金や期間課金(オリジナルの期間単位での課金)を実現するために、開発者が苦労する部分をまとめて部品化しています。

特徴

・複雑な課金処理部品

開発経緯や開発者による苦労話

月額課金モデル同様、テストにコツが要ります。テスト環境と本番環境でAppleから発行されるレシート情報に若干の違いがあったり、期間の考え方も違ったりするため、テストケースを作成するのも一苦労です。

月額課金モデルに比べると、レシートの扱い方がシンプルなのですが、期間限定のプレミアム会員系のサービスを実装する場合は自社サーバとの連携が必要なため、開発規模が大きくなり、テストも困難になります。弊社も数多くのテストパターンを作成し、徹底的にテストをすることで、間違いのない課金の仕組みを構築しました。

サービスへの活用例

・定期購読系のサービスの構築に
・プレミアム会員系のサービスの構築に

利用イメージ

Non-Renewable Subscriptionを利用しているアプリを紹介しています。

 

Ultimate Guitar Tabs HD

Unique Honeymoons

QuizCloud

 

※上記は当社が開発したアプリではありません。

まとめ

課金の部分は最もバグが怖い部分です。
弊社の実績のある課金処理部品化を使用することで、通常ならたくさんの時間をかけなければならないテストや処理を効率良く安心して使用することができます。

月額課金モデル(Auto-Renewable Subscriptions)

プラットフォーム: iOS

iOS(iPhone、iPad、iPod touch)で課金機能を実装したアプリを開発する場合は、Appleが提供している下記の課金モデルの中から選んで利用します。

 

・Consumable

一度利用すると無くなるような消費型の課金モデルです。 同じアイテムを何度でも購入できるため、ゲームアプリのアイテム課金等で利用します。

 

・Non-Consumable

一度購入すればずっと利用できるような非消費型の課金モデルです。 無料アプリの広告を解除する場合やゲームアプリなどで機能制限を解除する場合等に利用します。

 

・Auto-Renewable Subscriptions 本ページで扱う課金モデルです

自動継続型の課金モデルです。雑誌や新聞等、一定の期間で継続して自動課金する場合に利用します。

 

・Free Subscription

無料購読型の課金モデルです。Newsstandで無料購読のコンテンツを配布する際に利用します。

 

・Non-Renewing Subscription

購読型の課金モデルです。 期間を限定したサービス用として使われますが、Appleが Auto-Renewable Subscriptions (自動更新)購読を推奨しているため利用機会は少ないです。

 

ページでは、今後利用が広がると予想されるAuto-Renewable Subscriptionsについての記事です。

特徴

Auto-Renewable Subscriptionsの特徴は以下のとおりです。

 

・自動継続課金するタイミングは下記のいずれかから選択できます。

 ・7日

 ・1ヶ月

 ・2ヶ月

 ・3ヶ月

 ・6ヶ月

 ・1年

 

・上記の期間が経過する前に自動継続する旨のメールがユーザに送付されます。ユーザはiTunesのアカウント画面で自動継続をオフにしない限り、自動で新しい課金が発生します。

 

・課金は開始した日から◯日(又は◯ヶ月)経過後に自動課金するため、日本の携帯キャリアのサービスのように「同月内での課金」という概念はありません。したがって、課金を終了したユーザが同じ月に再度購入した場合であっても二重で課金が発生します。

活用例

・電子書籍アプリや雑誌アプリの定期購読処理
・プレミアムサービス(ただし、リジェクトされる可能性が高い)

注意点

・利用可能なアプリについて

Auto-Renewable Subscriptionsは雑誌アプリや新聞アプリの定期購読で利用されることを想定しているため、フリーミアムモデルのプレミアム会員等で利用した場合、アップルの審査でリジェクト(差し戻し)される可能性が高いようです。 当社のヘアカタログアプリ(STA-LOG)のプレミアム会員機能についてもAuto-Renewable Subscriptionsで実装してAppStoreへ公開しようとしたのですが、上記理由によりリジェクトされたため、最終的にはConsumable(消費型)で実装し、サーバ側で課金状態を保有することにしました。 しかしながら、クックパッドのプレミアム会員やナビタイムのプレミアムコースで利用されていることが確認できるため、審査の基準はまちまちのようです。

 

テスト環境(サンドボックス)について

アプリを開発してAuto-Renewable Subscriptionsのテストを実施する場合、実際の課金期間(1年など)では長すぎるため、短い期間でテストできるようにアップルが課金用のテスト環境(サンドボックス)を用意してくれています。 
(参照:http://d.hatena.ne.jp/iRSS/20111028/1319763704) しかしながらこのテスト環境の仕様が非常に不明瞭で、予期しない動作をすることが多く、テストが非常に大変です。詳細は下記の「開発者による苦労話」を御覧ください。

 

本番環境で課金が失敗した場合

本番環境で課金が失敗して多重課金等が発生したとしても、アップルが返金に応じてくれることはほとんどありません。本番環境で処理を失敗しないよう、十分注意しましょう。

実装コード例

まとめ

iOSアプリでの課金処理はiOS SDKに含まれているStoreKitと呼ばれるコンポーネントを利用するため一見簡単に実装できそうなのですが、Auto-Renewable Subscriptionsについては時間の経過により自動で課金されるという特性があるため、テストが非常にややこしくなっています。 一応、課金テストがやりやすいようにアップルがテスト環境(サンドボックス)を用意してくれているのですが、このテスト環境の仕様が全く明らかにされておらず、手探り状態でテストをする必要があります。

 

例えば、Auto-Renewable Subscriptionsでは課金タイミングを1週間〜1年の間で選択できるのですが、サンドボックスでは短い期間でテストできるよう、3分〜1時間で自動更新が実行されるようになっています。アプリの仕様により、購入の日時や更新の日時などを自社のサーバに保管し、アプリ内で利用する等した場合、この本番とサンドボックス環境とのタイミングの違いで、非常にややこしいテストケースを用意しないといけなかったり、シビアなタイミングが要求されたりします。

 

また、課金テストする際にはあらかじめテスト用ユーザ(AppleID)を用意するのですが、同じテストユーザで何度もAuto-Renewable Subscriptionsのテストを実行していると、自動継続がうまくいかなかったり、リストアが正常に終了しなかったりすることがあります。

 

さらにさらに、課金後にAppleから送られてくるレシート情報がサンドボックスと本番で微妙に違うことがあります。サンドボックスではうまくいっていたものが、いざ本番にアップすると失敗する・・・なんてこともまれにあります。

 

さらにさらにさらに、iOSのバージョンによるかもしれませんが、iPhoneとiPadでリストア(既に自動課金しているユーザが新しいデバイスやアプリの再インストールにより購読状態を復元させる処理)の動きが微妙に違ったりします。

 

とにかく、自動課金処理が全てブラックボックスになっており、仕様が不明瞭なため、Auto-Renewable Subscriptionsを利用する場合は念入りなテストケースと失敗した場合のリカバリの手段を用意しておく必要があります。

活用事例

Auto-Renewable Subscriptionsを利用しているアプリの一部を紹介します。

 

クックパッド

産経新聞

AKB48

 

※上記は当社が開発したアプリではありません。

まとめ

課金の部分は最もバグが怖い部分です。
弊社の実績のある課金処理部品化を使用することで、通常ならたくさんの時間をかけなければならないテストや処理を効率良く安心して使用することができます。

キャリア課金(KDDI、DoCoMo、Softbank)

プラットフォーム: Android、Web

Androidアプリを提供する際の課金方法である「キャリア課金」による支払いの仕組みを構築しました。
日本の主要3キャリア(KDDI、DoCoMo、Softbank)の課金すべての構築実績があります。

サーバ設計やプログラム開発方法、テスト方法等、当社にはたくさんのノウハウがありますので、実現したいサービスや課金形体に柔軟に対応できます。

特徴

・キャリア課金の準備サポート
・実績あるキャリア課金プログラムの提供
・実績あるキャリア課金のテスト項目の提

開発経緯や開発者による苦労話

Androidアプリでのキャリア課金処理は、キャリア毎で若干の仕組みの違いや リリースまでの流れが違いあります。
そのため、経験をしてなければ構築までにとても時間がかかってしまいます。

また、課金の不具合はサービスの利用ユーザとトラブルになりやすい部分ですので、いろいろなパターンのテストを数多く実施する必要があります。
当社も最初は非常に構築に時間がかかりました。

また、予期しないデータ連携でサービスが利用不可になったこともありました。
こうした経験を踏まえて、今ではどのような課金方式でも間違いなく構築できるノウハウを 蓄積することができたと自負しています。

もちろん3キャリアすべての課金システムの構築実績がありますので、リスクを極力少なく、サービスコア機能の開発に注力することができます。

サービスへの活用例

・電子書籍の月額購読
・サービスの有料(プレミアム)課金

デモ or 利用イメージの画像

kakin

まとめ

課金の部分はサービス構築の中でも最も不具合が怖い部分です。

弊社の実績のある課金処理部品化を再利用することで、通常ならたくさんの時間をかけなければならない構築やテストを極力少なくし、サービスの開発に注力することができます。

課金はキャリア毎にリリースまでの検証方法なども違っていますが、弊社であればどのキャリアでもスムーズな構築を実現致します。

WebSocketによる双方向手書き

プラットフォーム: Android

ウェブブラウザだけを利用した手書き共有アプリケーションです。

特徴

・ブラウザ上にタッチパネルやマウスで手書きしたイメージを共有可能です。
・双方向での書き込みが可能なホワイトボードのように利用できます。

開発経緯や開発者による苦労話

ホワイトボードとWebを組み合わせた「ライブタイムボード(旧:クラウドコラボード)」の新規機能として開発しました。
開発段階で、社内の会議で使ってみたところ皆それぞれが手持ちのiPadなどから思い思いにいたずら書きを書き込みまくって、会議が変な方向に大盛り上がり。。。
本質的な会議で盛り上がればいいんですが、、、

権限機能でこの問題は解消しました。
でも、ときどき会議の息抜きに皆で自由にアイデアを書き込むなんていう使い方もありかもしれませんね。

サービスへの活用例

・SNSの新たなコミュニケーション手段として
・学校向けのコミュニケーションツールとして

デモ or 利用イメージの画像

手書き

まとめ

ITリテラシーが低い層でも簡単に使える手書きの入力は近年価値が再認識されてきています。
Webブラウザのみで利用できる手書きコミュニケーションツールを使って、多くの層に使ってもらえるサービスを展開してみてはいかがでしょうか。