Flutter導入から見るクロスプラットフォーム開発のリアル

技術・デザイン

サイバーエージェントでは、2018年頃からクロスプラットフォームを検討しはじめ、 Flutter や Kotlin Multiplatform のようなクロスプラットフォームフレームワークが登場し、実際にプロダクトに導入するケースも出てきました。クロスプラットフォームを導入したことで、エンジニアの開発スタイルにどう変化があったのか、導入事例を踏まえて話を聞いてみました。

Profile

  • 伊藤恭平
    2011年に中途入社。入社後は iOS アプリや Web フロントの開発を行い、さまざまな新規サービスの立ち上げに携わってきた。2014年以降は、 iOS アプリの立ち上げをメインに行い、去年からは Flutter を使ったアプリの開発に従事している。

  • 降矢大地
    2012年に中途入社。さまざまな新規サービスの立ち上げに携わり、サイバーエージェントの Android 領域を牽引する。現在は新規サービスの開発以外にもプロダクトを横断した技術支援などにも従事。また、2016年に GDE(Google Developers Expert for Android)に加入し、社内のDeveloper Expertsも務める。

iOS と Android の機能差のソリューションとなるクロスプラットフォームフレームワークの導入

──クロスプラットフォームを活用した開発は、いつ頃から検討していましたか?
 

氏名

伊藤

2018年頃から「ABEMA」の開発ミーティングで、iOS と Android のアプリ間で機能差が出てしまう課題が議題にあがっていました。また、エンジニアのリソース課題として「iOS と Android のエンジニアリングを共通化できないだろうか」という議論も出ていました。それらに対するソリューションとして、クロスプラットフォームフレームワークが検討されていました。

そういった背景の中、 Google が正式リリースした FlutterKotlin Multiplatform のようなクロスプラットフォームフレームワークが登場し、社内でもプロダクトに導入するケースも出てきました。

例えば、2018年6月にリリースした Ameba のスキルシェアリングサービス「REQU(リキュー)」は Flutter で開発しています。

──Flutter のようなクロスプラットフォームフレームワークをプロジェクトに活用するには、社内ではどんな要素が必要ですか?
 
氏名

降矢

クロスプラットフォームをプロジェクトに活かすためには、iOS エンジニアとAndroid エンジニア双方の賛同が得られる事が、大きな要因だと考えています。

あくまで社内における個人的な観測範囲での事例ですが、React Native は Web エンジニアの賛同が得られた一方、ネイティブのエンジニアにはあまり広まりませんでした。同様に Kotlin Multiplatform に関しても、Android エンジニアの賛同は得られましたが、iOSエンジニアで利用が進まず、当時の社内では普及しなかったという経緯があります。

Flutter はリリース当初の安定性の課題もあり、エンジニアの反応はまだ下火でしたが、開発元である Google がこの1~2年で強くプッシュしていることに加え、業界の中でも導入実績が増えていくにつれ、社内でも関心が高まっていきました。

氏名

伊藤

Flutter は、クロスプラットフォームフレームワークとしての設計がモダンで、UIコンポーネントを扱う際も、コードで表現できるので UI 実装がしやすいなど、エンジニアに馴染みやすい点が好感もてますよね。

氏名

降矢

それは同感です。Flutter が浸透した背景には、宣言的 UI の概念がネイティブエンジニア界隈にも浸透してきた側面が大きいですよね。

Web には React という宣言的UIを導入したフレームワークが以前から利用されていましたが、ネイティブエンジニアにとって宣言的 UI という概念はあまり馴染みがありませんでした。

そんな中、2019年6月に Apple がリリースした SwiftUI で宣言的 UI が採用されました。同時期に Google も、Android で宣言的 UI を活用できる Jetpack Compose というツールキットをリリースしています。

2019年に Apple と Google が、立て続けにフレームワークをリリースした事で、ネイティブエンジニアに宣言的 UI が浸透するきっかけになりました。SwiftUI や Jetpack Compose には安定性に関するいくつかの課題を残していましたが、その点を Flutter が先駆けて解決していたのも大きかった。

その結果、Flutter が iOS、Android の双方のエンジニアから賛同され、クロスプラットフォーム開発の事例が少しづつ増えていったというのが、サイバーエージェントでの経緯です。

Flutterに見られる、新技術導入のリスクコントロール

──Flutter を導入してみた際のメリットを教えて下さい。
 

氏名

降矢

冒頭に紹介した「iOS と Android のアプリ間で発生する機能差」や「iOS と Androidのエンジニアリングを共通化したい」という課題に対して、Flutter を導入する事で一定の効果を得られました。仕様に対する実装の共通化と、エンジニアリソースの集約により、スマートフォンアプリをスピーディにリリースできるようになりました。

また、宣言的 UI により、コンポーネントをコード定義できる事で、UI の品質向上やリファクタリング効率が上がりました。複数の画面に配置される UI コンポーネントは、実装者によって微妙なズレが発生するケースがありますが、Flutter の導入で極端に減少しました。

特に、開発した UI コンポーネントの再現性や再利用性が高く「この画面で配置した UI コンポーネントをこちらの画面でも使いたい」という時に、GUI で UI を構築するツールでは調整が難しい実装が、Flutter の宣言的 UI によって再現性高く再利用できるようになりました。

──Flutter のように比較的新しい技術をプロダクトに導入するメリットはなんでしょうか?
 
氏名

伊藤

率直なところ、Flutter が流行り始めている時期に、導入を視野に入れて検討したのも、好奇心からでした。テック企業であるからこそ、技術トレンドや時流をキャッチアップし、プロダクトに導入しながら最適化していく事は大切だと思っています。

氏名

降矢

Swift も β 版の頃から導入していましたよね。

氏名

伊藤

ある程度のリスクや検証コストは発生しましたが、早い段階で導入しておいた事で、技術的な知見やノウハウが溜まり、プロダクトの開発スピードを速めるなどメリットが大きかったです。

Flutter に関しても、β 版の頃から検討を重ね、積極的にプロダクトに導入する事で、検証結果やノウハウが蓄積された事が、今では会社全体のメリットになっています。

──新しい技術を積極的に導入していく際の、リスクコントロールはどのように考えていますか?
 
氏名

伊藤

「新しい技術を導入したい」という動機の背景には、技術的な好奇心の他に、サイバーエージェントだからこそ挑戦できる難易度の高い事業がいくつもあるのが特徴です。

ABEMA」や「WINTICKET」など要求レベルの高いビジネス課題に対して、新しい技術が有効なソリューションとして選択肢にあがります。

新しい技術を導入するリスクは避けて通れませんが、ビジネスの成功確率を上げるためにも、ナレッジの共有によるリスクコントロールができるのは、サイバーエージェントという会社のスケールメリットだと思います。

例えば、社内限定の技術カンファレンス「CA BASE CAMP(※)」では、社外に公開できないような技術ノウハウを共有する場で、今年はオンライン開催に2000人を超える技術者が参加しました。

また、各事業領域の技術利用状況をテクノロジーマップ(※)で可視化し、ライブラリやフレームワーク等の利用実績を元にしたレビューや導入事例などの技術的ノウハウを共有しています。これにより事業や子会社間での組織を横断した技術的な繋がりを形成しています。

「リアルタイム3DCG合成」に「バーチャル会場の設営」今だからチャレンジできた、NewNormalなカンファレンス
CyberAgent Way 2020(統合報告書) P80 テクノロジーマップ

このように、社内のエンジニアが試行錯誤した無数のチャレンジと失敗の積み重ねは、貴重なナレッジデータベースとなり、全社的に共有する仕組みができています。

こういった仕組みは会社が用意すれば浸透するわけではなく、新しい技術に果敢に挑戦するエンジニアが、認められ賛同されてこそです。

そういう点では、新しい技術に果敢にチャレンジするのが好きな降矢さんは、どう思いますか?

氏名

降矢

そうですね。私は地雷を積極的に踏みたいタイプです。β 版ですらない Canary Channel (プレ開発者版) のようなバージョンを試し、バグを一番最初に踏んで Issue を上げたいというスタンスです。こういった先鋭的なバージョンに興味をもった技術者が、グローバルに議論するフェーズはとても興味深く、地雷を踏む事から得られる学びは計り知れません。

プロダクトに新しい技術を何の準備もなく導入する事こそリスクなので、β 版や Canary Channel 版の検証を重ねながら、プロダクトのビジネス要件を満たせるかどうかを冷静に判断する事が大切だと思っています。

氏名

伊藤

社内にたくさんの事業の軸があり、様々な分野のエンジニアがいるからこそ、それぞれのフィールドで新しい技術の検証が、日常的に行われているのは企業カルチャーとしての強みかもですね。

氏名

降矢

層の厚さもまた、サイバーエージェントのスケールメリットだと思います。極端な話、サイバーエージェントには、技術的なチャレンジにともなう失敗に関して、リスクヘッジできる技術組織があるので、安心して挑戦できるとも言えます。

自分達のチームで解決に行き詰まるほどのトラブルに直面したとしても、社内に詳しい人や経験した人がいるので、総力戦で解決にあたれます。そのバックボーンがあるからこそ、安心して技術的なチャレンジとしてリスクをとりにいけるのが強みですね。

マルチプラットフォーム開発の現場で、今求めているエンジニア像

──社内でのマルチプラットフォームはどのように進んでいますか?
 

氏名

降矢

「iOS と Android のアプリ間で発生する機能差」や「iOSとAndroidのエンジニアリングを共通化したい」という課題は、今後予定している新規サービスで求められてくので、Flutter やKotlin Multiplatform をソリューションとして導入する需要はあります。

また、ABEMAのような大規模な既存プロダクトを Kotlin Multiplatform に変えていこうという動きもあります。

──今後、どんなエンジニアを採用で求めていますか?
 
氏名

降矢

クロスプラットフォーム開発の経験有無は問いません。Flutter も Kotlin Multiplatformも経験した事のある人のほうが少ないと思います。

それよりも iOS や Android でのアプリ開発工程をしっかり体験している人を歓迎したいです。そういった普遍的な技術力を身につけていれば、プロダクト開発という実践の場で、  Flutter や Kotlin Multiplatform を初めて触ったとしても少ない学習コストでキャッチアップできるからです。

──クロスプラットフォームと聞くと、Dart など比較的新しい言語への対応が前提の印象ですが、そういった経験は必須でしょうか?
 
氏名

降矢

Flutter なら言語は Dart ですし、Kotlin Multiplatform はもちろん Kotlin ですが、実のところ言語の仕様の差は、サイバーエージェントではあまり重視していなくて、むしろ技術のくくりに壁を感じないような、変化対応力のエンジニアが求められています。

氏名

伊藤

そうですね。もちろん Kotlin Multiplatform なら Kotlin をやってきた人は当然学習コストは低くなります。しかし Flutter の場合は Dart が書けるという人は少ないと思うので、宣言的 UI に関して興味があり、その構想に共感する人には馴染みやすいと思います。

1人でやっているとどうしても、あまり工夫しなくなってしまいがちです。その点サイバーエージェントには様々な分野の優れたエンジニアが多数在籍しており、かつ技術的な議論も活発です。間違いなくスキルは伸びると思いますし、知らないことも多く学ぶことができます。切磋琢磨しながら試行錯誤できる環境が好きな人にはとても楽しい環境だと思います。

氏名

降矢

最先端の技術にチーム開発という形で、業務として携わることができる。そういう開発現場で働きたいと思っている人にとっては望ましい環境だと言えると思います。

Flutterエンジニア募集中

この記事をシェア

オフィシャルブログを見る

記事ランキング

世界初、デジタルヒューマンによる「感動体験」を目指して ー森島研究室と創り出すCG技術の未来ー

技術・デザイン

CG技術を活用し、次世代のクリエイティブ表現を実現する「極予測AI人間」「デジタルツインレーベル」。リリース直後から反響を呼んだ本サービス実現の背景には、4年前から取り組んでいる産学連携・CG研究組織の強化があります。

タッグを組んでいるのは、最先端のコンピュータビジョン・CG技術を牽引する第一線の研究室として注目をされている早稲田大学 森島研究室。

企業と大学だけの関係に留まらない両者が考えるCG技術の未来、目指す「世界初」の研究とは。

Page Top