完全に機能する銀行アプリを作りました。コードを一行も書かずに。
Pie Bankは本物のアプリのように見えます。本物のアプリのように動作します。ログインでは実際の認証情報を検証します。パスワード欄はドットでマスクされます。送金すると残高が更新されます。小切手を入金するとカメラが起動します。
これはプロトタイプです。ProtoPieだけで完全に作られています。
AIツールはボタンを生成し、レイアウトを近似し、インタラクションパターンを提案することさえできます。しかし、それらにできないのは、製品が依存している特定のロジックを検証することです。Pie Bankは、ただの推測で作られたインターフェースではありません。あらゆる条件分岐、あらゆる残高計算、あらゆる生体認証トリガーが、指定どおりに正確に動作します。これが、見た目だけ整ったプロトタイプと、製品が機能することを証明するプロトタイプとの違いです。
このシリーズでは、どう作られたのかを細部まで解説します。表面的なインタラクションではなく、本物らしさを生み出す仕組み――変数、条件分岐、ハードウェア連携、そしてあらゆる画面で数値を正確に保つ計算です。
この忠実度でプロトタイピングを行うビジネス上の意義
インタラクションロジックが、エンジニアリングチケットが1件も作成される前に検証される。ユーザーテストセッションで、ただの「まあ、プロトタイプだから」という但し書き付きのフィードバックではなく、実際に行動につながるデータが得られる。ステークホルダーの承認は、仕様書を読んで理解するのではなく、実機上で意思決定者がスライドして送金する瞬間に起こります。
ほとんどのFinTechのデザインワークフローでは、プロトタイプは視覚的な参照であり、ロジックはドキュメントの中にあります。プロトタイプに実際の変数、リアルタイムの計算、条件分岐が載ると、そのギャップはなくなります。プロトタイプが仕様になります。実装側の前提は少なくなり、修正サイクルも減ります。
このシリーズは、その3つすべてを必要とするチームのために作られました。
Pie Bankの紹介: 本物のアプリのように動くプロトタイプ
Pie Bankは、4つの主要なインタラクション領域を備えた高忠実度のモバイルバンキングプロトタイプです。それぞれが、ProtoPieのCreative Technologistsによる個別の深掘りチュートリアルになります。
まずはフルデモをご覧ください。そのあとで、各パーツがどのように作られたのかを学びに戻ってきてください。
4つの章。4つの習得すべきスキル。
第1章 - すでに本番稼働しているようにログインする
チュートリアル: ProtoPieでリアルなログインフローを構築する方法
多くのプロトタイプがログインを見せかけで済ませるのに対し、これは違います。機能するテキスト入力、ドットで隠されたパスワード欄、変数ベースの認証情報検証、ライブのエラー状態、そしてLottieを使ったFace IDアニメーションを、完全に順序立ててタイミング通りに構築します。結果として、あらゆるユーザーテストやステークホルダーデモに耐えうるログインフローが完成します。
考えるダッシュボード
変数と触感のあるスクロールでスマートなダッシュボードを構築する
記憶するUI。残高、口座状態、ダッシュボード上のあらゆるデータポイントが変数に保存され、アプリはあなたが移動するあいだも金融状態を保持します。さらに、スクロールに高級感のある触り心地を与えるページングコンテナも構築します。デモを意思決定へと変える、そういう細部です。
→ 近日公開
第3章 - 実際に送金する
ProtoPieでの送金ロジック、動的リスト、スライドして送る操作
本当に計算する送金ロジック。送金フロー全体を構築します。動的な口座・受取人リスト、誤送金を防ぐスライドして送るコンポーネント、セッション全体で残高を正確に保つ変数計算です。残高の更新方法を説明する仕様書を書き続けるのはやめましょう。実際に見せましょう。
→ 近日公開
カメラも機能のひとつ
カメラレイヤーの統合と実機インタラクション
本物と見分けがつかないほど自然なハードウェア。ProtoPieのカメラレイヤーを使って、ライブの小切手入金フローを構築します。リアルなカメラ映像、キャプチャのシミュレーション、そして確認時の即時残高更新。ステークホルダーがデバイスを手に取り、自分でインタラクションを完了できると、会話の流れが変わります。
→ 近日公開
シリーズ全編を待ちたくありませんか？
シリーズ全体は数週間ごとに公開されます。でも、今進行中のプロジェクトをもっと早く進めたいなら、各チュートリアルの公開を待つ必要はありません。
Creative Technologistsによるプライベートセッションでは、あなたの具体的なプロトタイプを直接一緒に進めます。あなたのインタラクション、あなたのロジック、あなたの質問。
枠には限りがあります。
触って学びたいですか？
このシリーズの最後には、Pie Bankの完全版ProtoPieファイル、4章すべて、14個の連結されたProtoPieシーン、あらゆるインタラクションを、ProtoPieで自由に探索できる形で公開します。
シリーズ完結時にもう一度ご確認いただくか、公開を見逃さないようフォローしてください。
