便利なのが登場！UIのデザイン、プロトタイプ、アニメーションがコードなしで、手軽に作成できるツール -Drama
Post on:2019年8月19日
sponsors
すごいツールが登場しました！
コードは一切必要とせず、スマホアプリのデザイン、プロトタイプ、アニメーションが手軽に作成できるmacOS用のアプリを紹介します。
実際に試してみたところ、操作は非常に簡単で、動作も快適、さまざまなスマホアプリの構築に役立つと思います。
Dramaの特徴
DramaはPaintCodeのクリエイターによる、デザイン、プロトタイプ、アニメーションがオールインワンになったmacOS用のアプリです。先月リリースされたばかりで、現在はベータ版として提供されており、無料で利用できます。
Dramaのキャプチャ
-
- ユーザーインターフェイスを描画
- コードは一切不要、プロトタイプの視覚的な状態をシーンに描きます。
-
- インタラクティブなプロトタイプを作成
- 各シーンをトランジションに繋げるだけで、インタラクティブなプロトタイプを作成できます。
-
- アニメーションを作成
- レイヤー名に基づいてシーン間でモーフィングアニメーションを自動的に作成します。
Dramaの動画がYouTubeにアップされています。
下記は、Transitionを使ったプロトタイプです。完成は6:23あたり。
Dramaで作成したプロトタイプは、実機で確認できます。
iPhone, iPadで確認できるiOSアプリが無料で利用できます。
Dramaのダウンロード
Dramaのダウンロードは、下記ページから。
「Download Beta」をクリックし、メールアドレスを入力すると、無料でダウンロードできます。
※現在は、ベータ版のみです。
Dramaの使い方
Dramaをダウンロードしてみたので、さっそく使用してみました。
私の環境（macOS Mojave 日本語）で問題なく、動作しました。
Dramaの初期画面
デザイン、プロトタイプ、アニメーションなど、どんな感じにできるのかは、動画を見るとよく分かると思います。
シミュレーターの機能などもあるので、かなり便利です。
動画の一覧は、下記にまとめられています。
動画で使用しているファイルはダウンロードでき、自分の環境で試すこともできます。
上記動画のDramaファイル
スマホアプリで見かけるさまざまなアニメーションも楽しめます。Dramaファイルのダウンロードは、下記ページの中程ちょい下あたり。
ダウンロードしたファイルをDramaで開いてみました。
サンプルファイルを開いたところ
プロトタイプやアニメーションは、内蔵のシミュレーターや実機でも確認できます。
Dramaのシミュレーター機能
sponsors
