kintone ポータルの可能性を探る。

この記事は [kintone アドベントカレンダー 2021](https://qiita.com/advent-calendar/2021/kintone) の 7 日目の記事です。

# はじめに

**kintone ポータル。それは最後のフロンティア。**
![resized-resized-01-portal.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162138/7ed9526c-8f63-a8aa-9761-42115fffc3f0.png)
・・・かどうかは分かりませんが、kintone ポータルのカスタマイズと言う海はまだけっこうな青さではないかと思います。

kintone ポータルで大幅なカスタマイズが可能になったのは [2019 年 7 月](https://kintone.cybozu.co.jp/update/main/2019-07.html) のアップデートだったようです。
それから 2 年余りが経過している事になりますが、今のところこの kintone ポータルカスタマイズを素晴らしく有効に活用していると言う事例はあまり聞かれないように思います。
（何言ってんだウチはすげえ事やってるぜ！！と言う方がいらっしゃればすみません。）
しかしポータルは恐らくは可能性の塊。
漫然と kintone ってこんなだよね程度の理解で放っておくのはもったいないと思うのです。
そこで今日はこの辺をちょっと深堀りしていきたい。

念のため言っておきますが技術的な話はあんまりしません。そこそこの分量ですが最後まで読んで頂いても何かしらの問題解決に役立つみたいな利益が得られる事はないと思います。
ポエムだと思って頂ければ良いかと。

# kintone ポータルを考える。

ポータルの海が青いのは解る。
だがその青さは、航海に漕ぎ出すだけのインセンティブがあまりないから青いだけなのではないのか？
漕ぎ出したは良いが、寄港できるような陸地もなく、ただただだだっ広い永遠の水平線を彷徨うだけなんではないか？

そんな風に思うんです。

## そもそもです。

ぶっちゃけ、kintone ポータルってあんまり使いやすくなくないですか？
ポータルを構成する「お知らせ」とか「通知」「未処理」「スペース」「アプリ」といったブロックはポータルカスタマイズの文脈では **ウィジェット** と呼ぶようですが、これらは現に表示されている以上の事ができません。（設定でどうこうできると言うわけではないと言う事）
アプリの一覧性が低いとか、通知が多数になったときのカードの並び順の良く分からなさとか、「お知らせ」欄のいまいち気の利かなさとか、どうも痒いところに手が届かない感がある。
kintone を本格的に使い始めて来ると皆さん大なり小なり「もう少しなんとかならんのですか」って思いがふつふつと沸いて来るんでないかと思うんです。

## 「いやカスタマイズできますよ？」

いや解りますよ？
ガッツリ作り込めばかなり自由自在に作りたいように作り込めるって事は理解してますよ？
そのために [Kintone Portal Designer](https://chrome.google.com/webstore/detail/kintone-portal-designer/kmedncknheiegbelfmcfdlpcpfbnklmo) や[しっかりした手引書を用意してくれている](https://developer.cybozu.io/hc/ja/articles/360030856652-Kintone-Portal-Designer%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E3%83%9D%E3%83%BC%E3%82%BF%E3%83%AB%E3%82%92%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%97%E3%82%88%E3%81%86)のは解るんです。
![resized-resized-02-portal-extension.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162138/5b43dbab-2878-3ef3-61fb-3728e42c6fce.png)
でも、「ちょっとこうなれば良いのに」って言う小さな要望を実現するのに対する工数がデカすぎませんか？

どう言う事か？

例えばこう言う要望があったとします。

> 今のアプリの欄（＝「アプリ」ウィジェット）は最大 10 個しか表示できず、11 個目以降は「さらに表示」をクリックしなきゃ表示できないからなんとかして欲しい。
> アイコンでアプリは識別できるからタイル表示でいっぺんに表示できるアプリの数が多いほうが良い。

うんうん。解るよ。そうだよね。
スマホやタブレットなんかではアプリがグリッド表示で並んでますもんね。
あれで良いじゃんって気はしますよね。

> アプリがリスト表示になっているのは良いけど順番はコントロールできないか。

まあこれは「お気に入りのアプリ」を使えば良いとは思いますが、プルダウンをクリック →「お気に入りのアプリ」を選ぶと言う 2 アクションを要するのは面倒と言えば面倒ではありますね。
アイコンが 4 つ並んでてワンクリックでリストを切り替えられたら良いのにとは思いますよね。

> 「アプリ」ウィジェットは kintone 利用の中心になるんだから左の「お知らせ」欄の場所に表示させて、広く表示したい。

これも解ります。ウィジェットの表示位置やサイズを柔軟にコントロールしたいと言うのは要求としては真っ当ですよね。
ガルーンやサイボウズ Office ではポータルをかなり柔軟にカスタマイズできるわけですから、kintone ポータルも同じようにできたら良いのにとは思いますよね。

こう言うのは全部ポータルカスタマイズでできますよ。と言うのは全く以て正論です。
けれど、それって、既存のウィジェット類を置き換えるみたいなやり方になるじゃないですか。
API で[アプリ一覧を取得](https://developer.cybozu.io/hc/ja/articles/202931674#step2)して、生の JS + HTML + CSS なり [React](https://ja.reactjs.org/) なり  [Vue.js](https://v3.ja.vuejs.org/) なり [TailwindCSS](https://tailwindcss.com/) なりでうまいことレイアウトやらインタラクションやらを作り込んで、`kintone.portal.getContentSpaceElement()` で取得した要素にガツーンはめ込んでいって、役割がかぶる標準のウィジェットは非表示にするって言うアプローチになるじゃないですか。

いやいやそれは面倒が過ぎるんです。
単にいっぺんに表示できるアプリを増やしたりうまいこと表示順をいじったりウィジェットの位置や大きさを変えたりしたいだけなんです。
もう少しポータルのレイアウトを柔軟にしたいだけなんです。
と。
言う程度のささやかな願いを叶えるための工数としては払えない気がするんです。

## 「だったらもう好きに DOM いじれよ。」

いやそれはもちろんそうですよ？
言っても我々はホラ誇り高きエンジニアですから。
DOM いじれば何でもできるだろってのは良く解ってるんです。
既存の「アプリ」ウィジェットをまるっと書き換えちゃえばタイルビューだって実現できるでしょってのは話としては解るし、正直その程度は大変でもなんでもない。
でも kintone 的には **「DOM 操作は禁じ手ですぜ。やりたいならやっても良いが今後のアップデートで酷い目見ても知ったこっちゃないですぜフフフ・・・。」** と言うスタンスなわけじゃないですか。

だったら標準機能の範疇でもう少しなんとかできるようになって欲しいんですよ。

## 「そこら辺はもう個々の要望レベルの話ですし・・・。」

そうだと思います。
公式サイドとしてもそう言うスタンスなんだと思います。
むしろパートナーさんが勇気を持って未踏の航海に漕ぎ出すことを期待してますよ。と言う事なんだと思うんです。
そこがおたくらの飯の種でしょう。と。

その論法は解る。

けれども、あくまで現時点と言う話であれば、豊富できめ細かな API が提供されているアプリカスタマイズと比較し、ポータルカスタマイズはまだまだできる事が不足していると言わざるを得ない。

例えば、上述の Kintone Portal Designer でカスタマイズを作り込もうとすると、「通知」や「未処理」といったウィジェットは諦めなければならない。
これらの情報を取得する API が用意されていないからです。
これらのウィジェットを残しつつ柔軟なレイアウトを実現するには先に言及した `kintone.portal.getContentSpaceElement()` を使う事になるでしょうが、これはこれで横串でガッツリレイアウトを持っていくのでニーズに合わない場面はあるでしょう。
むしろ現行のレイアウトで言えば「お知らせ」ウィジェットの中身の要素を取得できる API があった方が使い勝手としては数段良いのではないかと思います。

と言うかやっぱり kintone アプリで言うところの「スペース」フィールドのようなカスタマイズのためのコンテナをポータルの任意の場所に任意の大きさで差し込めるような柔軟さはなんとしても欲しいところですよね。
正直なところ話はそれからだ。と言う気はします。
それくらいの道筋は公式側で立てて欲しいですよ、と。
DOM 操作と言う禁じ手に手を染めるリスクを無制限に負うのもちょっと辛すぎる気がするんです。と。特にそれで商売をしようとしている側からしてみると。
荒波に漕ぎ出すのも吝かではないですが、かんたんな海図とコンパスぐらいは支給してくれると嬉しいですよ、と。
言うわけです。

## こう言うのがあるとぼくらはもっと頑張れますよ。

ポータルカスタマイズではまだまだできることが足りていないと言う話をしました。
じゃあ何ができたらもっと勇気を持てるか。荒波に立ち向かう情熱の火種にできるか。

ざっくりと挙げていきます。

### 通知を取得・操作できる API が欲しい

これはむしろ存在しないのが辛すぎるレベル。
確か去年（2020 年）の hack だかでこのへん非公式（非公開）のエンドポイントを駆使してうにゃうにゃやっていると言うお話を伺いましたが、これは公式で用意すべきではないでしょうか。
通知一覧を取得したり既読にしたりする  API があれば、 Twitter みたいにタイムライン的に表示したり一挙に既読にしたり通知のインクリメンタルサーチみたいな事もできるようになるでしょう。
と言うかむしろ能動的に通知を出せるような API があれば良いのにとも思います。

### アプリをウィジェット化できると良い

今の「お知らせ」ウィジェットにもアプリを貼り付ける機能はあります。
けど、これは任意の一覧やグラフを選んで表示するだけですし、アプリ側に仕込んだスクリプトでイベントが発火するような事もありません。
これを、例えば、個々のアプリのスクリプトでも `portal.show()` イベントや `space.portal.show()` イベントが発火するようになれば、つまりポータルに貼り付けたアプリが表示されたイベントをキャプチャーできれば、これは一気にいろんな可能性が広がると思うのです。
さらに言えば、今は普通の一覧かグラフしか表示できませんが、「カスタマイズ」の一覧も表示できるようになれば [弊社の製品](https://smartballoon.jp/kintone/plugins) 的にもものすごい売りどころができる気がするかな、なんて。
で、こう言うのを、「お知らせ」ウィジェットの中にではなく、他のウィジェットと同レベルで配置できるようになれば kintone ポータルのカスタマイズ性は無限に広がると思うんです。
GrapeCity さんの [krewDashboard](https://krew.grapecity.com/products/krewdashboard.htm) みたいなイメージですよね。

### ポータルでもプラグインが使えるようになると良い

これはいつかできるようになるかも知れませんね。
我々ベンダーサイドとしては今や遅しと手ぐすね引いて待っている感はあります。

### ポータルとは直接は関係ないですが・・・

ここ、↓
![resized-resized-03-header.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/162138/d9780c37-b78c-cd2d-7c97-4d0b32a4bef0.png)
有効活用したいですよね。
このスペースは縦スクロールしても必ず表示される場所で、そのくせ特に何にも利用されておらず、API などでアクセスするすべもない場所です。
なんと言うか kintone の一等地みたいな場所なので、死なせておくには惜しいと思うんです。
ちょっとしたお知らせとかを掲示するのに使えそうですよね。
あと GNOME の目玉みたいなやつとか。

こういった環境面が色々整ってくれば、青すぎて誰もが飛び込むのを躊躇しているように見える kintone ポータルの海に我先にと飛び込む勢が現れてくるはずなのです。
と言うか少なくとも弊社は飛び込みます。たぶん。

# まとめ

と言うわけで。
kintone ポータルもっとなんとかなれ！と言う願いをつらつらとだらだらと訴えるだけの特に何の役にも立たない本日の記事でありました。
最後までお読みくださりありがとうございました。
明日は [@cal_mgc](https://qiita.com/cal_mgc) さんの出番です！

# 最後に宣伝を 1 つ。

本日 2021 年 12 月 7 日と明日 8 日は [Cybozu Circus 大阪](https://days.cybozu.co.jp/circus/) が開催されます。
手前味噌ながら弊社も [自社製品](https://smartballoon.jp/kintone/plugins) や [サービス](https://smartballoon.jp/kintone/lp/development/) を出展しています。
ご来場の折には是非弊社ブースへもお立ち寄りください！
ささやかながらノベルティも準備しております！
私もブースに立ちますので、「Qiita 読みましたよ！」とお声がけ頂けますと大変励みになります！