「スタートアップテック vol.1」を開催しました!

https://connpass-tokyo.s3.amazonaws.com/thumbs/87/36/87360719e01f4b0d089645f47e2f7d45.png

こんにちは、インフラ・データ基盤部の川島です。最近寒くなってきましたね。今年も終わりますね。心はすでに年末休みです。

先日、エンジニア交流イベント「スタートアップテック vol.1」を開催しました。

今回のテーマは、みんなが大好きな「Ruby」です。弊社のプロダクトもほとんど全てと言ってもいいくらいRubyを使っています。 主催枠として、私もLTを行ったので、発表内容を紹介できればと思います。

発表内容

LTのテーマは、「Rubyffmpegのfilter_complex」について発表しました。オープンエイトのプロダクト全てが動画をベースに展開しているため、Rubyと同じく、全てのプロダクトでffmpegを使っています。最近のプロジェクトの中でのffmpegを活用した実装事例について紹介しました。

ffmpeg は動画や音声に対して、非常に多くのことができる優秀なツールです。基本的にコマンドラインで操作を行うため、多くのオプションを設定しなければいけません。

下記のコマンドが実際に使用したものになります。

ffmpeg -y -r 15 \
-i ./image/%d.jpg -i 01.mp3 -i 02.mp3 \ 
-filter_complex "[0:v]fps=fps=15[img];[1:a]atrim=duration=20.0,afade=type=out:start_time=19.0:duration=1.0,asetpts=PTS-STARTPTS[OA1];
[OA1]amerge=inputs=1[a]" \
-map [img] -map [a] -s 640x360 -crf 30 -movflags faststart -vcodec libx264 -pix_fmt yuv420p -q:a 0 -strict -2 \
output.mp4

プロジェクトの中では、このコマンドを Ruby で生成しています。 LTの中では、複数あるオプションの中でも、 filter_complex 部分に焦点を絞って紹介しました。

filter_complexは大きく3つの構成に分類することができます。

  • filter
  • filter_chain
  • filter_graph
fps=fps=15 # filter
[0:v]fps=fps=15[img] # filter_chain
"[0:v]fps=fps=15[img];...." # filter_grpah

filter_graph[filter_chian[filter]] という形でそれぞれが内包されているイメージです。

コードで実装する場合にも、この構成を元にクラス定義していきます。

filter class
filter_chain class ( N filters )
filter_graph class ( N filter_chains ( N filters ))

対象のディレクトリの構成としては下記になります。

- filter_complex  
│
└──-filter
│   │   xx_filter.rb 
│   
└───filter_chain
│   │   xx_chain.rb
│   
└───filter_graph
    │   xx_graph.rb

名前空間、filter毎のクラスで分けることによって、それぞれのfilterの責務を明確にすることができます。また、追加したいfilterがあったとしても、filter, filter_chain, filter_graph をセットで追加することで、容易に作成ができます。

まとめ

ffmpegは、本当にたくさんのことができるツールです。この記事でffmpeg、特にfilter_complex に興味を持っていただけるとうれしいです。

次回のイベント告知

1/29(火)にも、弊社主催のLT大会を行なっていきます。次回のテーマは「フロント」です。 また、「一緒に勉強会を行いたい!」などのご要望がありましたら、ぜひご連絡(@hisatake)をお待ちしております!

おまけ

コードなどの内容は下記のスライドに掲載してあります。

www.slideshare.net

技術書典にサークル参加してきました

こんにちは。初めまして。 OPEN8の大津( @14__oz )です。

技術ブログを始めることになりました!! 編集長に抜擢され、初回の内容を任されています。 頑張っていきますのでよろしくお願いします!

OPEN8には2017年新卒エンジニアとして入社し、ルトロンのアンドロイドアプリを初期開発からやってきました。 ReactNativeを使っています。

詳しくは、Wantedlyインタビュー記事があるので読んでみてください。 www.wantedly.com

早速、初回のテーマですが、「技術書典5」に出展したときの話をします! 新機能の開発が忙しいなか、時間を作って書き上げた技術書を頒布してきました。 内容は、ReactNativeのアニメーションについて書いています。 今更ですが、振り返っていきます(笑)。

技術書典

技術書典とは、技術書オンリーイベントです。 技術者のためのコミケをイメージしてもらえると良さそうです。 出展者が普段から使っている・興味のある技術のノウハウをギュッと技術書に詰め込んでいて、とても読み応えがあります。 かなり幅の広いジャンルが揃っていて、内容も初学者に向けたものから、ニッチなものまで様々です。 どの技術書も販売されているものに劣らない内容となっています。

もともと興味があったなか、CTOの石橋( @hisatake )からの後押しでチャレンジしてみることになり、 10/8(月)に池袋サンシャインシティにて開催された技術書典5に出展してきました。

当日は、およそ10,000人も来場されたそうです! 前回の来場者数が、およそ6,000人で、技術書典の規模がどんどん拡大していますね。 今後も楽しみです!

初めてのサークル参加

技術書典5に無事当選はしたものの、当時は、内容さえ決まって書き始めれば何とかなるだろうという見切り発進をしていました。

  • 即売会にサークル参加する
  • 技術書を書く
  • 書籍を作る

執筆や書籍を作ろうとした事もないのに、余裕をこいていたのはどうしてなんでしょう・・・。

後々に大変痛い目をみる羽目に・・・。

技術書の内容

頒布した技術書の内容は、

  • 業務ではAnimatedを使う機会がほぼなかった事
  • 新卒当時は難しくて断念していたアニメーションにリベンジしたかった
  • 実際に動かして、理解したかった

と言った理由から、ReactNativeのAnimatedクラス・コンポーネントをテーマとして選んでみました。

技術書を書くにあたり、ReactNativeでパズルアプリを作りました。 アプリ内でAnimatedを用いた部分のコードを載せて解説しています。 Animatedとスクロールの連携やinterpolateを用いた例を書いています。

Easingの使い方や、PanResponderを用いたフリックの取得も書いています。 知らないことが多かったので、ReactNative本体のソースコードを読んで理解しことや、 AnimationLayoutなど、一通りアニメーションに必要なものを含んだ内容になっています。

書籍の最後には、およそ1年ReactNativeを使ってきて、印象的な出来事を中心にトピックとして残しておくことにしました。

当日の様子

開場1時間前には、列ができていました。 この時点で早くも自分のテンションが上がり始めます。

緑色の服を来た運営の方たちに出迎えてもらい、自分のブースへと向かいます。 ブースに作った技術書が直接届いていたので荷物整理をしていました。

一息ついてからの、開封の儀。

そして、ブースの設営をしました。 必要そうなものの大半は前日・前々日に100均に駆け込んで買い揃えました。 書籍の内容がReactNativeだったのでFacebookの服を着て待機。

始まるまでに時間が少しばかり余ったので、顔見知り方のブースに挨拶に行ったり、 となりのブースの方と話していました。 なんだかんだ、お隣の方とは1日中話していました。

始まってすぐに3名の方がブースに来てくれたのは、かなり嬉しかったです。 そのあとは、入場規制の関係で人の波が一定間隔で押し寄せるといった感じでした。 ブースに来て見本誌を読んでくれる方がたくさんいて、読まれているときの緊張感は計り知れないです。 じっと観察されているような気分でした。 見本誌を見て買っていただけた時は嬉しくて顔に出ていたかもしれないですね。 同僚や知り合いなど、たくさんの方にブースへ来てもらえたのでありがたかったです。

最終的には、50部ほど頒布できました。 ただ、今だから思うと、調子に乗って100部刷ったのは完全にミスですね。 余ってしまったので、今でも家に眠っています。 また、機会があれば頒布しようと思います。

失敗したこと

失敗したことはたくさんあって、

  • 部数を刷りすぎた
  • 表紙・裏表紙の入稿データの形式が違っていた
  • PDFの用紙サイズが間違っていた
  • 書く時間をほとんど取れなかった

などなど、出し始めるとキリがなさそうです(笑)。

見切り発進した結果、ギリギリまで入稿方法について調べずにいました。 いざ、入稿するぞってときにノンブルがない、PDFの用紙サイズが違うなど、かなり焦りました。 表紙は塗り足しがなくて作り直しと、PDF同様にダメな点がありました。 事前確認を怠り、行き当たりばったりで良くなかったですが、ノウハウを得たので次は活かせられそうです。

一番キツかったのは、書く時間を取れなかったことです。 時間があまりにもなくて最後までずっと終わらないのではないかと内心思い、 まるで、締め切りに迫られた作家のようでした。 また、時間を置いてから内容を読み直して修正する時間もほとんど取れず、 完成度が下がってしまったのは悔やまれます。

技術書典を終えて

総合的にはかなり満足しています。 執筆に当たっては失敗しことも多いですが、やって良かったと思えたからですね。

実際に技術書を出そうとすると、 かなりのインプットがいることが身に染みました。 今回の執筆では体感で2倍くらいのインプットが必要でした。 業務でReactNative本体のソースコードを読むことはほとんどないので、いい機会だったと思います。 次回もまた出展したいとは思います!内容が決まればですが・・・。

技術書典では、参加者としてもたくさんの技術書を買いました。 手当たりしだい買っていたので、むしろ買いすぎた気がしています。 今でも出社前に読みふけっています。

おわりに

ここまで読んでいただきありがとうございました。

今後は、弊社の個性豊かなメンバーが更新していきます。 もちろん、僕も何度か登場することになります。 楽しみにしていてください!!

最後に告知があります!!

Ruby LT大会

11/29(木)に「スタートアップテック vol.1: Ruby LT大会」が開催されます。 スタートアップテックとは5社合同で開催するエンジニア交流会です。 初回はRubyに関するLT大会です。

OPEN8からは、インフラエンジニアとして活躍する川島が登壇します。 発表の内容は、OPEN8のコアテクノロジーにも関わってくる動画処理についてです。

connpass.com

参加枠は多めにとってあり、現在も枠は空いています。 Rubyに興味がある、これから始める予定でLTだけでも聞いてみたい方など、 ぜひご参加ください。

今後、様々なテーマで開催していきます。