Ionic Creatorはアプリのプロトタイピングツールです。
デザインやプログラミングの知識はいりません。 ブラウザでポチポチするだけで誰でもアプリのモックアップが制作できます。 Prottとかと同じです。
それだけでなく、以前紹介したIonic向けのコードを抽出することができます。 作成したUIそのままを使って開発を始めることができます。
概要
Ionicでアプリ開発を始めるには、他からテンプレートを持ってくるかCreatorで0から作成します。 Starterテンプレートは標準でもついてきますが、Ionic Marketにたくさんあります。
今回はIonic Creatorを使います。
使い方
「+New Project」を押してアプリ名を入力します。テンプレートは"Tabs"を選びます。 タブコントロールはあとからでもつけれるので、どれを選んでも大丈夫です。
プロジェクト新規作成直後の画面です。
左上にページ、左下にUI部品が並んでいます。 ページ一覧からページを追加・選択して、左下のUI部品を真ん中の画面にドロップして組み立てます。 UI部品の細かい挙動は右のプロパティでコントロールします。
数分いじってUIサンプルを作ってみました。
プロパティからアイコンや画像も修正できます。 ボタンや画像からは、押したリンク先のページも指定できます。
画像はローカルだけでなく、Googleフォト・Dropbox等のクラウドからもアップロードできます。
標準的な操作なので、使うのは初めてでも迷うこと無く操作できました。
完成品
作ったプロトタイプはWeb上ですべて公開されます。 非公開アプリは有料です。
公開先URLは右上のシェアボタンから確認できます。
今回作ったプロトタイプも
https://creator.ionic.io/share/083c11c5f419
から誰でも見ることができます。
コードはdashboard上からzipでダウンロードするか、コマンドionic start [appName] creator:083c11c5f419で利用できます。
すごく簡単に動くコードができてしまうので、とにかく一度使ってみることをおすすめします。 あまりに便利なので今度、Creatorから実際にアプリを作ってみようと思います。
