本記事の要点
- **「サスケWorks」**はノーコード開発を体験してみたい人に一番オススメ出来るプラットフォームである
- 特にデータの管理・集計/紙媒体からのデータ抽出に強みがあるプラットフォームである
- 直感的にアプリ開発を行うことが可能
- ダッシュボードでの集計がとても便利
- 慣れてしまえば1～2時間程度でアプリを開発可能か
サスケWorksとは
公式ページの紹介文を引用すると、「サスケWorks」は以下のようなサービスです。
サスケWorksは、プログラミングのスキルや知識がなくてもアプリが作れる、ノーコードWEBアプリのプラットフォームです。自社や使う現場に合わせたアプリが作れます。豊富な無料アプリをそのまま使うことも、カスタマイズして使うこともできます。
ノーコード入門するのにオススメな４つの特徴
特徴としては、以下の４つが挙げられます。
- 公式サイトから完成したアプリをダウンロードすることも出来る
- ダウンロードしたアプリをカスタマイズ出来る
- ウェビナー参加特典を使えば数ヶ月間無料で利用出来る
- AI-OCRを活用したアプリを開発出来る
平たく言うと、**「豊富なお手本を見ながら開発を行えるノーコード開発プラットフォーム」**といったところでしょうか。
また、ノーコード開発プラットフォームは意外と数が多いのですが、その中でも「条件あり・期間限定」とはいえ無料でアプリ開発可能というのは、ノーコード開発を体験してみたい人にとって最高の環境と言えるでしょう。
この記事では触れませんが、AI-OCRの技術を導入したアプリを開発出来るのもサスケWorksの強みだと言えそうです。AI-OCRとは、簡単に言うと**「紙媒体のフォーム画像から文字認識を行い、データとして出力する」**技術のことです。これにより、従来だと手作業による文字起こしが必要だった業務を、画像を取り込むだけで解決することが出来るようになります。使いようによっては業務を大幅に削減することが可能になりそうですね。
完成したタスク管理・集計アプリ
取り敢えず何かしらのアプリを開発しながら操作に慣れたかったため、「ToDoリスト」を開発してみることにしました。とはいえ、ただのToDoリストでは上位互換にあたるアプリは巷にいくらでもあるので、それに一捻り加えた「タスク管理・集計アプリ」にしてみました。
まずは完成したアプリを見て頂いて、サスケWorksでどのようなアプリが開発出来るのか解説して行きたいと思います。
開発したアプリの使い方としては、
- タスクの優先度や締め切り日時を登録
- タスクの進行状況や、誰にどのようなタスクが振り分けられているかダッシュボードで集計
- 締切りまで14日を切ったタスクをピックアップ
- 登録されてから3日経過しても未対応状態のタスクをピックアップ
といったことが出来ます。
【ダッシュボード画面】
アプリのトップページです。
登録したデータを集計して表示することが出来ます。
【タスク一覧表示画面】
どんなタスクがあるのか一覧で確認することが出来る画面です。
ただ、基本的には欲しい情報はダッシュボードに貼り付けて確認することが多いかと思います。
【タスク新規登録画面】
タスクの新規登録を行う画面です。
最低限の機能が実装されていればいいと考えたので、入力情報はかなり絞っています。
見ての通り、アプリ自体は非常にシンプルな作りになっております。また、今回は実装方法を逐一調べながら開発を行ったため、開発時間は約10時間程になってしまいましたが、慣れてしまえばこの程度のアプリは1時間も掛らずに実装出来そうだと感じました。
アプリ開発の手順
ここからは具体的なアプリ開発手順を解説して行きます。
また、本記事ではサスケWorksのアカウント作成方法に関する解説は割愛致します。
アプリの新規作成
まずはアプリの新規作成を行います。
手順としては、
- 「サスケWorks」の親サービスにあたる「サスケ」にログイン
- 「サスケWorks」に移動し、「アプリの新規作成」ボタンを押す
- アプリ基本情報入力画面に遷移
となります。
アプリ基本情報の入力
アプリを新規作成することが出来たら、次はアプリ基本情報を入力していきます。
ここではアプリ名やアイコンなどを設定することが出来ます。
具体的にどのような機能を実装するかといった設定は、基本情報を入力した後、詳細設定で入力していきます。
❶ 公開/非公開設定
非公開にするとアプリにはアクセス不能になります。挙動を確かめるためにも、基本的には公開でいいかと思います。
❷ アプリ名設定
アプリの正式名称を設定します。
❸アプリ名(短い名前)設定
スマホのホーム画面にPWAとして登録する際に表示される短縮名称を設定します。
❹ アプリキー設定
作成したアプリのURLになる文字列を設定します。他のアプリと重複していなければ登録可能です。
❺ アプリカテゴリ設定
後々アプリを分類しやすいように、カテゴリを設定することが出来ます。
❻ アプリの説明
どんなことが出来るアプリなのか、説明文を記載することが出来ます。
以下２項目に関しては、下記画像のように変更が反映されます。
❼ カラーテーマの設定
アプリを象徴する色を設定します。
❽ アプリアイコンの設定
アプリアイコンの色やデザインを設定します。デザインは用意されている数十種類からイメージに合うものを選ぶことが出来ます。
アプリの詳細設定
次はアプリの詳細設定をしていきます。
この詳細設定によって、具体的にどのような機能を実装するか選択することが出来ます。
❶ ダッシュボード機能の設定
トップページをダッシュボードにする機能。後述する「グラフ・カスタムリスト」を貼り付けることで、登録されたレコード情報を集計することが出来るようになる。「使用する」にチェックを入れなかった場合、レコード一覧表示画面がTOPページになる。
今回のアプリはTOPページでタスクの集計を行いたいので、この項目にチェックを入れます。
❷ ワークフロー機能の設定
領収書アプリなどを開発する際に必要となる「決裁機能」を実装するために必要となる設定。
今回のアプリは上司の決裁等が必要ないので、この項目にチェックは入れません。
❸ レコード別権限設定
登録するレコード毎に閲覧・編集範囲に制限を設けることが出来る機能。
今回のアプリは閲覧・編集の範囲に制限が必要ないので、この項目にチェックは入れません。
❹ レコード状態管理の設定
「未対応」「処理中」「完了」等のレコードの状態を管理を出来るようにする設定。今回のようなタスク管理アプリの作成には欠かせない機能。状態管理を使用する場合、後述する❺の「コメント機能」も同時に実装しなければ状態の編集を行うことが出来ないので注意。
今回のアプリはレコードの状態を管理したいので、この項目にチェックを入れます。
❺ コメント機能の設定
レコード毎にコメントを入力出来るようにする設定。前述したレコードの状態管理もコメント欄で行うため、レコード状態管理機能を実装した場合にはこのコメント機能も実装しなければ意味がないので注意が必要。
今回のアプリはレコード状態管理機能を実装するので、この項目にチェックを入れます。
❻ 閲覧履歴の設定
レコード毎に閲覧履歴を表示するための機能。特定の人物がそのレコードを閲覧しているのを確認する必要がある情報を取り扱う際に実装すると良い。
今回のアプリは閲覧履歴を確認する必要がないので、この項目にチェックは入れません。
❼ アプリ基本情報登録
「登録」のボタンを押すことで、今まで入力したアプリの基本情報を登録することが出来る。登録した基本情報はいつでも編集可能になっている。
これでアプリの基本設定は終了です
メインレコード設定
ここからはいよいよ本格的にアプリに機能を実装していきます。
アプリの基本情報設定を終えると、アプリのメインレコード設定画面に遷移します。
その前に、そもそも「レコード」とはどの様なものなのか確認しておきます。
メインレコード項目はエクセルシートの上部欄を作成するようなイメージで設定する
「レコード」は、エクセルのシートをイメージすると理解しやすいかと思います。
予め設定された項目に対して、データが入力されているもの…それがレコードです。
つまり、このメインレコード設定で行う作業とは、エクセルシートでは上部欄に当たる「項目名」を設定していくことになります。
ドラッグ＆ドロップでレコード項目を作成する
アプリを1から開発する場合、レコード項目の作成するのも一苦労ですが、サスケWorksならば直感的にこれらの作業を行うことができます。
まずはメインレコード項目作成画面の見方から確認していきます。
❶レコード項目の雛形一覧
❷開発中のアプリ設定
具体的には、以下のGIF画像のように➀の項目を➁にドラッグ＆ドロップすることでメインレコード項目を設定することが出来ます。
メインレコード項目の詳細設定を行う
ここからは、作成したメインレコード項目の詳細設定を行っていきます。
❶レコード項目名の編集
ペンマークのボタンを押すことで、レコード項目名の編集を行うことが出来ます。
編集した名前は完成したアプリで実際に使うものになりますので、ユーザーが直感的に理解しやすい名前に変更しましょう。
❷詳細設定ボタン
歯車マークのボタンを押すことで、詳細設定の編集を行うことが出来ます。
メインレコード項目の種類によって設定できる内容が異なるようなので、それぞれ実装したい機能に見合った設定にしていきましょう。
ここでは、「ユーザー選択」のレコード項目の詳細設定画面を見ていきます。
（「ユーザー選択」は、予め入力を許可されたユーザー名をプルダウンから選択する形式の項目になります）
❶特定のグループに含まれるユーザーを選択する方法
事前に「サスケ」に登録しているグループを選択することで、そのグループに含まれるユーザー名がプルダウンに表れ、選択対象とすることが出来ます。
❷特定のユーザーを選択する方法
事前に登録されているユーザー名をここで選択することで、そのユーザー達がプルダウンに表れるようになります。
❸ユーザーの選択数は「一人を選択」で固定されています。
❹初期値の選択
レコードを登録する際に初めから作業者の名前を入れることを可能にする項目です。
❺必須項目
この「ユーザー選択」の項目が未入力のままではレコードを登録出来ないようにする設定です。
未入力のままでは困る項目にはこのチェックボックスにチェックを入れましょう。
入力内容の保存
画面右上の赤い「変更を保存する」ボタン（❶）を押すことで保存を行うことが出来ます。
このボタンを押すことでサブレコードも作成することが出来るようになりますが、今回は必要ないので割愛致します。
サブレコードの使い道
サブレコードは、１つのメインレコードに複数登録していくことが可能です。
そのため、メインレコードの登録時には入力することが困難な補足内容がある際に、サブレコードが活躍すると考えられます。
具体例を挙げると、例えばメーカーが自社製品情報の管理アプリを開発する際、毎年新型商品を発売するならばメインレコードには「製品の種類」を、サブレコードに「型番別情報」を入力していくことで、新型商品を開発した場合のみサブレコードを追加するということが可能になります。
ダッシュボードの作成
残るはダッシュボードの作成のみとなりました。
ここからはアプリ開発ではなく「個人設定」の分野になりますので、下図❶の「アプリを開く」のURLからアプリを開いて作業していきます。（URLに一部モザイク処理を施しています）
ダッシュボード登録前のトップページ
現在はダッシュボードを登録していないので、アプリのトップページは下図のような状態になります。
また、本アプリでは「レコード」を「タスク」と書き換える設定にしております。この設定は先程のアプリ開発画面のレイアウト設定から変更可能です。
❶タスク（レコード）一覧の表示
アプリを使用していく中で登録されたレコード情報を一覧表示するページに遷移するボタンです。
❷タスク（レコード）の登録
レコードを新規作成するページに遷移するボタンです。
❸ダッシュボードにコンテンツを追加
後述する「グラフ・カスタムリスト」をダッシュボードに追加するためのボタンです。
ただし、ダッシュボードにこれらを追加するためには、先にグラフ等を作成しておく必要があります。
❹ダッシュボードの設定
表示する「グラフ・カスタムリスト」の表示設定を変更することが出来ます。
主な使い道としてはグラフのサイズや配置を調整することになるかと思います。
タスク（レコード）一覧表示画面からグラフを作表する
グラフ・カスタムリストは「タスク（レコード）一覧」のページから作成することが出来ます。
また、いくつかレコードが登録されていなければ集計する意味もないので、今回は適当なレコードを事前に登録しておきました。
グラフの作図は上記画像の三点マークから「集計グラフの作成」ボタンを押すことで作成することが出来ます。
「集計グラフの作成」ボタンを押すと上記画像のようなダイアログが表示されます。
ここでは以下のような作業を行うことが出来ます。
❶グラフ名の設定
作成したグラフをダッシュボードに貼り付ける際に見つけやすくするため、区別しやすい名前に設定するのがおススメです。
❷グラフグループの設定
複数のグラフをまとめて表示するための機能です。
右側のフォームにグループ名を入力グループをして新規登録することで、左側のプルダウンからグループを選択することが出来るようになります。
❸グラフの種類の選択
「棒グラフ」「折れ線グラフ」「円グラフ」「進捗グラフ」の４種類からグラフの種類を選択することが出来ます。
また、ここの選択によって❹のグラフ形状の選択肢が変化します。
❹グラフの形状
グラフの形状を選択できます。
❺ラベル項目の設定
この項目によって、何のデータを基準にグラフを集計するのか選択することが出来ます。
❻データ項目
「グループ化」ボタンを押すことで、ラベル項目のデータを属性ごとに比較することが出来るようになります。
これによって、多角的にデータを分析できるようになります。
❼共有設定
他のユーザーとグラフを共有するか選択することが出来ます。
共有した場合、他のユーザーもダッシュボードにこのグラフを張り付けることが出来るようになります。
これらを設定していくと、以下のようなグラフを作成することが出来ました。
ユーザー別に、どれくらいの優先度のタスクがいくつ溜まっているかを集計するグラフになっています。
作成したグラフは後ほどダッシュボードに貼っていきます。
タスク（レコード）一覧表示画面からカスタムリストを作成する
カスタムリストとは、目的のレコードのみ抽出・集計したリストのことです。
これを使うと、「レコードの状態が未対応のまま３日以上経過しているレコード」や「締め切りまで1週間を切っているレコード」を洗い出すことが可能になります。
カスタムリストを作成するには、まず上記画像の「絞り込み」ボタンを押します。
すると、下記画像のような絞り込みオプションが表示されるので、それぞれの項目を入力していくことで欲しいレコードのみ抽出出来るようにします。
❶ユーザー選択
ユーザー別に絞り込みを掛けたい場合、この欄から設定を行うことが出来ます。
❷タスク名
タスク名を設定することで、ダッシュボードに貼り付けるタスクを区別出来るようにする。
❸登録したレコード項目別絞り込み条件
登録したレコード項目をどのように絞り込むかを選択することが可能です。
レコードの種類によって提示される選択肢が異なるので、それぞれに適した絞り込みを行うことが出来ます。
今回は以下のように設定しました。
絞り込み内容を入力した後、❶の「詳細検索」ボタンを押すとレコード一覧に絞り込み条件が適用されます。
この状態で❷の「保存名」を入力して「保存」ボタンを押すと、今の絞り込み条件をカスタムリストとして登録することが出来ます。
ダッシュボードにグラフ・カスタムリストを貼り付ける
それでは、先程作成したグラフ・カスタムリストをダッシュボードに貼り付けていきます。
まずはトップページの❶のボタンをどちらか押すと、以下の画像のようなダイアログが表示されます。
❶タイトル
ダッシュボードに貼り付けたいグラフ・カスタムリストの名前と同一のものでよろしいかと思います。
名前が思い出せない場合は一旦飛ばして他の項目から埋めていくと、グラフ等の名前を確認してからタイトルを決めることが出来ます。
❷種類
グラフかカスタムリストかを選択出来ます。
この項目を入力すると下にプルダウンが表れ、そこからどのグラフ・カスタムリストを貼り付けるのか選択します。選択肢はレコード一覧表示画面で設定したグラフ・カスタムリストの名前が表示されるので、ここを確認してから❶のタイトルを決めるのもよろしいかと思います。
❸サイズ
ダッシュボードに貼り付けるグラフ・カスタムリストのサイズをここで設定出来ます。
完成
ダッシュボードに貼り付けていくと以下のようになりました。
これで、欲しい情報を集計した状態で確認出来るようになっています。
使ってみた感想
今回は初めての開発だったので、レコードの詳細設定を一つ一つ確認しながら作業を行ったため、約10時間程度掛かってしまいました。しかし、おそらく慣れてしまえば１時間も掛からない作業量だったのではないかと思いました。
また、サスケWorksは公式アプリをインストールすることでそのアプリの設定画面を開き編集することまで可能なので、気に入ったアプリや面白い機能の実装方法のアイディアがいくらでも転がっているのが魅力的でした。
簡単に登録・集計したいデータがあれば、また使ってみたいと思います。