INDUSTRIES

自動車

航空・宇宙

金融

ゲーム

メドテック

IoT

デジタルプロダクト

USE CASES

エンタープライズ向け

個人向け

チーム向け

教育向け

KEY FEATURES

ハードウェア・システム統合

Beta

ProtoPie MCP

マルチデバイス・プロトタイピング

インタラクション・ロジック

開発者へのハンドオフ

ProtoPie AI

New

ユーザーテスト

PLUGINS

Figma

Sketch

Adobe XD

INSIGHTS & INSPIRATION

ブログ

eBook

カスタマーストーリー

イベント&ウェビナー

ProtoPie ギャラリー

PRODUCT LEARNING & SUPPORT

ProtoPieスクール

ProtoPieをダウンロード

製品ドキュメント

コミュニティ

INDUSTRIES

自動車

航空・宇宙

金融

ゲーム

メドテック

IoT

デジタルプロダクト

USE CASES

エンタープライズ向け

個人向け

チーム向け

教育向け

KEY FEATURES

ハードウェア・システム統合

Beta

ProtoPie MCP

マルチデバイス・プロトタイピング

インタラクション・ロジック

開発者へのハンドオフ

ProtoPie AI

New

ユーザーテスト

PLUGINS

Figma

Sketch

Adobe XD

INSIGHTS & INSPIRATION

ブログ

eBook

カスタマーストーリー

イベント&ウェビナー

ProtoPie ギャラリー

PRODUCT LEARNING & SUPPORT

ProtoPieスクール

ProtoPieをダウンロード

製品ドキュメント

コミュニティ

Comparison

12

分で読める

ProtoPie vs. Flinto: Which Is the Best Prototyping Tool on the Market?

Find out why ProtoPie is a far superior tool to Flinto.

Iulia Sorodoc、 Product Marketing Manager at ProtoPie

要点

  • Flinto は、シンプルなインタラクションとアニメーションを作成するのに適したツールですが、より複雑な要求に直面すると力不足です。

  • 動作がぎこちなく機能も限られている Flinto は、成果物を他の人と共有しにくくしています。さらに、Flinto には質の高い学習リソースと結束の強いユーザーコミュニティがありません。

  • ProtoPie は、高精細プロトタイピングに最適で、音声インタラクションのプロトタイピングのような最先端機能を備え、豊富なインタラクションと、積極的な UX デザイナーのコミュニティを誇ります。

私たちの現代的でデータ駆動型の経済は急速に動いており、UX デザイナーは、できるだけ短時間で作成した高精細デザインで利害関係者を感心させるという、ますます大きなプレッシャーにさらされています。つまり、彼らには高精細な高速プロトタイピングツールが必要なのです。

彼らのニーズに合うプロトタイピングツールは、実質的に ProtoPie と Flinto の 2 つです。ここで、ProtoPie 対 Flinto の議論における重要な問いが浮かび上がります。どちらが最良のプロトタイピングツールなのでしょうか?

ProtoPie とは?

ProtoPie は、複雑な UI/UX デザインのアイデアを、非常にインタラクティブで高精細なプロトタイプへと変えるための高速プロトタイピングツールで、macOS と Windows で動作します。

自画自賛ではありません。ある顧客によると、「ProtoPie は柔軟でありながら強力なプロトタイピングツールで、使いやすいインターフェースとゆるやかな学習曲線がデザインコミュニティで高く評価されています」とのことです。

私たちの使命はシンプルです。デザイナーが無限の創造性を形にできるよう支援すること。ProtoPie は大衆向けのツールではありません。群衆の中で際立ちたいなら使うべきツールです。豊富な数式と変数のライブラリを使って、ゼロから新しいインタラクションを作成できます。基本的なクリック遷移のモックから、実際のアプリと見分けがつかない見た目・手触り・動作の高精細プロトタイプまで、すべて構築できます。スマートフォン、コンピュータ、車載システム、ゲーム機でプロトタイプをテストできます。選択肢はあなた次第。ProtoPie では、その可能性は無限です。

Flinto とは?

Flinto は、世界中の UX デザイナーがモバイル、デスクトップ、または Web アプリのインタラクティブなプロトタイプを作成するために使う高速プロトタイピングツールです。

Flinto はページベースのプロトタイピングツールです。ユーザーには複数の画面が提示され、ボタンのつながりを通してそれらを接続できます。ある画面のボタンをタップすると別の画面へ移動します。ページベースのツールでは、画面間のさまざまな遷移も選べます。たとえば、フェードイン、右からスライドイン、下からスライドアップなどです。

ぎこちないプロトタイピングツールではありますが、アプリの流れをまだ検討している段階でモックアップを素早く作るには Flinto は良い方法です。Flinto は Mac 専用でもあり、macOS 10.14 と iOS 12.0 以降でのみ動作します。

Flinto の長所

Transition Designer

Flinto の最も強力な機能のひとつである Transition Designer は、直感的に視覚フィードバックを直接返してくれるため、遷移の調整を最も素早く行える方法のひとつです。


flinto transition designer


Flinto の Transition Designer

ただし、Flinto の Transition Designer には欠点もあります。同じオブジェクトの異なるプロパティを異なるタイミングでアニメーションさせたい場合、うまくいきません。

マイクロインタラクションとアニメーションを作成するのに最適なツール

Flinto は、マイクロインタラクションやアニメーション設計の作成に役立つ独自の機能が豊富で、他のプロトタイピングツールと差別化されています。たとえば、「Behaviors」機能を使うと、どんなプロジェクトでも再利用可能なコンポーネントを活用でき、UX デザイナーの時間を大幅に節約できます。

Flinto の遷移には誇れる点がたくさんあります。それは、直接的なフィードバックです。スワイプジェスチャーで次のページに進むとき、ユーザーは iOS アプリのように指で前後にスライドさせることで、遷移速度を制御できます。

Flinto の短所

プロトタイピング機能が限られている

Flinto はアニメーションやマイクロインタラクションの作成には良い選択ですが、高精細プロトタイピングになるとゴールラインで失速します。たとえば、ユーザーがアニメーションを追加するのに不必要に長い時間がかかります。

さらに、プロトタイプ内の異なるコンポーネント間でインタラクションを作成する際には、深刻な制限があります。要するに、シンプルなデザインには優れていますが、複雑さには対応できません。

Flinto は Mac と iOS でしか動作しない

Windows ユーザーはこれを非常に苛立たしく感じるでしょう。Flinto は macOS 10.14 と iOS 12.0 以降でしか動作しません。

プロトタイプのプレビューは Mac と iPhone でしかできません

これは、Flinto が iOS 中心のアプリケーションであることを考えれば驚くことではありません。しかし、非常に制限的です。世界には 14 億台の稼働中の Windows デバイス があり、その多くは企業で使われています。UX デザイナーはこの点を真剣に考慮すべきです。

さらに悪いことに、プロトタイプのプレビューは簡単ではありません。Flinto をインストールするだけでなく、プロトタイプをプレビュー したい場合は iOS Viewer アプリケーションもダウンロードする必要があります。


flinto preview app


プロトタイプをプレビューするには、Mac ユーザーは Apple Store から Flinto Viewer App をダウンロードする必要があります。

プロトタイプの共有は難しい場合があります

Flinto の共有オプションは限られています。プロトタイプを共有するためのリンクはありません。プレビューウィンドウを録画して動画ファイルとして共有するか、Dribble にアップロードすることはできます。これは高速プロトタイピングツールとしては大きな欠点です。ステークホルダーと共有できないなら、素早くプロトタイプを作る意味はあるのでしょうか?

ProtoPie がより優れたプロトタイピングツールである理由は?

Flinto は基本的なプロトタイピングには堅実なツールですが、完全なフローよりもマイクロインタラクション向きです。これが大きな欠点で、インタラクティブ入力や動画プレーヤーのような高度な機能がないため、複雑さに対応できません。

それとは対照的に、ProtoPie は強力な機能を備えています。UX プロダクトデザイナーは、プロセス自体がとても直感的なため、非常に洗練されたプロトタイプを簡単に作成できます。最終的な成果は、マイクロインタラクションであれ、より大きく複雑なプロトタイプであれ、そのまま雄弁に物語ります。そして最終的には、シームレスなデザインコラボレーションの可能性は ProtoPie のほうがはるかに高く、高精細プロトタイプの共有も驚くほど簡単です。

高精細プロトタイプを作るなら ProtoPie がなぜより良い選択なのか、その主な理由を見ていきましょう。

数式と変数で真の動的なインタラクションを作成する

数式と変数を使えば、真の動的なインタラクションを備えたプロトタイプを作れます。数式を使うことで、ユーザーはパスワード検証、ショッピングカート内のアイテム数のカウント、口座残高の合計算出などの動的インタラクションを作成できます。一方、変数はユーザーが後で使いたいデータ—たとえば名前、パスワード、口座残高—を保存する「バスケット」です。変数は、数式が使われるあらゆる場所で使用できます。


protopie predefined variables

数式と変数をインタラクションでどのように使うかもっと学びたい場合は、ProtoPie School のこれらのレッスンをチェックしてください。

インタラクションに音声を加えてプロトタイプを次のレベルへ

設定できるトリガーとレスポンスの無限の組み合わせはさておき、ProtoPie なら、この独自機能—音声インタラクション—を使って、プロトタイプに話しかけさせたり、こちらの音声を聞かせたりできます。

ProtoPie に必要なのはマイクとインターネット接続だけです。音声インタラクション付きのプロトタイプは次の環境で使用できます。

  • 音声からテキストへのインタラクション

  • テキストから音声へのインタラクション

ProtoPie では現在、次を提供しています:

  • 52 の対応言語と、聞き取り用の言語バリアント

  • 40 の言語と、発話用の言語バリアント

このチュートリアルに従って、音声インタラクション付きの自分だけのプロトタイプを作成しましょう。

動画

ProtoPie の Smartwatch Solution で、完全没入型のスマートウォッチ体験をプロトタイプ化する

ProtoPie Smartwatch Solution では、現実的なスマートウォッチのプロトタイピングと、スマートウォッチを含む完全没入型のコネクテッド体験を実現できます。ProtoPie Smartwatch Solution は、A から Z まで没入型スマートウォッチ体験をプロトタイプ化する必要のある成長中の組織向けのエンタープライズグレードのソリューションです。

実際の Wear OS スマートウォッチ上で、プロトタイプを簡単に表示・体験・テストできます。

ProtoPie を高速プロトタイピングツールとして数年間使ってきました。ただ、これまではスマートウォッチのコンセプトをスマートフォンやノートPCの画面で評価することに限られていました。 新しい ProtoPie Smartwatch Solution によって、デザイナーとリサーチャーは実際のハードウェア上でコンセプトを探求できるようになりました*、ユーザーの手首の上で、実際の利用文脈の中で。
*- Jeff Hoefs, Google Wear OS の Staff UX Engineer

動画

ProtoPie の Smartwatch Solution についてさらに詳しく学びましょう。

ProtoPie でコラボレーションは驚くほど簡単

ProtoPie では、Wi-Fi または USB 接続を使ってスマートフォン上でプロトタイプをプレビューできます。プロトタイプをローカルに保存してオフラインでテストすることも可能です。

さらに良いことに、作業をクラウドにアップロードしてリンクをチームメンバーやクライアントと共有できるため、デスクトップとモバイルの両方のデバイスでインタラクションしてもらえます。


flinto preview vs protopie player


*左右比較:Flinto Viewer アプリ vs ProtoPie Player。*

Mac でも Windows でも? どちらも対応しています

Flinto とは異なり、ProtoPie は インストール でき、Mac OS と Windows の両方で使えます。

さらに、チームメンバーでもクライアントでも、あらゆる iOS、iPad、Android デバイスで誰でもプロトタイプを体験できます。

ProtoPie では、次の用途のプロトタイプを作成できます。

  • macOS & Windows

  • iOS & Android

  • スマートウォッチ

ProtoPie なら、プロトタイピングの旅で孤独を感じることはありません

ProtoPie には、ProtoPie チュートリアルを含む多くの学習リソースがあります。さらに、ProtoPie には活発なユーザーコミュニティもあります。ProtoPie で作成した作品例を共有したり、他の UX デザイナーと交流したり、課題を議論したり、提案したりできます。


protopie-tips-and-tricks


*ProtoPie のカスタマーラーニングチームは、いつも新しい学習コンテンツを公開しています。*

学習リソース

  • ProtoPie School

  • ProtoPie Documentation


ProtoPie コミュニティ

ProtoPie では、定期的なプロトタイピングチャレンジを開催し、ユーザーに ProtoPie Studio で創造的なプロトタイプを設計するよう促しています。盛り上げるために、最優秀者には賞品を授与します。最新情報を得るには、Discord コミュニティに参加してください。

一方、Flinto のコミュニティは小規模で受け身であり、Flinto は YouTube での学習リソースもごくわずかです。実際、最新の動画は 1 年前のものです。

ProtoPie vs Flinto: この戦いを制するのは?

Flinto は基本的なプロトタイピングには良いツールです。いくつかのシンプルなインタラクションとアニメーションを備えた基本的なプロトタイプを見せたいなら、小さくて優れたツールです。しかし、洗練された高速プロトタイピングツールが欲しいなら、Flinto はあなた向きではありません。

ここに ProtoPie と Flinto の大きな違いがあります。ProtoPie は大衆向けではありません。ProtoPie は高速な高精細プロトタイピングに最適なツールです。可能性は無限大で、動的なインタラクションに最適なだけでなく、音声インタラクションのプロトタイピングのような素晴らしい機能も備えています。Flinto と違って、ProtoPie は macOS だけでなく Windows でも動作し、コラボレーション案件をはるかに効率的に進められます。さらに、豊富な学習リソースと活発なオンラインコミュニティは、多くの UX デザイナーにとって ProtoPie をまさに救世主にしています。

ProtoPie についてもっと知る

今日から、コードを 1 行も書かずに自分だけの超高精細プロトタイプを作り始めましょう。

また、Canny をチェックして、ロードマップの内容を確認し、フィードバックを共有し、機能要望を送ることもできます。

[ProtoPie を無料で試す]