Furyu
[フリュー公式]

Tech Blog

フリュー株式会社の技術ブログです

2016年05月27日

nishikawa

Java8のDate and Time APIでハマった話

はじめましてこんにちは!コンテンツ・メディア第1事業部の西川です。ピクトリンクというアプリのサーバサイドの開発をしています。 今日はJava8のDate and Time APIでハマった話をします。
ある文字列を日付型に変換したい…よくあると思います。

これを実行すると…DateTimeParseExceptionが。

ResolverStyleをSTRICT(厳密)にしているのでLENIENTかSMART(デフォルト)を指定すると動きます。

DateTimeFormatterのドキュメントを見ると

y year-of-era
u year

とあります。

eraは暦を表すのでSTRICTを指定した場合はどの暦かわからなくてエラーになっているということです。歴は日本で言うと平成、昭和などです。

単純に解決するには yyyyuuuu にすればOK。

どうしても yyyy を使いたい!という人は以下のように暦を指定させるようにする必要があります。

おまけ:SimpleDateFormatで判定を厳密にしたい場合

以下のように setLenient(false) でOKです。


2016年05月27日

Kayo

テスト環境にOpenStackを導入しました!

みなさん、こんにちは。コンテンツ・メディア第1事業部インフラ担当の藤本佳世です。 少し前になりますが、テスト系環境にOpenStackを導入しました。OpenStackを聞いたことがない方も安心して下さい。これから構築手順やTipsなどご紹介できればと思っています。今回は1回目「OpenStackとは?」についてお話ししたいと思います。今後、下記の内容をブログに投稿する予定です。

  • OpenStack構築手順
  • ネットワーク設定  ※高可用構成やFloatingIP割り当てなど
  • 仮想マシンの起動や管理について  ※イメージやフレーバーの作成など
  • セキュリティグループについて ※追加や削除方法など
  • つまずいたこと

What is OpenStack?

OpenStack とは、簡単に説明すると、プライベートクラウド環境でAmazon Web Services(以下AWS)のようなものを構築可能にしたソフトウェアです。AWSを使ったことがない方に向けて、もう少し詳しく説明すると、OpenStackを使ってプライベートクラウド上に仮想サーバやネットワーク、ストレージなどを構築することができます。そして、それら作成したものはダッシュボードの Web インターフェースから管理することができ、GUI上で簡単に仮想サーバを構築することができます。
その他にもOpenStackは、DockerやAnsibleなど構成管理ツールとも連携することができ、より効率よく短時間で用途にあったサーバを構築することができます。

OpenStack導入でサーバ構築時間を短縮

openstack導入1

openstack導入2

OpenStackを導入することにより、サーバの構築時間を今まで以上に短縮することができました。開発メンバーから、「新技術の検証環境として新しいサーバが欲しい」や「新しいサーバを購入するほどではないけど、検証用にサーバが欲しい」など要望があった場合、今までサーバが届いてから3時間ほどかかっていた構築作業が、10分以内で可能となりました。構築が早くなったことで、開発メンバーを待たせることなく、気軽にサーバ構築依頼をしてもらえるようになりました。

7つのコンポーネント

OpenStackは7つの機能から構成されます。

  1. Nova (仮想マシンの提供と管理を行う)
  2. Keystone (ユーザー認証・管理を行う)
  3. Horizon (Webブラウザ経由で管理・操作できるGUIコンソールを提供する)
  4. Glance (仮想イメージの管理を行う)
  5. Cinder (仮想マシンが使用するストレージ管理を行う)
  6. Neutron (仮想ネットワークの管理を行う)
  7. Swift (クラウドストレージを提供する)

OpenStack構築内容

ホストOS: Ubuntu14.04LTS (8台構成), OpenStackバージョン: Liberty

  • サーバ1:Nova,Keystone,Horizon,Glance,Cinder
  • サーバ2:Nova,Keystone,Horizon,Glance,Cinder
  • サーバ3:Nova,Glance,Cinder
  • サーバ4:Nova,Glance,Cinder
  • サーバ5:Nova,Glance,Cinder
  • サーバ6:Nova,Glance,Cinder
  • サーバ7:Neutron
  • サーバ8:Neutron

※Swiftは未検証

ホストOSのUbuntuインストールは、前回ご紹介したPXE機能を使って構築しました。
前回の記事はこちらへhttp://tech.furyu.jp/blog/?p=3858

次回は、各コンポーネントの説明と構築手順をご紹介したいと思います。


2016年05月26日

araki

Google Tag Manager でモバイルアプリのABテスト -ウェブテストの目的-

コンテンツ・メディア第1事業部の荒木です。ピクトリンクというアプリのAndroid版を作っています。今回は、Google Tag Manager(以下、GTM)でAndroidアプリのABテストを効果的に行うためにウェブテストの目的を設定します。ちなみに今回の記事の内容は、Androidアプリに限らずiOSアプリでも使えます。

GTMによるモバイルアプリのABテスト開始方法については、前回の記事(Google Tag Manager でAndroidアプリのABテスト -ABの出し分け-)を参照してください。

設定の概要

ウェブテストの目的は、各パターン(Aパターン、Bパターン)の優劣判定に使われます。GTMは、ウェブテストの目的を基準にして各パターンの優劣を判定します。GTMの「Google アナリティクスのウェブテスト」変数の編集画面から目的を設定することができます。

ウェブテストの目的

デフォルトでは、スクリーン数、セッションの長さ、例外数、クラッシュ数の四つから選ぶことができます。たとえば、スクリーン数をウェブテストの目的に設定していると、Google Analytics(以下、GA)で送信したスクリーン数が多いパターンが優秀と判定され、クラッシュ数を目的に設定していると、クラッシュ数が少ないパターンが優秀と判断されます。

GAの目標を作成する

さて、ここで特定ボタンのクリックイベントが多いパターンを優秀と判定したい場合を考えてみましょう。カスタムの目的を設定するには、GAの目標を利用します。GAにログインし、「アナリティクス設定」タブの「目標」を選択してください。このとき、アカウント・プロパティ・ビューがGTMのウェブテストと連携していることを確認してください。

GAの目標を選択

目標の設定画面に遷移したら、「+新しい目標」ボタンから目標の作成を開始してください。目標作成は「① 目標設定」「② 目標の説明」「③ 目標の詳細」の3ステップで実施します。

① 目標設定

「テンプレート」と「カスタム」から選びます。テンプレートは、プロパティ設定で指定されている業種で一般的に目標に設定されるものの候補を表示してくれるので、これから何を目標とすべきかわからないときに参考にしてください。今回は特定ボタンのクリックという目標がすでに決まっているので、「カスタム」を選択します。

② 目標の説明

ここでは、目標の名前とタイプを設定します。タイプとは目標の達成基準に関わるもので、全4種あります。以下は、各タイプの目標達成基準です。

  • 到達ページ:特定スクリーンへ到達したか
  • 滞在時間:滞在時間が設定した時間より長いか
  • ページビュー数 または スクリーンビュー数:1セッションあたりのPV数またはスクリーン数が設定した数より多いか
  • イベント:特定イベントが送信されたか

今回は、ボタンのクリックイベントを目標としたいので、「イベント」を選択します。

目標の説明

③ 目標の詳細

ここでは、 ②で選択した目標タイプごとの詳細設定を行います。今回は、イベントの目標詳細を設定します。イベントの詳細設定では、GAイベントのカテゴリ、アクション、ラベル、値についてそれぞれ条件を設定することができます。カテゴリ、アクション、ラベルは「等しい」「先頭が一致」「正規表現」で一致条件を設定します。値については、「超」「完全一致」「未満」で条件を設定できます。ここで設定した条件が全て満たされた場合に、目標達成となります。なお、空欄の条件は無視されます。

目標の詳細

GAの目標を目的に設定する

GAの目標作成が完了したら、GTMの設定に戻ります。「Google アナリティクスのウェブテスト」変数の編集画面で設定できるウェブテストの目的に、先ほど作成したGAの目標「特定のボタンをタップ」が追加されています。これを選択すれば、ボタンのクリック率が良いパターンが優秀と判定されるようになります。

GAの目標をテスト目的に

テスト結果の確認

テスト結果の確認は、GAで行います。GA左サイドメニューの「行動」→「ウェブテスト」から、ウェブテストの進捗や結果が確認できます。ウェブテストの目的で設定した基準の達成率(コンバージョン率)を元に、各パターンの優劣が判定されます。GTMの設定によっては、テスト終了時に成果の高いパターンに自動で固定したり、テスト中に徐々に成果の高いパターンに移行していくということが可能です。

ウェブテストの結果

おわりに

ウェブテストの目的を適切に設定することで、ユーザーの動向にリアルタイムに追従して、より適切な画面を出せるようになります。みなさんもウェブテストの目的を設定して、よりユーザーに楽しんでもらえるようなアプリを作りましょう!

以上です。


2016年05月23日

sakata

JJUG CCCにて「Seasar2で作った俺たちのサービスの今」というセッションで登壇しました #jjug_ccc #ccc_gh6

Hello world! コンテンツ・メディア第1事業部のjyukutyoこと阪田です。

5/21(土)に開催されたJJUG CCC 2016 Springにて登壇しました。「Seasar2で作った俺たちのサービスの今」というセッションです。
登壇のいきさつはこちらに書いています。

JJUG CCC 2016 Springで登壇します!

そして、スライドはこちらです。

Seasar2で作った俺たちのサービスの今 from Koichi Sakata

私の感想/思い

技術の解説ではなく実際のサービスの設計判断や詳細を話すというのは、自分のすべてをさらけだす感じがします。私のこのセッションが、弊社フリューの技術レベルの基準になるとも言えます。
もちろん私は天才プログラマーではなく、知らない知識や誤った判断などがあります。それでもこうして発表することで、そうした部分を教えていただき、改善へのアドバイスをいただくことができました。大切なことは、そうした知識を得て私自身の能力が向上すること、そしてサービスがよくなることですから。

私の部署のアプリケーションは、利用者数も1,000万人を超え、決して小さくないサービスです。精鋭エンジニア集団というよりは、向上心はあるけれども、私を始めある種普通(定義が難しいですが)のエンジニアが集まったチームです。そんな状況でも四苦八苦しながらこのレベルのサービスを運用開発できるということも伝えたかったことです。

私の思い

Twitterやブログで感想もたくさんいただくことができました。Twitterではハッシュタクグ「#ccc_gh6」に主に集まっています。「理想ではなく現実解で進んでいること、メンバーのことを考えながら進んでいることに共感できた」という言葉を多くいただきました。私が伝えたかったのは、技術的方法論ではなく、ベストな正解などはなく、自分の置かれた背景、コンテキストに合わせて、よりベターな方法を探りながら進んでいくしかなく、多くの誤りをしながらもそこからフィードバックを得て誤りを直し進めばいいということでした。

エンジニアは論理性や一貫性の能力が高いですから、システムやアプリケーションの今の状況、つまりスナップショットを見て、「ダメ!」という判断を下してそれで終わらせることがあります。でもシステムやサービスには時間軸があります。時間の経過とともに変化していくものです。もちろん置かれている状況によっては、契約や納品など簡単には適用できない現場もあるかとは思います。ただ、そんな中でも時間軸があり、「終わっている!」というときでも今から変化させていくことができます。

CCC自体の感想

私が聴講した他のセッションについては、別のエントリで書きたいと思います。ここではCCCというイベント全体についての感想を書きます。

今回のCCCは登録者数1,200名以上、実際の参加者も800名以上とのことでした。私も関西Javaエンジニアの会(関ジャバ)の会長という立場ではありますが、スケールが違いすぎます。CCC1回の会場費も200万円!JJUG会長である鈴木さんのスライドに記載があります。

これだけのイベントを運営するJJUG幹事、スタッフの方はとても大変だと想像します。これを年2回開催されていることに頭が下がります。

関西から参加されている方も10名以上はおられました。私が知っている方だけでその人数ですので、実際はもっと多いでしょう。次のCCCは秋頃に開催されますので、ぜひみなさんにも参加をお勧めいたします!


2016年05月18日

SatoKeita

ハッカソン(SPAJAM)の大阪予選で最優秀賞をいただきました

初めまして、フリュー佐藤、こと、ジョンです。 安心してください、普通の日本人です。

普段は「ピクトリンク」のサイトの開発、運用しており、サーバサイドの開発を行っております。

今回はSPAJAM2016 大阪予選に参加したことを書きたいと思います

SPAJAM2016とは

http://spajam.jp/

スマートフォンアプリジャム2016、2日間でスマートフォンアプリを開発するハッカソンイベントです。

spajam6

全国で予選があり、本戦が温泉地で行われます。本戦には、各予選での最優秀賞の9組、各予選の優秀賞の中から2組、学生枠で1組が本戦に参加することができます。

SPAということで温泉に浸かり、頭をリフレッシュしながらの開発です。 素晴らしいですね。

本戦で優勝するとシリコンバレーツアーがプレゼントされます。 素晴らしいですね。

SPAJAMに参加する前準備

チームはプログラマ3人、デザイナー1人、プランナー1人という構成でした。 プログラマは業務で画像処理をメインにやっていた2人と、僕でした。

つまり、圧倒的なスマートフォンアプリ開発者不足。逆に言えば、これからどうやって開発していこうかと考える幅がありました。

……いや、正直言ってそんな暇はありませんでした。出場が決まってから当日までは2週間ほどです。

とりあえず手持ちの環境で、かつ、ネイティブアプリ作成ができそうなものということでAndroidのネイティブ開発にしました。Androidの開発は弊社でも行われていたため、その人達に教えてもらいながら勉強をしました。

全員ハッカソン自体にも出たことがないので、半日での模擬ハッカソンをしてみました。

ハッカソンの結果、様々な課題が見えてきました。

僕の方から、開発環境として以下のものを勧めてみました。

  • バージョン管理システム:Git

ブランチの切り替えが早い。また、githubを使うとレポジトリが無料で使えるのでcodeの共有も簡単。

  • 統合開発環境(IDE):Android Studio

Googleが提供しているIntelliJがベースとなっているIDE。弊社Android開発でも使用しているため、ノウハウはある。

  • Slack

無料で使えるコミュニケーションツール。チャットも使え、ファイルの共有もできる。また、Mac、Windows関係がなく使うことができる。

しかし、他のメンバーは、他の開発環境(svnやVisual Studioなど)を使っており、馴染みがなく、僕もきちんと説明している暇もなく、あまつさえAndroidに関しては僕も詳しくないので、お世辞にもスマートな開発ではありませんでした。

ハッカソンの結果を踏まえ、2週間ほどで得た付け焼き刃立派な知識の中で、結局このチームで何ができるのか、できないのかを考えました。

結果、ツールは触りながら覚え、それにプラスして、チームでのカラーを出せるように、画像処理を使ったアプリが開発出来るように環境を整えることで、本番を迎えようと決めました。

模擬ハッカソンはやっておいて本当に良かったです。本番で起こりえそうな問題(proxy、ソースコードの競合などの技術的問題から、プレゼンでの発表形式、画像の共有のしかたなどのハッカソンの進め方まで)について身をもって体感できたからです。

大きなディスプレイとmac miniをキャリーカーに詰めて出発です。(僕だけ

SPAJAM当日

予選会場はYahoo!JAPAN大阪でした。27階という高層。

spajam風景1

高所恐怖症の人はまずそれとの勝負(僕だけ

今回のテーマは、「おでかけを楽しむ」でした。

アイデアソンでは、たくさんのアイデアが出てきましたが、チーム内ではこれだというアイデアは出てきませんでした。15時まで考えつづけましたが結局はいいアイデアが出ず、当初の予定である画像処理を使ったアプリを考えるようにしました。

役割分担は以下です。

  • 僕: UIまわりの組み立て
  • プログラマ他二人: 画像処理部分を作成
  • プランナー: アプリの仕様、その見せ方
  • デザイナー: 発表資料やアプリに必要な画像の作成

UI周りについてもいろいろ考えたりしていました。

spajam2

時間がないうちにどれだけ完成に近づけるか、プレゼンで発表される部分を意識して作成をしていきました。

spajam7

最終的には各自、自分の担当範囲だけではなく、今何が足りていないのか、時間が決まっているなかで、何ができて、何ができないのかを考え行動していけていました。

成果物について

今回作成したアプリは以下です。

パシャ男

「お出かけを楽しむ」ため、お出かけ中にライブでアルバムを埋めていくアプリとなっています。

spajam4

レイアウトを決めて(プレゼンテーションの時は全部同じレイアウトでした。

Screenshot_2016-05-15-18-07-54

カメラアイコンをタップすると写真がとれます。また、動画を撮影することができます。

Screenshot_2016-05-15-18-08-04

しかし、パシャ男の本気はこれだけではありません。写真を取る際に通行人を消すことができるのです。

これがプレゼンテーションでは大きく反響を得られました。

結果

大阪予選計12チームがあり、僕達のチーム以外にも、他のチームのアプリもとても魅力的なものが多く、SPAJAMのレベルの高さを感じました。また、学生のスキルの高さにも驚かされました。

しかし、そんな中、僕達のチームはプレゼンテーションを完璧にこなすことができ、結果

最優秀賞

をいただくことができました。

OLYMPUS DIGITAL CAMERA

総評としては

  • 画像処理などの技術力が光っていた
  • アプリのUI部分で完成度が高かった
  • アイデアについては他の優秀賞とも比べると少し弱かった

とのことです。これを次の本戦で活かしていきたいです。

まとめ

ここまでで説明させていただいた通り、アプリ開発をやったことのないメンバでもアプリを開発することができました。また、アプリ開発においては秀でた知識は無いですが、それを他の知識でカバーして、最優秀賞をいただくことができました。

本戦は、7月2日(土)〜7月4日(月)です。それまで、今回受けた刺激や、面白いと思ったアイデアをどうやれば実現できるのかという部分まで落とし込んで、実装力を上げて行きたいと思います。

この記事を読んだ方で興味がある方、まだ、予選の応募ができる箇所がありますのでぜひ申し込んでみてください!