【導入事例】KLab 顧客事例インタビュー

2024/08/26

KLab 顧客事例インタビュー

『ゲーム事業を手掛けるKLabがプロトタイピングツール『ProtoPie』の導入で70％業務効率化を達成』

この記事は、ProtoPieをご利用いただいているKLab株式会社の山内様と佐々木様へのインタビューを通じて、ご回答いただいた内容をまとめたものとなります。

プロトタイピングツールをお探しの方、ProtoPieにご興味のある方など、ぜひご参考いただければと思います。

その当時の問題点は、メンバー全員が実機端末で実際の挙動をすぐ確認できなかったというところがありました。また、条件分岐だったりをデザイナーが実装するのが難しく、一本道の紙芝居のようにしか再現することができませんでした。このような問題は潜在的にはずっとあった気がします。

そして、実機を触る段階になると、技術的にあるいは工数的に変更や修正ができないみたいな状況が結構続いて、全社的にこれは環境や手段の見直しが必要なんじゃないか、という理由から、私（山内）からProtoPieの利用を提案しました。

ProtoPieで70％の業務効率化

デザインプロセス

どのような場面でProtoPieを使用していますか？

インタラクションではほぼ全ての機能を使っています。

例としましては、以前はデザイナーパーツを用意して開発に渡して、このボタンを押したらここが一つ増えますみたいな指示書をテキストで送っていました。テキストであったが故に思い通りの完成形が仕上がらないことがありましたが、今はインタラクションを実装してアニメーションのことも考えることができて、ロジックを組むことによって理想の最終プロダクトにより寄せることができています。

この動画はアイテムの個数選択をモチーフにした画面です。社内のデザイナーにProtoPieの利用を教えるときに、この題材をよく使用します。

これまで10名を超えるデザイナーに教えていますが、操作がシンプルで伴走する必要がない点で助かっております。

ProtoPieによってワークフローがどの程度改善されたか、指標があれば教えてください。

改善されたものとしては大きく2つあります。巻き戻りの防止とクオリティの向上です。

巻き戻りの防止については、どれだけ改善できたか以下のような計算を以前してみました。

修正時間＋ビルド時間＋ダウンロード時間 = コスト

それを既存のワークフローとProtoPieを導入したワークフローで比較すると修正工数が約70%削減されていました。

また、クオリティの向上という面では、ワークフローが大幅に削減されたことで、社内でのユーザーテストも行えるようになり、リリース前にユーザーの反応をフィードバックして改善できるようになりました。他にも、デザイナーが条件分岐のあるプロトタイプを作成することによって、インタラクションの考慮漏れや素材の作り忘れなどが軽減するメリットもありました。

ProtoPieはどのように作業効率を向上させていますか？

佐々木様：以前では、画面の挙動を確認するのにはワイヤーフレームを作ってデザインを入れて、UnityだったりUnreal Engineで実装してビルドをして実機で触れるようになってからようやく確認でそこからプランナーだったりディレクターがフィードバックを入れて、その作業をもう一度やり直すと半日や1日程度はかかっていました。

ProtoPieを利用すると、ワイヤーフレームを1回制作から上げてもらって、そこで挙動をチーム数名で確認して、ここはエフェクトを変えたいとか、出す順番を変えたいなどフィードバックもとに数分程度でもう一度実機で確認できるので、極端な例では体感 90%ぐらいの時間削減になりました。

私は作る側ではなくて山内が制作したものにフィードバックをあげる係なんですが、実際に仕様が決まってから端末で実機で動かせるものが上がるまで本当に数分でProtoPieの凄さを体感しております。

ユーザーテストでの導入 + エンジニアにも好影響（修正時間を短縮）

また、そのほかにも新規機能の追加であったり、既存機能の改善はワイヤーではなく今あるデザインを動かしてユーザーテストが可能になりました。例えば工数の都合で一つしかできなかったものが 3つパターンを作ってみようなど、そういったより良いクオリティのための準備ができるようになりました。

３つのスキルから１つを選択する画面のプロトタイプを３パターン作成した際の動画です。“実装後に端末を触ってその時に決めよう”という後回しが無くなったので、イテレーションが早くなり、巻き戻ることが減りました。

ProtoPieの導入について

ProtoPie導入時の最大の課題は何でしたか？

セキュリティの調査であったり技術検証であったりでエンタープライズアカウントを1ヶ月ほど付与していただいて使わせていただいていたので、そのままスムーズに移行できました。

ProtoPieのどのような機能がおすすめですか？

一番作業で効いてくるのがインポート機能の優秀さです。他のDCCツールからのFigmaとかSketchからインポートは数十秒でできて即実装ができます。しかも、インポートした後にデザインを修正してもそれをProtoPie上で更新できるというのは、ちょっとすごい異常なクオリティだと思ってます。

実機確認をビルドなしで即できる、Viewerの権限を無料で付与させていただけるので全員が即実機で確認できるのは素晴らしい長所だと思います。

技術的なところで言うと変数の使いやすさみたいなところが個人的には大好きです。

例えば、このボタンを押したら変数を0から1にして1になった時にこういうことが起きますっていう条件にすることで、すごくメンテナンス性が高く、ここも個人的にはとてもお気に入りの部分です。

ProtoPieとFigmaを比較して、どう思いますか？

Figmaもプロト作成が有料版で実装されて、少しだけではありますが試してみたんですが、デザイナーがプロトタイプを作るっていう観点から今のところ現実的ではありませんでした。少し複雑というか、分かりづらいという印象があります。ProtoPieはすでに10人以上のデザイナーに使い方を教えていますが、基本的に皆、想定よりも早く習得できています。おそらく、プロトタイピングに特化したUIの分かりやすさも優れている点かなと思います。現状ではレイアウト作成はFigma、プロト作成はProtoPieという棲み分けが一番しっくりきています。