command(ctr)-Enter vs Shift-Enter vs Enter で送信について調べてみた
本エントリーはAdvent Calendar 2021「初めてのアドベントカレンダー Advent Calendar 2021」の15日目のエントリーです！
きっかけ
オンラインプレゼンをスムーズにできるスライドアプリの「Smoothie Slide」というアプリケーションを開発していて、先日行われた学生エンジニアのピッチコンテストの技育展に向けて機能強化を行いました。流れるコメント機能を実装しました。メンバー内で改善するにあったって、コメントの送信はボタンを押すだけではなく、キーボード操作で送信できた方が使いやすいという話になり、「Shift-Enter」で送信の機能を作りました。
実際に作ったアプリで発表したのですが、質問コーナーで「command (Ctr)-Enter」で送信の機能はないのか？という質問をもらい、「Shit-Enter」で送信できます（送信ボタンの横にも書いてある）という返答をしたのですが、やはり「command (Ctr)-Enter」で送信の方がいいのかな？と思いました。
「Shift-Enter」を選んだきっかけは、
- 「command (Ctr) -Enter」だと、macやWindowsでキーボード配列が違うため、それぞれ対応する必要があった
- YouTube liveやメッセンジャーなど、「Shift-Enter」で送信ができた
という理由を話し合い決めました。ただ、広くは調べていなかったためどの形がメジャーかわかっていませんでした。
また、「改行したいのに送信されて変なところでメッセージが送られる現象」はよく起こるので、実際のアプリではどのように割り当てられているか気になっていました。
そこで、今回はチャットアプリなど送信ボタンがあるアプリについて、調べてみることにしました。
Smoothie Slideのコメント入力画面
調べるアプリ一覧
チャットアプリ
- Slack（WEB版, macOS版）
- Didcord（WEB版, macOS版） - LINE（macOS版）
- ZOHO connect
- Google chat
- Twitter DM
- Twitter （ツイート）
動画アプリ
その他のアプリ
調べられなかったアプリ
- Facebook：調査を協力できる友達がいなかったため
- messenger：調査を協力できる友達がいなかったため
- ツイキャス：使っていないため
調べられなかったアプリなどぜひコメントで返信していただけると助かります。
調べるコマンド
- 「Enter」
- 「command-Enter」
- 「control-Enter」
- 「Shift-Enter」
押した時に、「送信」「改行」「何もなし」のどれが行われるかを調べる。
注意：細かくはmacでは「Enter」は「return」という名前なのですが、今回は「Enter」に表記を統一しています。
調査環境
- MacBook Pro
- WEBアプリはChormeブラウザを使用
注意：Windows環境では調査結果が異なる可能性があります。
調査結果
チャットアプリ
Slack（WEB版）
Enterで改行
command-Enterで送信
Shift-Enterで改行
control-Enterで送信
Slack（macOS版）
スタンドアロンアプリでも同様の結果でした。
スタンドアロンアプリの方では、メッセージを入れると、右下に補助として「command+Returnで送信、Returnで改行」の補足が出てくる親切設計でした。
Didcord（WEB版, macOS版）
Enterで送信
command-Enterで送信
Shift-Enterで改行
control-Enter：何も起こらない
Discordの場合は、「Shift-Enter」は改行でした。
LINE（macOS版）
Enterで改行
command-Enterで送信
Shift-Enterで改行
control-Enterで改行
ZOHO connect
Enterで改行
command-Enterで改行
Shift-Enterで改行
control-Enterで改行
ZOHO Connectの場合は、全てで改行でした。送信（共有）がされるボタンはありませんでした。
Google chat
Enterで送信
command-Enterで送信
Shift-Enterで改行
control-Enterで送信
Twitter DM
Enterで送信
command-Enterで何もなし
Shift-Enterで改行
control-Enterで改行
Twitterでツイートを送信する時についても調べました
Enterで改行
command-Enterで送信
Shift-Enterで改行
control-Enterで改行
TwitterのDMとツイートで改行と送信が違うことを知りました。Twitter DMで改行と思ってEnterを押すのはこのためではと思いました。
動画アプリ
YouTube Live
Enterで送信
command-Enter：何もなし
Shift-Enterで送信
control-Enterで送信
動画のコメントなので、改行はされずほとんどのボタンで送信でした。
ニコニコ動画
Enterで送信
command-Enterで送信
Shift-Enterで送信
control-Enterで送信
こちらもYouTube liveと同様に全てのボタンで送信でした。
その他のアプリ
Trello
Trelloについても調べてみました。
カードを追加するまでとカード内を編集する動作で挙動が違ったのでそれぞれ列挙します
Trelloカード作成
Enterで送信
command-Enterで送信
Shift-Enterで送信＋詳細画面が開く
control-Enterで送信
Shift-Enterで送信をした時だけ、詳細画面が開くのが意外でした。Trelloのカードは作成した後に、詳細を書いたり、アクティビティを記録したりするので、Shift-Enterで送信をすれば、カードを作った後に、GUIでボタンを押すのを省略することができそうです。
Trello アクティビティログ
Enterで改行
command-Enterで送信
Shift-Enterで改行
control-Enterで送信
GitHub Projects
GitHubにもカンバンボードに近い機能があるのでそちらについても調べてみました。
Enterで改行
command-Enterで送信
Shift-Enterで改行
control-Enterで送信
Google フォーム
Enterで改行
command-Enter：何もなし
Shift-Enterで改行
control-Enter：何もなし
Google Formはキーボードで送信をすることはできなさそうです。
まとめ
最後に調査結果のまとめのグラフです。
| Enter | command-Enter | Shift-Enter | control-Enter | |
|---|---|---|---|---|
| Slack | 改行 | 送信 | 改行 | 送信 |
| Discord | 送信 | 送信 | 改行 | 何もなし |
| LINE | 改行 | 送信 | 改行 | 改行 |
| ZOHO connect | 改行 | 改行 | 改行 | 改行 |
| Google Chat | 送信 | 送信 | 改行 | 送信 |
| Twitter DM | 送信 | 何もなし | 改行 | 改行 |
| 改行 | 送信 | 改行 | 改行 | |
| YouTube live | 送信 | 何もなし | 送信 | 送信 |
| ニコニコ動画 | 送信 | 送信 | 送信 | 送信 |
| Trello（カード作成） | 送信 | 送信 | 送信＋詳細画面が開く | 送信 |
| Trello（アクティビティログ） | 改行 | 送信 | 改行 | 送信 |
| GitHub Projects | 改行 | 送信 | 改行 | 送信 |
| Google フォーム | 改行 | 何もなし | 改行 | 何もなし |
Enterで送信がなされているのは、Discord、Google chat、Twitter DM、YouTube live、ニコニコ動画という形でした。
command-Enterで送信は、今回調べたアプリの多くが送信に割り当てられていました。
Shift-Enterは、多くが改行に割り当てられていて、YouTube liveやニコニコ動画などの改行の必要がないアプリでは送信になっていました。
control-Enterは、半々ぐらいという形でした。
おわりに
Smoothie Slideのコメント機能は改行ができないので、YouTube liveやニコニコ動画のように、全て送信を割り当てて良さそうと思いました。（逆に、Shift-Enterだけを送信にしているのは不適切そうだと思いました。）
ハッカソンに参加するなどして、自分でアプリケーションを作る側になったことで、普段使っているアプリの真似したいところや逆にこのように作らないようにしようというのを意識するように、視点が変わって日々新たな発見の連続です。
明日の「初めてのアドベントカレンダー Advent Calendar 2021」は@psbss
さんのエントリーです。
文章管理テクニック記事らしいので楽しみです。