最短10分で作れる、すぐ公開できる

インストール不要のスマホアプリが作れる、初めてのCMSサービス

わずか7STEP
CSVファイルから、定型コンテンツのアプリが一気に作れる

「お試し作成」で試してみてから、無料会員へ
  • コンテンツの並び順が同じ、カタログのような定型ページを作るときは、CSVファイルで編集すると、とても効率的です。
  • シングルパッカーは、編集がプロモードの時、アプリデータをCSVファイルに出力し、ローカルの表計算ソフト等を使って編集することができます。
  • 編集したCSVデータをアップロードすると、大量の定型ページを持つアプリが、短時間で一気に作れます。

まずは、Webページに埋め込んだ*以下のアプリで体験してみてください

問題集

アプリ例:TOEIC情報やその問題を集めたアプリ例です。既存のテーブルのデータをテンプレートにはめ込めば、作成はとても簡単です。

ライブラリー集

アプリ例:社内で使用するPDF資料などを集めたアプリ例です。ジャンル分けされたメニューのタップでPDFが表示されます。

検索で用語集を作る

アプリ例:用語集。複数のデータテーブルの内容を検索して表示させることができます。問題集やカタログなど大量データの取り扱いも可能です。

  • *CMSでは、上記のようにWebページにアプリを埋め込むコードが取得できます。

STEP
1
テーブルエディタで、アプリのカラム構成をまず確認

プロモードでは、アプリデータをテーブルエディタでいつでも一覧できる

メインエディタで作るアプリデータは、メインテーブルに変換できます。このテーブルを直接編集すると、作業効率が大幅にアップします。

まず編集をプロモードにすると、テーブルエディタでメインテーブルを確認することができます。

テーブルは前半がメタカラムで、IDやメニュー、ページ目次等のカラムがあり、後半は表示要素となるコンテンツカラムが並びます。

テーブルの1行をクリックすると、フォームが表示されます。フォームの中のページ内容を、「カラム」にしておきましょう。

アプリがまずどんなカラム構成になっているか確認したら、カラム編集を始めましょう。

作りたくなるアプリ「ライナーノーツ」もご参考に

動画ガイドテーブルエディタでカラム構成を確認

動画ガイドは、全てシングルパッカーで作られています。誰でも同じような動画ガイドが作成可能です。

STEP
2
カラム定義エディタで、ページの表示要素を並べてゆく

コンテンツ表示には、40数種のエレメントと10数種のチャンクが使える

カラム定義エディタを開くと、まずメタカラムの編集画面になります。

メタでは、ページ目次の要素を増やして、よりリッチな目次が作れます。通常は初期値のままでOKです。

カラムコンテンツに切り替えると、マークアップエディタとほぼ同じ画面が表示されます。

表示要素を上から並べてゆき、プレビューで表示を確認します。
カラム定義ではデータ編集はせずに、表示の詳細設定だけをします。

設定は、カラムの列、全てのデータに適用されます。

作りたくなるアプリ「ライナーノーツ」もご参考に

STEP
3
メインエディタで、メニューの深さを決める

ページにサンプルデータを入力すれば、準備OK!

カラム定義ができたら、メインエディタに戻って仕上げをします。

メニュー、ページ目次をドラッグ&ドロップして、メニューの深さを決めます。

次にページ内容をカラムにしたページ目次を選びます。定義したカラムの入力フォームが並ぶので、サンプルデータを入力します。

サンプルが入っていると、ローカルでの編集が分かりやすくなります。

プレビューして思い通りのページが表示されれば、これで準備OKです。

作りたくなるアプリ「RSSリーダーアプリ」もご参考に

STEP
4
CSVをダウンロードして、エクセルなどでデータ編集

既存のテーブルから、コピー&ペーストするとあっという間に完了

アプリメニューのテーブル管理から、メインテーブルのCSVファイルをダウンロードします。

カラムコンテンツはサンプルを参考に、入力します。既存データがあればコピー&ペースト等で、あっという間に完成します。

IDなどは入力しなくてOKです。編集の注意点は、メタカラムのメニュー、ページ目次などです。

メニューはグルーピングを示すので丁寧にチェック。目次タイトルは必ず入力します。
そしてページ内容のエレメント名はサンプル行に表示されたものを全行コピーします。これで完成です。

作りたくなるアプリ「めくれるブックマーク(CSV)」もご参考に

STEP
5
テーブル管理で作成したテーブルを、アップロード

新しいテーブルにチェックを入れて保存すると、たったこれだけでアプリが作れる

作成したテーブルは、アプリメニューのテーブル管理でアップロードします。
メニュー、目次タイトル等がきちんと記述されていれば、通常はアップロードが成功します。

新しいテーブルにチェックを入れて保存をすると、たちまちのうちにアプリが生成されます。

驚くほど簡単に、多数のページを持つアプリが完成します。

完成したページは、表示項目が同一の定型コンテンツになります。

作りたくなるアプリ「めくれるブックマーク(CSV)」もご参考に

STEP
6
定型データは、見せ方を詳細設定すると、ぐっと見やすくなる

デザインだけでなく、ページの並びや目次の表示で、見やすさは変わる

アプリが生成できたら仕上げです。定型データの場合、表示の詳細設定で、見やすさが大きく変わる場合がありあます。

例えばライブラリーや用語の場合、1ページづつバラバラのページだと見にくくなります。

メニュー設定で「コンテンツ並び」を縦にすると、メニュー以下にある目次のページが縦に並び、見やすくなります。

メニュー設定には、使いきれないほどのたくさんの表示設定があるので、様々試してみてください。

作りたくなるアプリ「めくれるブックマーク(CSV)」もご参考に

STEP
7
スマホでアプリの出来上がりを確認したら、公開へ

公開すると、アプリのQRコードやページごと、商品ごとのQRコードが取得できる

アプリの出来上がりは、プレビュー画面下のメニューから、 URLをメールでスマホに送るとすぐ確認できます。ブラウザ表示のHTML5アプリならではの手軽さです。

確認したら公開します。URLを知っている人だけが見れるプライベート公開と、一般公開があります。

公開すると、アプリのQRコードを取得できます。
さらにページごとのQRコードも取得できるので、カタログやチラシ、展示物などの各ページにダイレクトにアクセスできます。

作りたくなるアプリ「なんでも検索アプリ」もご参考に

わずか3STEPアプリから検索できる、データテーブルを作る

  • シングルパッカーでは、データテーブルを複数作れます。データテーブルはアプリから検索でき、検索内容をアプリ内に組み込むことができます。
  • データテーブルのカラム構成は、上記のメインテーブルとほぼ同じ。メニューカラムがないだけです。
  • データテーブルは、カラム定義でCSVテンプレートを作ってから、ローカルにダウンロードしてデータを編集します。アップロードして使用登録をすると、アプリから検索できるようになります。

STEP
1
カラム定義エディタで、データテーブルを作る

定義するテーブルを、データテーブルにして、アイコンを並べてゆく

データテーブルを作るにはまず、アプリを選びます。メインエディタが開いたらそのまま、カラム定義エディタに移動します。

カラム定義エディタは、定義するテーブルを選べます。上部のプルダウンからデータテーブルを選びます。

選んだら定義の開始です。定義の仕方は上記のメインテーブルの定義とほぼ同じ。
目次設定はとりあえずそのままにしてカラムコンテンツを作ります。各エレメントやチャンクを並べ、設定から表示の仕方を決めておきます。

STEP
2
アプリメニューから、データテーブルのCSVをダウンロード

データテーブルは全て、ローカルのシートエディタで編集する

定義が終わったら、アプリメニューのテーブル管理から、データテーブルをCSVダウンロードします。
データテーブルは全てローカルのシートエディタ等で編集します。

編集の仕方も、上記のメインテーブルとほぼ同じ。メニューのカラムはないため、気を付けるのは目次のタイトルを必ず入力しておくことです。

既存のテーブルがあればコピー&ペーストで一気に作れます。作成したら、ファイル名を付けてアプリメニューのテーブル管理、データテーブルの項目からアップロード。

アップロードして、使用設定にチェックを入れれば準備OKです。

STEP
3
データテーブルを検索してアプリに組み込む、2つの方法

メニュー以下に目次を含んで組み込むか、ページの一部にコンテンツだけ組み込む

データテーブルをアプリから検索してコンテンツを組み込むには、2つの方法があります。

一つはメニューの「メニュー内容」をまずデータ検索にします。
ここで検索するデータテーブルを選んで検索を指定すると、検索結果がメニュー以下にページ目次とともに組み込まれます。通常のメニュー、目次と同じ表示になります。

もう一つがページの中に組み込む方法です。マークアップエディタの「データ検索」エレメントをページの中にドロップします。検索指定をすると、ページの中に指定数のコンテンツが組み込まれます。

データテーブルは、ミニDBように使え、カタログ、ライブラリ、用語等々、作成できるアプリの幅を広げます。