Slide 1
Slide 1 text
2024年最新版！Android開発で
役立つ生成AI徹底比較
株式会社ZOZO
ZOZOTOWN開発本部 ZOZOTOWN開発1部 Android1ブロック
@nishimy432
技術本部 技術戦略部 DevRelブロック
@wiroha
Copyright © ZOZO, Inc.
1
Slide 2
Slide 2 text
© ZOZO, Inc.
株式会社ZOZO
技術本部 技術戦略部 DevRelブロック
@wiroha（ゐろは）
2024/3〜ZOZOTOWN Android
アプリエンジニア。
2
@nishimy432（にしみー）
株式会社ZOZO
ZOZOTOWN開発本部 ZOZOTOWN開発1部
Android1ブロック
バックエンドエンジニア、PM、
Androidエンジニアなどを経て
現職のDevRelへ。
Slide 3
Slide 3 text
© ZOZO, Inc.
3
導入
生成AIツールが急速に普及しているものの、Android開発において何のツールをどのように活用するか
迷っていませんか？
本セッションでは、ChatGPT、GitHub Copilot、Geminiを比較して紹介します。
Android開発ならではのシナリオを交えながら、コードの品質改善・開発効率向上のためのヒントやノウ
ハウを共有できればと思います。
Slide 4
Slide 4 text
© ZOZO, Inc.
4
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 5
Slide 5 text
© ZOZO, Inc.
5
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 6
Slide 6 text
© ZOZO, Inc.
6
生成AIとは
概要
● テキスト、画像、音声、動画などの新しいコンテンツを生成する能力を持つAI技術
● 2022年11月に対話型AI「ChatGPT」が公開され、急速に普及
● データを学習し、そのパターンや特徴を理解して新しいデータを生成するためのアルゴリズム・フ
レームワークを「モデル」と呼ぶ。モデルの性能向上で、より自然で高度な生成が可能になった。
● 生成AIに対する命令や指令を「プロンプト」と呼ぶ
サービス例
● テキスト系：ChatGPT、Gemini、GitHub Copilot、Copilot（Microsoft）、Claude
● 画像系：Stable Diffusion、MidJourney、DALL-E、Adobe Firefly
● 他、多数
本セッションではChatGPT、GitHub Copilot、Geminiの3つを取り上げて比較する。
Slide 7
Slide 7 text
© ZOZO, Inc.
7
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 8
Slide 8 text
© ZOZO, Inc.
8
ChatGPT
● 開発元
○ OpenAI
● 概要
○ 会話型の生成AIで、文章生成、翻訳、要約、質疑応答、コー
ド生成など、多岐にわたるタスクをこなす。
○ カスタムバージョン（GPTs）を構築できる。
● モデル
○ GPT-4, GPT-4o, DALL·Eなど
● 料金
○ 無償版
○ Plus $20/月
○ Team $25/月（年払い）、$30/月（月払い）
○ Enterprise 要問い合わせ
● Android開発との親和性
○ これといって特徴的な機能はない。Android Studioと統合は
できない。
Slide 9
Slide 9 text
© ZOZO, Inc.
9
GitHub Copilot
● 開発元
○ GitHub
● 概要
○ エディタ上でリアルタイムにコードの自動補完や提案を行う。
○ 対話型のCopilot Chat、Enterprise版ではpull requestのサマ
リー生成機能などもある。
● モデル
○ Codex / GPT-4など
● 料金
○ 無償版は無し
○ Individual $10/月 or $100/年
○ Business $19/月
○ Enterprise $39/月
● Android開発との親和性
○ プラグインがあり、Android Studio上で動作可能
● 参考
○ ZOZOでは全社導入済み GitHub Copilotの全社導入とその効果
Slide 10
Slide 10 text
© ZOZO, Inc.
10
Gemini
● 開発元
○ Google
● 概要
○ 日本語での発音は「ジェミニ」、2024年2月「Bard」から
名称変更。
○ 画像、音声、動画などさまざまな種類の情報を理解し、そ
れらを組み合わせて推論する。
○ Google Workspaceとの統合や、Gemini For Google
Cloudなどにより業務改善にAIを活用できる。
● モデル
○ Gemini 1.0 Ultra, Gemini 1.0 / 1.5 Pro, Gemini 1.5
Flash, Gemini Nano
● 料金
○ 無償版
○ Gemini Business ￥2,260/月
○ Gemini Enterprise ￥3,400/月 （1年契約の場合）
● Android開発との親和性
○ 高い。Android Studio Koala以降で自動的にインストール
されている。
Slide 11
Slide 11 text
© ZOZO, Inc.
11
ChatGPT、GitHub Copilot、Geminiの比較
ChatGPT GitHub Copilot Gemini
開発時の
使い方
● チャット機能 ● チャット機能
● エディタ上での補完
● エディタ上でのコード解説・ドキュ
メント作成など
● チャット機能
● Android Studio上でのコード解説・
ドキュメント作成など
特徴 汎用的。無償で安全に使用
できる範囲が広い。
エディタ上でのコード補完、GitHubとの
連携では随一。さまざまなエディタに対
応。
独自のモデル。開発や専門分野に秀で
る。Android Studioとの親和性が高い。
おすすめ
の人
● 画像生成も活用した
い
● 周囲と知見交換し合
いたい（利用者が多
い）
● コードの自動補完を使いたい
● 言語に関わらず導入したい、全社
的に進めたい
● AndroidなどGoogle関連サービ
スの開発効率・品質を上げたい
● Google Workspaceとの統合で開
発以外の業務改善もしたい
ここでは傾向のまとめにとどめ、実際使ってみてどうだったかは後半パートで解説します
Slide 12
Slide 12 text
© ZOZO, Inc.
12
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 13
Slide 13 text
© ZOZO, Inc.
13
検証・導入時の注意点
● セキュリティ上のリスク
○ 入力した情報の流出
○ 提案されたコードへの脆弱性の混入
● ライセンス侵害のリスク
Slide 14
Slide 14 text
© ZOZO, Inc.
14
検証・導入時の注意点への対策
● セキュリティ上のリスク
○ 入力した情報の流出
■ 対策1：機密情報・個人情報を入力しない
■ 対策2：入力内容が学習に使用されないようにオプトアウト設定をする
○ 提案されたコードへの脆弱性の混入
● ライセンス侵害のリスク
Slide 15
Slide 15 text
© ZOZO, Inc.
15
オプトアウトの方法〜ChatGPT〜
● 「データコントロール」→「すべての人のためにモデルを改善する」をオフにする
Slide 16
Slide 16 text
© ZOZO, Inc.
16
オプトアウトの方法〜GitHub Copilot〜
● Setting -> Copilot -> “Allow GitHub to use my code snippets for product improvements” の
チェックを外す
● Business, Enterpriseプランの場合は学習されない
Slide 17
Slide 17 text
© ZOZO, Inc.
17
オプトアウトの方法〜Gemini〜
● アクティビティ -> オフにする
※ ただし、オフであってもチャットは最長で72時間アカウントに保存される。
Slide 18
Slide 18 text
© ZOZO, Inc.
18
検証・導入時の注意点への対策
● セキュリティ上のリスク
○ 入力した情報の流出
■ 対策1：機密情報・個人情報を入力しない
■ 対策2：入力内容が学習に使用されないようにオプトアウトの設定をする
■ 対策3：業務で使用する場合、入力内容の機密性の段階によって使用可否・範囲を定め
る（ZOZOではルールを定めている）
○ 提案されたコードへの脆弱性の混入
● ライセンス侵害のリスク
Slide 19
Slide 19 text
© ZOZO, Inc.
19
検証・導入時の注意点への対策
● セキュリティ上のリスク
○ 入力した情報の流出
■ 対策1：機密情報・個人情報を入力しない
■ 対策2：入力内容が学習に使用されないようにオプトアウトの設定をする
■ 対策3：業務で使用する場合、入力内容の機密性の段階によって使用可否・範囲を定めると
いった工夫も考えられる（ZOZOではルールを定めている）
○ 提案されたコードへの脆弱性の混入
■ 対策1：コードの内容を理解し、コードレビューでも品質をチェックする
■ 対策2：2024年8月にGitHubより一般提供された「Copilot Autofix」を使用し、脆弱性
のチェック・自動修正をする
● ライセンス侵害のリスク
Slide 20
Slide 20 text
© ZOZO, Inc.
20
検証・導入時の注意点への対策
● セキュリティ上のリスク
○ 入力した情報の流出
■ 対策1：機密情報・個人情報を入力しない
■ 対策2：入力内容が学習に使用されないようにオプトアウトの設定をする
■ 対策3：業務で使用する場合、入力内容の機密性の段階によって使用可否・範囲を定めると
いった工夫も考えられる（ZOZOではルールを定めている）
○ 提案されたコードへの脆弱性の混入
■ 対策1：コードの内容を理解し、コードレビューでも品質をチェックする
■ 対策2：2024年8月にGitHubより一般提供された「Copilot Autofix」を使用し、脆弱性の
チェック・自動修正をする
● ライセンス侵害のリスク
○ 対策1：GitHub Copilotの設定では「Suggestions matching public code」をBlockedにする
○ 対策2：損害賠償請求が発生した場合の補償など利用規約を確認する
Slide 21
Slide 21 text
© ZOZO, Inc.
21
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 22
Slide 22 text
© ZOZO, Inc.
22
Android Studioへの導入方法〜Chat GPT〜
● Android Studioへの統合機能は無し
Slide 23
Slide 23 text
© ZOZO, Inc.
23
Android Studioへの導入方法〜GitHub Copilot〜
● Android Studio -> Setting -> Plugins で”GitHub Copilot”を検索し、インストール
Slide 24
Slide 24 text
© ZOZO, Inc.
24
Android Studioへの導入方法〜GitHub Copilot〜
● Tools -> GitHub Copilot -> Login to GitHub
Slide 25
Slide 25 text
© ZOZO, Inc.
25
Android Studioへの導入方法〜GitHub Copilot〜
● ブラウザで先ほどのコードを入力、ContinueをしてAuthorize
Slide 26
Slide 26 text
© ZOZO, Inc.
26
Android Studioへの導入〜Gemini〜
● Android Studio Koalaをダウンロード後、View -> Tool Windows -> Gemini -> Log in to Google
Slide 27
Slide 27 text
© ZOZO, Inc.
27
Android Studioへの導入〜Gemini〜
● ブラウザでGoogleにログイン、Googleへのデータ送信を許可
Slide 28
Slide 28 text
© ZOZO, Inc.
28
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 29
Slide 29 text
© ZOZO, Inc.
29
前提
● 今あるプロジェクトで活用する方法
● コードを全て生成AIのプロンプトに含めることはしない
● 使用する生成AI
○ Android Studio内から
■ GitHub Copilot
■ Gemini
○ Webから
■ Chat GPT
■ Gemini
● ここで紹介する生成AIの回答は全て一例
Slide 30
Slide 30 text
© ZOZO, Inc.
30
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 31
Slide 31 text
© ZOZO, Inc.
31
実装補助
● DroidKaigi の公式アプリにコントリビュートする場合を想定
● 取り組んだIssue
○ お気に入りの画面で、スクロールした時にトップアプリバーの背景色がFigmaのデザインと違
う色になる
DroidKaigi.conference-app-2024.GitHub.2024-08-25.https://github.com/DroidKaigi/conference-app-2024/issues/596
Slide 32
Slide 32 text
© ZOZO, Inc.
32
実装補助
● DroidKaigi の公式アプリにコントリビュートする場合を想定
● 取り組んだIssue
○ お気に入りの画面で、スクロールした時にトップアプリバーの背景色がFigmaのデザインと違
う色になる
Slide 33
Slide 33 text
© ZOZO, Inc.
33
実装補助
● GitHub Copilotは開いているファイルの情報を取得する
● 関連するファイルを全て開く
Slide 34
Slide 34 text
© ZOZO, Inc.
34
実装補助
GitHub Copilot Chat に、Issueタイトルとどこを修正すれば良いかを聞く
Slide 35
Slide 35 text
© ZOZO, Inc.
35
実装補助
実際にあった提案コード (一部省略)
LargeTopAppBar(
title = {
Text(text = stringResource(FavoritesRes.string.favorite))
},
navigationIcon = {
IconButton(
onClick = onBackClick,
)
},
scrollBehavior = scrollBehavior,
colors = TopAppBarDefaults.largeTopAppBarColors(
containerColor = MaterialTheme.colorScheme.primary // Set your desired color here
)
)
Slide 36
Slide 36 text
© ZOZO, Inc.
36
実装補助
実際にあった提案コード (一部省略)
LargeTopAppBar(
title = {
Text(text = stringResource(FavoritesRes.string.favorite))
},
navigationIcon = {
IconButton(
onClick = onBackClick,
)
},
scrollBehavior = scrollBehavior,
colors = TopAppBarDefaults.largeTopAppBarColors(
containerColor = MaterialTheme.colorScheme.primary // Set your desired color here
)
)
containerColor は
スクロール時の色は変更されない。
scrolledContainerColorを
変更する必要がある。
Slide 37
Slide 37 text
© ZOZO, Inc.
37
実装補助
メリット
● 簡単なタスクならほとんど正しい実装ができる
● 複雑なプロジェクトでも実装箇所を見つけやすい
デメリット
● 実装箇所が分かるだけの場合が多い
○ 結局人力での実装が必要
● 少し複雑なタスクだとまだまだ生成精度は低い
活用場面
● プロジェクトに入って間もない場合
● 簡単なタスクを短時間で終わらせたい場合
Slide 38
Slide 38 text
© ZOZO, Inc.
38
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 39
Slide 39 text
© ZOZO, Inc.
39
コードリーディング
FavoritesFiltersの色も変更する必要があった
Slide 40
Slide 40 text
© ZOZO, Inc.
40
コードリーディング
scrollBehaviorのoverlappedFractionを
取得してif文で分岐することで
スクロールに合わせて色を変更した
TopAppBarと色が変わるタイミングが
ズレている
→ TopAppBarに合わせる
→ コードを読む必要がある
Slide 41
Slide 41 text
© ZOZO, Inc.
41
コードリーディング
AppBarのファイルを添付して、scrolledContainerColor の設定をしている箇所を聞く
Slide 42
Slide 42 text
© ZOZO, Inc.
42
コードリーディング
Slide 43
Slide 43 text
© ZOZO, Inc.
43
コードリーディング
このコード部分を生成AIに説明してもらう
val appBarContainerColor by animateColorAsState(
targetValue = colors.containerColor(fraction),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
Slide 44
Slide 44 text
© ZOZO, Inc.
44
コードリーディング
GitHub Copilot Chat
Slide 45
Slide 45 text
© ZOZO, Inc.
45
コードリーディング
Gemini
Slide 46
Slide 46 text
© ZOZO, Inc.
46
コードリーディング
ChatGPT
Slide 47
Slide 47 text
© ZOZO, Inc.
47
コードリーディング
コードを適用するとスムーズに色が変わる
Slide 48
Slide 48 text
© ZOZO, Inc.
48
コードリーディング
メリット
● コードを読まなくても探している実装箇所を見つけやすい
● コードを読んで理解できなくても説明してもらえる
デメリット
● 指定された実装箇所が正しいかの判断が必要
活用場面
● プロジェクトに入って間もない場合
● ライブラリ内のコードを読み解かなければならない場合
Slide 49
Slide 49 text
© ZOZO, Inc.
49
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 50
Slide 50 text
© ZOZO, Inc.
50
テストコードの生成
ユニットテストの生成
● GitHub Copilotの補完
○ 引数とかを間違えてしまいがち
○ 他に書いてあるテストがあったらそれに引っ張られてしまう
○ 似たようなテストを複数用意する場合には有効
● GitHub Copilot Chatのスラッシュコマンド
○ /test で今開いているファイルや選択箇所のテストを書ける
○ 関数ごとのテストを作成したいならある程度正しいテストを書ける
○ 複雑な処理に関しては精度は良くない
Slide 51
Slide 51 text
© ZOZO, Inc.
51
テストコードの生成
テストデータの作成にはGitHub Copilotが使える
● 自動補完
○ 他のファイルに定義されているデータクラスは上手く読み込めない
■ 独自のパラメータを提案してしまう
■ データクラス自体をコメントで引用する必要がある
● GitHub Copilot Chat
○ 細かい指定もできる
Slide 52
Slide 52 text
© ZOZO, Inc.
52
テストコードの生成
テストデータの作成にはGitHub Copilotが使える
public data class TimetableSpeaker(
val id: String,
val name: String,
val iconUrl: String,
val bio: String,
val tagLine: String,
)
Slide 53
Slide 53 text
© ZOZO, Inc.
53
テストコードの生成
シンプルな指示で作成されたテストデータ
public fun TimetableSpeaker.Companion.fake(): TimetableSpeaker {
return TimetableSpeaker(
id = "1",
name = "John Doe",
iconUrl = "https://example.com/johndoe.png",
bio = "An experienced developer with a passion for mobile technologies.",
tagLine = "Mobile Developer"
)
}
Slide 54
Slide 54 text
© ZOZO, Inc.
54
テストコードの生成
リスト形式で返すように指示したテストデータ
public fun TimetableSpeaker.Companion.fakeList(): List {
return listOf(
TimetableSpeaker.fake(),
TimetableSpeaker(
id = "2",
name = "Jane Smith",
iconUrl = "https://example.com/janesmith.png",
bio = "A seasoned developer with expertise in backend technologies.",
tagLine = "Backend Developer"
),
TimetableSpeaker(
id = "3",
name = "Alice Johnson",
iconUrl = "https://example.com/alicejohnson.png",
bio = "A creative designer with a knack for user experience.",
tagLine = "UX Designer"
)
)
}
Slide 55
Slide 55 text
© ZOZO, Inc.
55
テストコードの生成
細かい指示も出せる
● リストの中身の個数
● テキストや数値は同じものを代入するか
● nullable な場合、null を代入するか
Slide 56
Slide 56 text
© ZOZO, Inc.
56
テストコードの生成
メリット
● 簡単なテストデータを自動で書ける
● テストデータの生成を楽にできる
デメリット
● 現段階では、ユニットテストを生成する精度が低い
活用場面
● 全くテストが書かれていない小規模なプロジェクトでテストを追加したい場合
● 複雑なテストデータを作成したい場合
Slide 57
Slide 57 text
© ZOZO, Inc.
57
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 58
Slide 58 text
© ZOZO, Inc.
58
コードレビュー
● 変更点を生成AIに説明してもらう
● 特定のペルソナとしてコードレビューをしてもらう
○ あなたはコードの品質、可読性、効率性を重視する上級Kotlin開発者です。
〇〇のコードレビューをしてください。
Slide 59
Slide 59 text
© ZOZO, Inc.
59
コードレビュー
今回レビューしてもらうコード
val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior()
val fraction = if (scrollBehavior.state.overlappedFraction > 0.01f) 1f else 0f
val filterBackgroundColor by animateColorAsState(
targetValue = lerp(
MaterialTheme.colorScheme.surface,
MaterialTheme.colorScheme.surfaceContainer,
FastOutLinearInEasing.transform(fraction)
),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
Slide 60
Slide 60 text
© ZOZO, Inc.
60
コードレビュー
GitHub Copilot の結果
Slide 61
Slide 61 text
© ZOZO, Inc.
61
コードレビュー
GitHub Copilot の提案コード
val scrollBehavior = remember { TopAppBarDefaults.pinnedScrollBehavior() }
val fraction = if (scrollBehavior.state.overlappedFraction > OVERLAP_THRESHOLD) 1f else 0f
val filterBackgroundColor by animateColorAsState(
targetValue = lerp(
MaterialTheme.colorScheme.surface,
MaterialTheme.colorScheme.surfaceContainer,
FastOutLinearInEasing.transform(fraction)
),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
使用は適切と
評価
Slide 62
Slide 62 text
© ZOZO, Inc.
62
コードレビュー
GitHub Copilot の提案コード
val scrollBehavior = remember { TopAppBarDefaults.pinnedScrollBehavior() }
val fraction = if (scrollBehavior.state.overlappedFraction > OVERLAP_THRESHOLD) 1f else 0f
val filterBackgroundColor by animateColorAsState(
targetValue = lerp(
MaterialTheme.colorScheme.surface,
MaterialTheme.colorScheme.surfaceContainer,
FastOutLinearInEasing.transform(fraction)
),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
remember関数内で
Composable関数は
呼べないためエラー
Slide 63
Slide 63 text
© ZOZO, Inc.
63
コードレビュー
Gemini の結果
Slide 64
Slide 64 text
© ZOZO, Inc.
64
コードレビュー
Gemini の提案コード
val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior()
val fraction = if (scrollBehavior.state.overlappedFraction > 0.01f) 1f else 0f
val filterBackgroundColor by animateColorAsState(
targetValue = lerp(
MaterialTheme.colorScheme.surface,
MaterialTheme.colorScheme.surfaceContainer,
FastOutLinearInEasing.transform(fraction)
),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
Slide 65
Slide 65 text
© ZOZO, Inc.
65
コードレビュー
Gemini の提案コード
val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior()
val fraction = if (scrollBehavior.state.overlappedFraction > 0.01f) 1f else 0f
val filterBackgroundColor by animateColorAsState(
targetValue = lerp(
MaterialTheme.colorScheme.surface,
MaterialTheme.colorScheme.surfaceContainer,
FastOutLinearInEasing.transform(fraction)
),
animationSpec = spring(stiffness = Spring.StiffnessMediumLow)
)
TopAppBarと挙動が合わない
→ この変更の背景が伝わっていない
Slide 66
Slide 66 text
© ZOZO, Inc.
66
コードレビュー
メリット
● 自分では気付かない視点を教えてくれる
デメリット
● 変更の背景まで伝えるのは難しい
● 不必要な議論を生んでしまう可能性がある
活用場面
● Pull Requestを出す前の自己レビューをする場合
● レビューをしている中で行き詰まった場合
Slide 67
Slide 67 text
© ZOZO, Inc.
67
目次
● 生成AIツールの概要
○ 生成AIとは
○ ChatGPT、GitHub Copilot、Geminiの比較
○ 検証・導入時の注意点
○ Android Studioへの導入方法
● 実際の開発における活用方法
○ 実装補助
○ コードリーディング
○ テストコードの生成
○ コードレビュー
○ ドキュメントの作成
Slide 68
Slide 68 text
© ZOZO, Inc.
68
ドキュメント作成
作成しなければならないドキュメントの種類
● Issue
● Pull Request
● Tech Blog
● イベント参加レポート
● コード内に記述するコメント/kDoc
● Architecture Decision Record (ADR)
Slide 69
Slide 69 text
© ZOZO, Inc.
69
ドキュメント作成
作成しなければならないドキュメントの種類
● Issue
● Pull Request
● Tech Blog
● イベント参加レポート
● コード内に記述するコメント/kDoc
● Architecture Decision Record (ADR)
Slide 70
Slide 70 text
© ZOZO, Inc.
70
ドキュメント作成
kDocを書く方法
DroidKaigi.conference-app-2024.GitHub.2024-09-05.https://github.com/DroidKaigi/conference-app-2024/blob/main/feature/favorites/src/commo
nMain/kotlin/io/github/droidkaigi/confsched/favorites/component/FavoriteFilters.kt
Slide 71
Slide 71 text
© ZOZO, Inc.
71
ドキュメント作成
kDocを書く方法
DroidKaigi.conference-app-2024.GitHub.2024-09-05.https://github.com/DroidKaigi/conference-app-2024/blob/main/feature/favorites/src/commo
nMain/kotlin/io/github/droidkaigi/confsched/favorites/component/FavoriteFilters.kt
Slide 72
Slide 72 text
© ZOZO, Inc.
72
ドキュメント作成
kDocを書く
Slide 73
Slide 73 text
© ZOZO, Inc.
73
ドキュメント生成
GeminiでkDocを書いてもらう
Slide 74
Slide 74 text
© ZOZO, Inc.
74
ドキュメント作成
ADRを書く
● 章を立てて経緯を説明するのは難しい
○ 生成AIを利用すると良い
● ADRのテンプレートが決まっている場合
○ プロンプトに入力
● 決まっていない場合
○ 生成AIに考えてもらう
Slide 75
Slide 75 text
© ZOZO, Inc.
75
ドキュメント作成
ADRを書く
以下のような文章をADRにしてもらう
FavoriteFilters の背景色をスクロールに合わせて変更するようにした。
最初、`scrollBehavior`の`overlappedFraction`を取得してif文で分岐することでスクロールに合わせて色
を変更しようとした。しかし、この状態だと色の変化がスムーズではなく、すでにスクロールに合わせ
て色がスムーズに変化するTopAppBarの挙動と合わなかった。そこで、TopAppBarの実装と合わせ、
animateColorAsState を使って実装することにした。その結果、TopAppBarとスムーズに色が変わる挙
動となった。
Slide 76
Slide 76 text
© ZOZO, Inc.
76
ドキュメント作成
ChatGPTで作成したADRの一例
背景
FavoriteFilters の背景色をスクロールに合わせて変更する必要が生じた。当初は、scrollBehavior の
overlappedFraction を if 文で取得し、分岐することで色を変更しようと試みたが、この方法では色の変化がスムーズで
はなく、既存の TopAppBar のスムーズな色変化と合わなかった。
決定事項
TopAppBar の実装と整合性を保つために、animateColorAsState を使用して、スクロールに応じてスムーズに背景色が
変化するように実装を変更することを決定した。
影響範囲
この変更により、FavoriteFilters の背景色がスムーズに変化し、TopAppBar と統一感のあるUI/UXが実現される。ユー
ザー体験の向上に寄与し、将来的なメンテナンスや追加機能の実装にも柔軟に対応できるようになる。
議論メモ
当初の if 文による実装では、色の変化が不自然であったため、UXに悪影響を与える可能性があった。
animateColorAsState を用いることで、アニメーションによるスムーズな色変化が実現可能となり、TopAppBar と同様
の挙動が得られることが確認された。
Slide 77
Slide 77 text
© ZOZO, Inc.
77
ドキュメント作成
背景
* FavoriteFilters の背景色をスクロールに合わせて
変更する必要があった。
* 初期実装では色の変化が不自然で、TopAppBar の
挙動と統一感がなかった。
決定事項
* TopAppBar と同様に、animateColorAsState を使
用して色の変更を実装する。
影響範囲
* FavoriteFilters の表示
* ユーザー体験（特にスクロール時の視覚的なフィー
ドバック）
議論メモ
* 初期実装（scrollBehavior + if文）の問題点：
* 色の変化がスムーズでない
* TopAppBar との挙動の不一致
* animateColorAsState 採用のメリット：
* スムーズな色の変化
* TopAppBar との挙動の一貫性
* 懸念点：
* パフォーマンスへの影響（特に低スペックデバイス）
* 将来的な複雑なアニメーションへの対応
* 代替案：
* 初期実装の改良
* サードパーティ製アニメーションライブラリの導入
* 結論：
* animateColorAsState を採用
* パフォーマンスへの影響を監視し、必要に応じて最適化
Geminiで作成したADRの一例
Slide 78
Slide 78 text
© ZOZO, Inc.
78
ドキュメント作成
GitHub Copilot Chatで作成したADRの一例
# 背景
`FavoriteFilters`の背景色をスクロール位置に基づいて変更する必要がありました。最初は、`if`文を使用して
`scrollBehavior`から`overlappedFraction`を取得し、条件に応じて色を変更しようとしました。しかし、この方法では色
の変化がスムーズではなく、すでにスクロールに合わせて色がスムーズに変化する`TopAppBar`の挙動と一致しませんでし
た。
# 決定事項
一貫したスムーズな色の変化を実現するために、`TopAppBar`の実装に合わせて`animateColorAsState`を使用することに
しました。
# 影響範囲
`FavoriteFilters`の背景色がスクロールイベントに応じてスムーズに変化し、`TopAppBar`と一貫したユーザー体験を提供
できるようになりました。
# 議論メモ
最初の実装では、`if`文を使用して`scrollBehavior`の`overlappedFraction`を取得し、条件に応じて色を変更しようとしま
した。しかし、この方法では色の変化がスムーズではなく、`TopAppBar`の挙動と一致しませんでした。そのため、
`animateColorAsState`を使用することで、スムーズな色の変化を実現しました。
Slide 79
Slide 79 text
© ZOZO, Inc.
79
ドキュメント作成
メリット
● 説明を考える手間が省ける
● 文章を簡潔にまとめてくれる
● 自分では気付けなかった懸念事項に気付ける
デメリット
● 間違った内容が含まれる可能性が高い
● 結局文章を修正する必要が出てきて、時間がかかる
活用場面
● kDocなどコード内にドキュメントを書く場合
● ADRなどの技術文書を書く場合
Slide 80
Slide 80 text
© ZOZO, Inc.
80
まとめ
シンプルなタスクや新しいプロジェクトには
● GitHub Copilotで素早く実装補助。
● 簡単なタスクの自動化と実装箇所の特定が得意。
既存コードやライブラリの理解が必要なら
● GeminiやChatGPTでコードリーディング。
● コードの難解な部分を解説してもらい、時間短縮。
ドキュメント作成や技術文書の効率化には
● GitHub CopilotでkDocやADRの作成補助。
● 説明の手間を省きつつ、見落としがちな懸念を発見。
Slide 81
Slide 81 text
© ZOZO, Inc.
81
まとめ
テストコードが足りない場合には
● GeminiやGitHub Copilotでテストデータ生成。
● 複雑なテストデータも簡単に準備。
コードレビューを効率化したいなら
● ChatGPTで新しい視点から自己レビューをサポート。
● 見落としていた改善点を発見。
Slide 82
Slide 82 text
No content