プロトタイプツールを調べてまとめる

新しくサービス開発を始める時に意外と時間がかかるのがプロトタイプを作ること。
とりあえず7営業日くらいでサクッとイメージだけでも固まるとイメージしやすく、クライアントにも喜ばれる。が、そうはいっても難しいもんです。

そんな時に便利なのがプロトタイピングツールを使うこと。動きのイメージを見るだけでガッツリとエンジニアがコードを書いて時間を使うのはもったいない。

なので、サクッと使えて便利なプロトタイピングツールをピックアップしてみた。

OutSystemsのローコード開発プラットフォーム

『OutSystems』のローコード開発プラットフォーム。とにかく簡単にプロトタイプが作れる。多分エンジニアじゃなくてもデザイナーやプランナーでも作れるレベルで簡単。

エンタープライズアプリケーション向けのローコード開発プラットフォーム | OutSystems

・OutSystems webサイト
https://www.outsystems.com/ja-jp/platform/

UI、ビジネスプロセス、ロジック、データモデルをドラッグ&ドロップして組み立てるだけ。android、iOS両方に対応してフルスタックのクロスプラットフォームアプリを作成。必要に応じて独自のコードを追加もできる優れもの。

その他外部システムとの連携も簡単にできるので社内ツール開発にも良さそう。とにかく何か作ってみる、という時に使うとコストの節約になる。

OutSystemsの特徴

  • 構築済みのオープンソースコネクタを利用することも、独自のコネクタを作成することも可能
  • 独自のBaaS(Backend as a Service)を構築し、一般的なクラウドサービスと連携
  • ワークフローやビジネスロジックによって、システム全体のデータのオーケストレーションを実行
  • コーディングなしでSOAP WebサービスおよびREST APIと連携

yappli(ヤプリ)

海外のツールは英語でわからん、という時は『yappli』はどうだろうか。日本の企業も結構使ってるようなので英語アレルギーがあってもわかりやすい?

・yappli webサイト
https://yapp.li/

これも簡単な操作でプロトタイプが作れるサービス。複雑な開発が不要なツールだから全然コストもかからない。
お店のポイントカードとか来店スタンプカードなんかはyappliだけで十分だったりする。個人商店や飲食店向けに提案してみるのも良さそう。

iBeaconプッシュ機能、生体認証、AR機能も簡単に使えるから、デフォルトで提供されている機能の組み合わせで複雑なシステム開発もできそうな感じがする。
これをプログラミングしないで作れるんだから良いね。デザイナーだけでアプリの大量生産ができる。

yappliの特徴

  • プログラミング不要
  • クロスプラットフォーム対応
  • 効果検証機能あり
  • 40種類以上の外部連携

Marvel(マーベル)

コードを書かずに5分以内でプロトタイプが作れるというサービス。ブラウザ上でプロトタイプ作成ができるので、とりあえず動きのあるものを作る時に良い。

・Marvel webサイト
https://marvelapp.com/

これの面白いところはデザインツールの『Sketch』『Photoshop』からデザインデータを取り込んで使えるところ。データはクラウドに保存。クライアントと話をしながらその場で作って見せたりしたら喜ばれるかも。

作り方も『Sketch』が使える人なら全然違和感が無くて、ボタンの当たり判定を設定してどう動くかを選ぶだけ。Sketchだと画面遷移しか無いけど、これならスワイプ操作とかも再現できてプロトタイプだけど完成に近いものができる。

Marvelの特徴

  • web上で5分で完結
  • データはクラウドに保存
  • 『Sketch』『Photoshop』からデザインデータを取り込み可能

AdobeXD

プロトタイピングツールといえば『AdobeXD』は外せない。デザインしながら動きも作れる。デザイナーのためのツールで使っている人も多いかもしれない。
複雑なコードは追加できないものの、画面遷移だけ見れれば良ければこれで十分。

・AdobeXD webサイト
https://www.adobe.com/jp/products/xd.html

adobeを契約している人はとりあえずDLして置いてある、程度かもしれないが結構おすすめ。データも共有できるし、どうせPhotoshopとかIllustratorでデータを作るんだから同じadobeで全部作ってしまうのも良いね。

AdobeXDの特徴

  • データの共同作業が可能
  • 自動アニメーション追加
  • UXのテストが簡単
  • デザイン重視のプロトタイピング

開発内容に応じたプロトタイピングツールを使おう

複雑なシステムを要する開発か、画面遷移だけわかれば良いウェブサイトなのか、作るものによって使い分けしてみるのが良さそう。
そもそもサクッと作りたいプロトタイプなのに、それを作るために時間がかかってしまうと意味がない。かといってたくさんのツールを使い分けするのもまた非効率なので、色々と使ってみて一番効率が良いツールをメインにしてみるのが良いと思う。

・その場でサクッと作って見せるレベルのものか
・通信を伴うある程度動くプロトタイプか

この辺がプロトタイピングツールを選ぶ基準になってきそう。

Internnectは世界中からフルリモートで、エンジニアをはじめとした優秀な人材を集め、難易度の高いプロジェクトにもスピーディーにチームを構築して対応するサービスを提供しています。

Head Office

Category