対象読者
- CSSテンプレートで管理画面開発をしようとしている方
- とにかく早く管理画面を作りたい方
- 管理画面開発の進め方で悩んでいる方
この記事の背景
私はローコードで管理画面を構築できる『クエリア』を作っています。
私自身もエンジニアなので、世の中のエンジニアには、メインのプロダクト開発に100%のリソースを使っていただきたいという思いでクエリアを開発しています。
最近では、お客様も増え、良いフィードバックをいただける機会も増えてきました。
その中で、BootstrapなどのCSSテンプレートを利用するよりも、ローコードで管理画面や社内ツールを開発したほうが便利になる可能性があるということを、もっと多くの方に知っていただきたいと思ったのが、この記事を書こうと思った経緯です。
CSSテンプレートも結局フロントエンドエンジニアの仕事
CSSテンプレートも結局はフロントエンドエンジニアの手を動かさなければいけません。
なので、以下の課題が残ります。
- フロントエンドエンジニアが一度メインプロダクトの開発の手を止める必要がある
- バックエンドやデザインサイドとのコミュニケーションは発生する
そもそも、管理画面の課題は手を動かす時間も課題ですが、それ以上にコミュニケーションにあると思っています。
CSSテンプレートはあくまで、フロントエンドエンジニアの手を動かす時間を少しだけ省略するものでしかありません。
管理画面開発に関わる人を減らす
それでは、管理画面開発を本質的に改善するために、関わる人を減らし、コミュニケーションコストを削減するにはどうすれば良いかを検討していきます。
一般的な管理画面開発
まずは、一般的な管理画面開発を見ていきます。
| イベント | 発生するコミュニケーション |
|---|---|
| 1. 課題が出現する | - |
| 2. PMが課題(と解決策)をIssueにする | 課題発案者にヒアリングをするなどのコミュニケーションが発生 |
| 3. エンジニアやデザイナーが解決策を検討する | 解決策の検討でコミュニケーションが発生 |
| 4. デザイナーがデザインをする | 課題発案者にヒアリングをするなどのコミュニケーションが発生 |
| 5. バックエンドエンジニアがロジックを作成する | デザイナーとフロントエンドエンジニアでのデザインファイルの受け渡しが発生し、コミュニケーションが発生 |
| 6. フロントエンドエンジニアが画面を構築するる | APIやデータ構造の仕様受け渡しが発生し、コミュニケーションが発生 |
上記のうち、2と3の課題と解決策に関わるコミュニケーションは、とても大切なものだと思います。逆にここを疎かにすると、ちゃんと使われる管理画面は開発できません。
しかし、上記5と6で発生するコミュニケーションは、そこまで高度な機能が必要とされない社内向け画面の開発において、無くせるのであれば無くしたいコミュニケーションであると思います。
実際に関わる人を減らしてみる
今回は、最初に紹介したクエリアというツールを利用して、管理画面開発に関わる人数を減らし、コミュニケーションコストを削減する方法を考えてみます。
クエリアは、UIの構築は限りなくシンプルに、ロジック(データソースへのクエリ)は限りなく柔軟に実装できるように設計してあります。
なので、今回はデータ構造やデータソースへの理解があるバックエンドエンジニア、もしくは、多少エンジニアリングの知見があるPM的な立場の人1人で社内ツール、管理画面を開発する例を挙げます。
| イベント | 発生するコミュニケーション |
|---|---|
| 1. 課題が出現する | - |
| 2. PMが課題(と解決策)をIssueにする | 課題発案者にヒアリングをするなどのコミュニケーションが発生 |
| 3. バックエンドエンジニア or PMがクエリアで管理画面を開発する | - |
見ての通り、最初の課題発案者のヒアリングでのコミュニケーションは発生するものの、管理画面開発のフローがとてもシンプルになったと思います。
このフローでは、PMとバックエンドエンジニア(場合によってはPM1人)で管理画面や社内ツールの開発が完結します。
このように、開発の一部を効率化する方法も良いですが、もう少しドラスティックに関わる人を減らす方法を検討してみても良いのではないでしょうか。
さいごに
今回はCSSテンプレートを使った管理画面開発とローコードツールを使った管理画面開発について紹介をしてきました。
管理画面開発というのは、進めたくてもなかなか進まずに、後回しにされているケースが多いと思います。ぜひそのような課題に悩んでいる方は、一度クエリアを試してみてください。
Discussion