Diverse developer blog

株式会社Diverse(ダイバース) 開発者ブログです。

デーティングサービスの中の人としてインターンしてきた話

こんにちは。この度インターン生としてPoiboyチームでお世話になりました、id:teakunです。
今回はこの6週間のインターンで取り組んだこと、インターン生から見たDiverseの環境、そして、デーティングアプリについて感じたことについて紹介します。
写真は右が私で、左がこのインターンを同じDiverseで過ごしたid:mktakuyaxくんです。彼のブログ記事も、私と同じタイミングで公開されるはずなので、是非そちらもよろしくお願いします。


f:id:teakun:20160923143547j:plain

参加の経緯

今回私が参加したのは、こちらのインターンです。
mixi.co.jp

ミクシィグループのインターンでは応募時に、部署の希望を決めることができます。普段iOSアプリの個人開発をしていることもあり、iOS開発がやりたいと人事の方に言ったところ、提案された部署がDiverseのPoiboyの開発チームでした。正直なところ、デーティングアプリということで始めは渋ったのですが、とにかくiOS開発がやりたかった私は、どんなアプリでも結局開発することは同じと腹を括って、Poiboyでインターンに参加することを決めました。

参加にあたっては現場の社員との面接があり、「デーティングアプリへの偏見はありませんか?」と何度か質問されたのですが、ちょっと嘘つきました。すいませんでした。これを書いている今現在は、何一つ偏見なくデーティングアプリを楽しめるようになっています。このあたりのことはまた後から書きます。

Poiboyについて

Poiboyは"ポイして恋するコミュニケーションアプリ"とある通り、女性が男性を"ポイ"(LIKE)することでコミュニケーションが始まるデーティングアプリです。男性は、プロフ写真や自己紹介を充実させ、女性からポイされるのを待つことになります。私も参加にあたって実際に自分でも使っているのですが、やはり女性にポイされるのは嬉しいものですね。
poiboy.jp
詳しくは、こちらの説明がわかりやすいです。


Poiboyは今年の2月にリリースされたサービスで、iOSのアプリはすべてSwiftを使って書かれています。そのため、大昔にObjective-Cで書かれたコードなどに悩まされることなく、開発にスッと入ることができました。また、開発に当たってはGitlabやDeployGateなどのツールが利用されており、バージョン管理やデバッグの環境が非常に整っていて、我流で進めていた個人開発との違いをひしひしと感じます。

インターン期間中にやったこと

インターン期間の流れ

8/16-9/23の約6週間の参加期間の過ごし方として、社員の方に提示された6週間の流れはこのようなものでした。

  • 1週目 環境構築と簡単なバグ修正で開発フローに慣れる
  • 2週目 少し大きめのタスクでもっと開発フローに慣れる
  • 3-5週目 画面1つを丸々改修するような大きいタスクに取り組む
  • 6週目 このブログを書いて6週間をまとめる

またこれらに加えて、毎週Qiitaに記事を上げるという課題が課されました。普段アウトプットをしていなかった私にとっては、なかなかつらかったです。

意識したこと

私はどこかの企業や団体に属したことがなく、小規模な個人開発しかしたことがなかったため、チーム開発をするのは初めての経験でした。それを踏まえて、インターン期間中に私とメンターさんとの間でこれをやって帰ろう!といって具体的に意識して取り組んだことは以下のようなものです。

  • Gitのフローを学ぶ
  • コードレビューをできるようになる
  • MVCフレームワークの概念を理解する
  • スケジュールを意識した開発をする

中でも、スケジュールは特に強く意識して取り組んだ部分でした。これはチーム開発だけに限らず、どんな事にも通じていることだと思うのですが、しっかり予定を立てずに作業を取り組み始めることはとても非効率です。一人で作業していると、ついつい横道にそれてしまい、当初の予定とは違う作業に入ってしまったりするのですが、チーム開発ではそうはいきません。今週はこのバージョンを出す、この頃にはiOS10が出るから準備しなくては、といったようにしっかりと現実を見て準備をする必要があります。また、Poiboyではコードを書くエンジニアだけではなく、デザイナーさんや企画の方など、多くの人や要素が密接に関わり合って進めていくことになるので、自分のスケジュールだけでなくチーム全体の状況を把握することの大切さを感じました。

インターン期間の成果と得たもの

実際に作ったもの

Poiboyにはグループ機能と呼ばれる、女性がお気に入りの男性をグループとしてまとめる機能があります。そのグループ機能の画面を改修することが、今回の私の最も大きなタスクでした。実際に私が作った画面はこのようなものです。

before

f:id:teakun:20160923174855j:plain:w300

after

f:id:teakun:20160921142203j:plain:w300

改修とは言ってもこのレイアウトは私が考えたものではなく、デザイナーさんに用意していただいたものです。確かにbeforeと比べるとグループの画像やview数の追加など、情報量は充実しつつも、うるさくない画面になりました。

稼働中の大きなサービスのコードを読む機会は個人開発をしているとなかなかない機会なので、コードを読んでいるだけでも勉強になります。自分の作ったコードだけを読む個人開発とは異なり、他人が作った膨大なコードをしっかりと把握しなければならず、その点に苦労しました。ついつい時間をかけて読んでしまうので、そこは反省です。大まかな部分はすぐに作り上げることが出来たのですが、そこからのレビュー、修正の作業が難航しました。普段一人で開発を進めていると、多少レイアウトが崩れてしまってもとりあえず動くからそれでいいか、と言った風になりがちなのですが、そういった妥協は一切ありませんでした。

社員の皆さんのレビューは的確で、どんな些細な部分でも冗長なコードやアプリが落ちる可能性のあるコードを書いてしまうと、ビシバシとマサカリが飛んでくるエキサイティングな環境でした。私も社員さんのコードをレビューをさせてもらいまして、まだまだ社員さんの指摘からは程遠いですが、ネストが深くならないような書き方や、メソッドが呼ばれるべき場所はどこなのか、などなどなんとなくコツを掴めたかなと思います。やはりこのような経験は、実際の業務ならではの経験でした。この経験はこれからの自分の開発にも活かして、妥協のないコードを書くようにしようと肝に銘じました。

チーム開発

参加期間中のPoiboyのiOSクライアント開発はインターン生の私を含めた3人で進めました。基本的には

  1. コードを書く
  2. プルリクを出す
  3. レビューを受ける
  4. 修正(2~4をLGTMが出るまで繰り返し)
  5. マージ

と言った流れで作業を進めていました。これまでGitについては簡単なコマンドを知っているくらいでほとんど使った経験がなかったのですが、6週間みっちりと指導を受けて、自分の作っているコードをGitでしっかり管理するようになるまでに成長しました。ちなみに、私がこのインターンに来てはじめに教えてもらったことは、「コミットメッセージは文頭を大文字にした方が分かってる感が出る」ということでした。

また、画面の改修にあたってはデザイナーさんと協力して進めていくことが多くありました。
UIのガイドラインやUIのパーツが、お願いしてからすぐにササッと仕上がっているので、デザイナーさんは凄いなと思わずにはいられません。

Qiita

私がインターン期間中に投稿したQiitaの記事については以下の通りになります。
qiita.com
qiita.com
qiita.com

アウトプットする習慣を付けようということで始まったQiitaへの投稿でしたが、普段あまりアウトプットする機会のない私にとっては、なかなか慣れない作業でした。書いた内容は、業務の中で自分がつまずいた部分をまとめた部分と、もっとPoiboyを良くするためにはこういう部分に気をつければいいのでは、という内容をまとめたつもりです。また、投稿した内容にタイポがあって編集リクエストが来て修正されるということがあり、エンジニアのコミュニティの優しさに触れたような気がしました。メンターさんからも知らなかった〜と言って頂けた部分もあり嬉しかったので、これからも継続してアウトプットを続けていこうと思いました。

デーティングアプリ

インターン前に思っていたこと

デーティングアプリは所謂、出会い系と呼ばれるものです。出会い系、といって皆さんはどのような印象を持たれるでしょうか。正直なところ良い印象を持っている人はなかなか少ないように思います。サクラが横行しているんじゃないか、変な商材を売りつけられるんじゃないか、実際合ってみたらカツアゲされるんじゃないかなどなど、怖い、危ない、という風に考えている人も少なくないのではないでしょうか。私もこのインターンに来るまでデーティングアプリに対して、あまり良い印象はありませんでした。しかし、実際に中の人として働いてみて、その考えが偏見に満ちていたものであると知ることになります。

インターンが終わってみて感じること

インターン中は、Poiboyだけではなく同じDiverseの別のものや、他社のデーティングアプリなど色々な種類を使ってみて、デーティングアプリが実際にどのようなものであるかを学んでいました。
これは、どれを使ってみても感じたことですが、「デーティングアプリを使っている人はみんな普通」なんだな、と思うようになりました。これは、既に利用している人からしたら当然の事なのかもしれませんが、使ったことのない私からすると拍子抜けでした。大体のデーティングアプリではマッチするとメッセージ交換ができるようになるのですが、普段やり取りをしている友達かのように趣味や仕事の話をできるので、こんな優しい世界があったのかと驚きでいっぱいです。

私は理系の大学院生をしていて、「女の子と知り合う機会がない」「一緒に遊びに行ける友達が欲しい」といった嘆きの声を多く耳にします。そういった人たちにデーティングアプリを是非勧めたいです。デーティングアプリは、一歩踏み出すまでのハードルが高いです。自分の顔写真をアップロードすることに抵抗のある人や、自分のプライドが登録を許さない人もいるでしょう。でも、その一歩を踏み出すことで新しい出会いがあるかもしれません。

その他インターンをしていてよかったこと

リアルイベントに参加した

私がインターンに参加している間、PoiboyではNON STYLEの井上さんとのコラボ企画が行われていました(これを書いている現在も真っ最中ですが)。
その中でも一つの大きなイベントとして、井上さんが「3分間で何名とツーショットが撮れるか」という世界記録へ挑戦するというイベントがあり、インターン生ながら見学として参加させて頂きました。
イベントの結果はこの記事によく書かれています。
www.oricon.co.jp
残念ながら記録達成とは行きませんでしたが、会場は非常に盛り上がり、多くメディアにも露出したようで、とても面白かったです。
また、司会の方と井上さんが私がこれから改修する予定の機能についてトークされていたり、実際のPoiboyを利用しているユーザさんがたくさん集まっていたりなど、自分が携わっているサービスの規模の大きさを感じ、身が引き締まったことを覚えています。

他のインターン生との交流

ミクシィグループのインターンではそれぞれ部署は異なりながらも同時期に参加しているインターン生が20名ほどおり、インターン生同士の交流が盛んでした。毎週、人事の方がインターン生同士が集まる機会を用意してくださって、それぞれの部署での話や、自分が今抱えているタスクについて話し合うような機会がありました。
ミクシィほどの大企業となると、集まってくるインターン生はとても優秀な人たちばかりで、一緒にご飯に行ってもすぐに技術の話になったりと、刺激的な毎日を過ごしました。もう既にTwitterの学生エンジニア界隈でブイブイ言わせている有名人もいたので、彼らに負けないように良いプロダクトを作って名声を上げていきたいです。

f:id:teakun:20160921160624j:plain:w300


私はこのインターン中に誕生日を迎えたのですが、インターン生の皆に祝っていただきました。できるエンジニアは幹事も完璧にこなすのかと感動しました。奥の方にチョコで書かれた文字はさておき、とても嬉しかったです。ありがとうございました。

東京で働くことのイメージができた

私は滋賀生まれ滋賀育ちの生粋の滋賀県民で滋賀を離れたことがなく、東京は恐ろしいところなんじゃないかと思っていましたが6週間過ごしてみて、意外と過ごせるな、という感覚を得ました。この業界で働くためには、東京は避けて通れない道だと思っていたので、この感覚を持てたことは非常に良かったです。インターン中の宿泊先はミクシィの方が無料で宿泊先を手配してくださり、非常に快適でした。これで遠くから参加するインターン生も安心ですね。実際インターン生は北海道から沖縄までいろんな地方から集まっていたので、これからインターンを考える人にはオススメします。

反省

ここまで良いことばかりを書いてきましたがいくつか反省もあるので、そこについても触れておきます。

作業途中でインターンの最後を迎えてしまった

これが今回のインターンの中で一番反省しているところです。しっかりとレビューを受けてマージされるまで、自分のコードは責任を持ってやろうとメンターさんから何度か話がありました。にもかかわらず、中途半端に進めたタスクを残してインターンの最終日を迎えてしまうことになり、非常に反省しています。インターン中は毎日一日のスケジュールを建てて無意味に時間を消費したりすることはなかったものの、本来かけるべきではない場所に時間をかけてしまうなど、時間配分の部分で失敗があったので、この反省を今後に活かしたいです。願わくば、道半ばで残された私のコードがメンターさんの手によってマージされリリースされることを祈ります。

時間の使い方

上でも少し書きましたが、もっと効率よく作業を進めることができたんじゃないかなと思う部分が多くありました。普段使うツールからしてもXcodeさえ入れたら開発始められるしオッケーと考えるのではなく、より効率よく作業を進めるための準備をしっかりとしておけば、長い目で見たときに大きな差がつくと思いました。メンターさんからこういうツールがいいよ、と教えていただいてインターン中盤で一度環境を整え直しましたが後の祭りだったので、初日にガッツリ時間を使ってでも整えるべきだったと今になって反省しています。
また、ミーティングやレビューなど想定外のタスクが突然降ってくることがあってバタバタしてしまうことがあったので、そういう部分を加味してスケジュールを考えておけばよかったです。

最後に

これを読んだ人にいいたい

新しい出会いが欲しい人、気にはなってたけど使わずにいた人、是非デーティングアプリを使ってみましょう。オススメはもちろんPoiboyです。

感謝

最後になりましたが、株式会社ミクシィ、株式会社Diverse、インターン生、そしてインターン中にメンターとしてお世話になったid:cfikenさんを始めとするPoiboyチームの皆様、6週間と短い間でしたが本当にありがとうございました!!
この経験を大きな糧に、エンジニアとしてもっと成長していきます!!!

GithubでSlackのカスタム絵文字を表示する方法

こんにちは!

Diverse 結婚支援事業部 アプリエンジニアの @yuta-fujita-dvs です!


みなさんはSlackのカスタム絵文字大好きですか!?
みなさん大好きということで、今回はGithubでカスタム絵文字を表示するChrome拡張を
作りました!

何を作ったの?

f:id:yuta-fujita-dvs:20160808195823p:plain
これが

f:id:yuta-fujita-dvs:20160817164529p:plain
こうなります。


これを見たあなたはホッコリとした安らぎが得られるているのではないか・・・と思います。

ソースコード

GitHub - SAMUKEI/emoji-chrome


インストール方法はREADMEを参照ください。
フィードバック大歓迎です!

困ったこと

Chrome拡張の実装時に困ったことと対処内容をまとめます。
今後Chrome拡張を作成する際に参考にしてください!

Chrome拡張で外部リソースにアクセスできない

原因

一般的に外部リソースの画像を表示する際には、

<img src="http://hogehoge.com/hoge.png">

のように記載すると思いますが、Chrome拡張においては外部リソースへのアクセスは
Content Security Policy に違反するためできません。

対処方法

公式ドキュメント の解決策を参考に、XMLHttpRequestを利用する必要があります。

対応例

GitHub - SAMUKEI/emoji-chrome
content.js

    var xhr = new XMLHttpRequest();
    xhr.open('GET', emoji[match], true);
    xhr.responseType = 'blob';
    xhr.onload = function(e) {
      var src = window.URL.createObjectURL(this.response);
      $("#" + _id)[0].src = src;
    };
    xhr.send();

    var img = "<img id=\"" + _id + "\" width=\"32\" height=\"32\" />"
    console.log("img = " + img);
    return img;

Chrome拡張でリアルタイムに画面更新されない
(Issue投稿の直後の絵文字が変換されない)

原因

GithubではIssue投稿、Issueへのコメント投稿などの画面の更新(F5)が行われません。
そのため、$(document).readyではキャッチできません。

対処方法

こちらのQiita記事のように通信をキャッチし、
キャッチしたタイミングで処理を行うことで実現可能です。

対応例

GitHub - SAMUKEI/emoji-chrome
manifest.json

  "permissions": [
    "webRequest",
    "http://*/*",
    "https://*/*"
  ],

background.js

chrome.webRequest.onCompleted.addListener(
  function(details) {
    chrome.tabs.query({
      active: true,
      windowId: chrome.windows.WINDOW_ID_CURRENT
    }, function (result) {
      var currentTab = result.shift();
      chrome.tabs.sendMessage(currentTab.id, details, function() {});
    });
  },
  { urls: [ "<all_urls>" ] },
  [ "responseHeaders" ]
);

content.js

chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
  // 通信完了時の書き換え
  replace();
});

今後(いつか)の改修したいこと

  • キー入力時にサジェストから絵文字選択可能に
  • 速度面が不安なので速度改善など(未計測なので速度計測も)

お約束

 
 

『Androidオールスターズ2』に登壇しました

はじめまして。
株式会社DiverseでYYCのAndroidアプリの開発をしている id:kikuchy です。

f:id:t-amano:20160809173121j:plain

先日開催されました Androidオールスターズ2 に登壇させていただきましたので、この場を借りて報告させていただきます。

eventdots.jp


発表内容

『なるべくコードを書かないAndroid開発』という題でお話させていただきました。

YYCチームでは昨年から今年にかけて、Androidアプリをフルスクラッチでリニューアルするということを行いました。
その際にaptとKotlinを用いてエンジニアが管理すべきコードの削減を行ったので、そこで得たaptとKotlinの知見を元にお話させていただきました。


Q&A

懇親会でいくつか質問を頂いたりしたので、ご紹介します。

Kotlinの導入はどれくらい簡単?

既存のJava + Gradleで作っているプロジェクトがあって、開発IDEにAndroid Studioを使っているのであれば非常に簡単です。
Kotlin公式のドキュメントをご覧ください。ワンコマンドで解決します。

kotlinlang.org

また、KotlinからJavaのコード呼び出すのも、JavaからKotlinのコードを呼び出すのも、通常のJava/Kotlinのコードを呼び出すのと全く変わらない手軽さです。
Bridging-Header的なファイルを用意しなくても良い分、Swift <-> Objective-Cの相互運用よりも簡単だと思います。

ですので、新規に作成するクラスからはKotlinで書き始め、段々Kotlin比率を増やしていく、といったスタイルがおすすめです。
(私達、YYC Androidチームもこの方法を取りました)

チーム開発の際に新しい言語を導入するのは大変ではなかったのか?

以前にShibuya.apkという勉強会でお話させて頂いたことがあります。


自分が社内エバンジェリストになる感じで、新しい言語を学ぶことは楽しい、とメンバーに思ってもらうことが大切だと思います。

Kotlinのデメリットは?

まだ成熟していない言語ですので色々つらいところがありますが、代表的なものをいくつか。

  • コンパイルが遅い
  • AndroidのDataBindingとの相性が悪い
  • kapt (Kotlinのapt) を使うとコンパイルが更に遅くなる & kaptの設定を間違えると不具合が出ることがある

aptのデメリットは?

  • コンパイルが遅くなる
  • Javaのメタプログラミングの知識を(多少)要求される

生成しようとするコードによっては TypeMirrorElement の扱いを要求されることがありますが、その程度だと思います。
(作ろうとするものによりますが…!)


会の雰囲気

他の登壇者の方の発表についてはブログの主旨から外れますので、ここでは書きません。
公開できる登壇者は #eventdots ハッシュタグを付けてスライドを公開しているはずですので、探してみてください。

登壇者の方々はもちろん、聞きに来てくださっていた方々もAndroid開発界隈では有名な方がいらっしゃって、セッションだけでなく懇親会でも、とてもレベルの高いお話を聞くことができました。

全体的になごやかな雰囲気で、懇親会の話も弾み、会場が閉まる直前まで多くの方が残られていました。

主催のdots. 小沢さんから「また来年も開催します!」というお話があったので、来年も開催されたら参加したいと思います。


さいごに

実は私自身、Android開発を始めて1年と少ししか経っておりません。
かなりがむしゃらにやって来ましたが、そのがむしゃらなやり方を許容してくれる環境がDiverseにはあります。

自分を急成長させたいあなた、ぜひDiverseへ!

Diverseに新卒で入社して感じたこと徒然

はじめまして.

Diverse VEAT Product teams でサーバサイドやらせてもらっている@akehata-dvsです.

新卒で株式会社ミクシィに入社して,出向という形でDiverseで働かせてもらっています.

入社してから三ヶ月が経ち,これまでのことを書いていこうと思います.

f:id:t-amano:20160802150354j:plain

入社1日目,入社式に遅刻する

人事に怒られました.以上も以下もありません.この話はこれで終わり.

研修,配属まで

研修では主に社会人としての仕事に取り組む姿勢であったり,基本的なマナーをであったりを叩き込まれました.

技術的な面に関しては、「各部署によって求められているものが違う」という理由で、新卒エンジニアとして横並びで受ける研修はほとんどなく、入社2週間後には各部署で OJTが始まりました.

この辺りのスピード感はさすが大手ベンチャーだなぁと感じました.だらだらと意味があるのかどうかよく分からない研修を受けさせられると辟易としてしまう性格なので,この辺りは本当にありがたいと思っています.

配属後

配属先は動画デーティングアプリのVEATのチーム(VEAT Product teams)でした.

(VEATに関してはこちらのプレスリリースを参照ください)

やったこと

  • 一部のボーナス系のTask実装

  • 管理ページの実装,要望対応

    • ユーザ検索,検閲,その他
  • Capistrano導入

  • いくつかAPIを実装

  • Push系施策いくつか

業務用のソースを書くことの難しさ

VEATはフレームワークにRailsを採用しています.

自分は大学時代にある程度Railsについて勉強していたので,0からのスタートではありませんでしたが,付け焼刃の知識は使い物にならないなというのをすぐに痛感しました.

とりあえずこう書けばこう動く!的なやっつけメンタルではなく,ちゃんと理屈を考えてソースを書くことが必要だと学びました.

それでも自分の知識では限界があるのは当然で,PRを出すたびに「こんな魔術みたいなやり方があるのか…」というソースが出てきて感動する日々が続いています.

RailsだけでなくSQL周りも自分が思っていた以上に全然未熟,というか素人同然でした.最初のうちはN+1問題上等なSQL文ばっかり書いてました.

この辺りの知見というのはやっぱり業務でないと得られないものが多く,しっかりと業務を通じて吸収していきたいと考えています.

意識低い系

業務を通じて感じたことは,いままでの自分のエンジニアとしての意識はあまりにも低かったなぁということです.

  • 「とりあえず動けばいい」

  • 「たぶん大丈夫」

  • 「真似すればいいや」

大学時代はこんな気持ちでソースを書いていましたが,こんなので業務になるわけがないです.

意識が低すぎて自分の体から解脱して地中に埋まってるレベルです.意識埋没系男子.

これに早めに気づけたのも,OJTですぐにプロダクトに直結しているタスクを振ってもらえたからだと思っています.もしじっくりと育てあげる系の研修だったら,自分の意識の低さに気づくのがもっと遅れていたかもしれません.

これに関しては本当に感謝していますし,この経験を絶対に無駄にしないようにしたいです.

今後

とりあえずもっと勉強して早く「一人の戦力」として扱われる人材になりたいです.

いまは半人前どころか下手したら負だったりするので,気合い入れてやっていきます.

あとは他のプロダクトはPerlで書かれているものが多いので,ソース読みながらPerlの方もちょくちょくやっていきたいなぁと思っています.

Diverse技術研究所 にも所属しているので,こちらの方でも何らかの成果を出していきたいです.

株式会社Diverseのdeveloper blogをはじめます

こんにちは。株式会社Diverse で CTO をしている天野です。

Diverse はマッチングサービスを開発・運営している会社です。詳しくは、公式blog をご覧ください。

このブログでは、私たちが主にどのような技術を用いてサービスを開発・運営しているか、などについて書いていきたいと思います。

よろしくお願いします。

f:id:t-amano:20160801125716j:plain:w400