記事一覧へ

【無料配布】Discordの2大ストレスを解決するChrome拡張機能「Discord Text Decorator」を作りました

文字サイズ
見出し画像

こんにちは、のりです。

突然ですが、ブラウザ版Discordを使っていて、こんな経験ありませんか?

・太字ってどうやるの?
・改行しようとしたら送信されちゃった...

ぼくはコミュニティマネージャーとして、毎日Discordを使っており、メンバーさんから、この2つの声を何度も聞いていました。

正直、ぼく自身も何回やらかしたか分かりません。笑

「これ、なんとかしたいな」

そう思って、Chrome拡張機能を自作しました。

今回は、2つの「あるある」と、それを解決する「Chrome拡張機能」についてお話します。

2つの「あるある」

1:テキスト装飾がわかりにくい

Discordでテキストを太字にしたり、引用を入れたりするには、マークダウン記法を使う必要があります。

たとえば、

・太字にしたい → **テキスト**
・斜体にしたい → *テキスト*
・引用を入れたい → > テキスト

...これ、慣れていない人にとっては地味にハードルが高いんですよね。

「アスタリスク2個で囲むんだよ」と説明しても、「アスタリスクってどれ?」から始まることもあります。

結果どうなるかというと、みんな装飾を使わなくなる。

せっかくDiscordには便利な装飾機能があるのに、もったいないなって思っていました。

2:Enterキーで誤送信

これ、Discord使いの「あるある中のあるある」じゃないでしょうか。

Discordの初期設定では、Enterキー = 送信です。

普通のチャットアプリやメモアプリでは、Enterキーは「改行」ですよね。その感覚でポンとEnterを押した瞬間、書きかけの文章がそのまま送信される。

「あっ...」

ってなったこと、ぼくだけじゃないはず。

とくに長文を書いているときに途中で送信されてしまうと、相手にも「?」って思わせてしまう。

そのあと慌てて続きを送る、あの微妙な空気。

Shift+Enterで改行できることを知っている人もいますが、毎回Shiftを押すのが地味にストレスなんですよね。

解決策:Chrome拡張機能を作りました

先日は、Discordのテキスト装飾をスマホからかんたんに実現するためのツールを作りましたが、けっこう好評だったんです。

そこから、
「じゃあ、PCのブラウザ版Discordならもっと便利にできるんじゃないか?」

と思い、Chrome拡張機能として作り直しました。

名前は「Discord Text Decorator」。
2つのストレスを、まとめて解決するツールです。

1:右クリックだけで装飾完了

拡張機能を入れると、テキストを選択して右クリックするだけで装飾ができます。

やり方はシンプルです。

1. 装飾したいテキストを範囲選択する
2. 右クリックメニューから装飾を選ぶ
3. 装飾済みテキストがクリップボードにコピーされる
4. Discordの入力欄に貼り付ける

マークダウンの記号を覚える必要は一切なし。

対応している装飾は全12種類。

  • 太字 / 斜体 / 下線 / 取り消し線
  • ネタバレ(スポイラー)
  • インラインコード / コードブロック
  • 引用
  • 見出し(H1/H2/H3)
  • リスト

ポップアップ画面からも操作できるので、好みに合わせて使い分けられます。

2:Enterで改行、Shift+Enterで送信

個人的にいちばん気に入っている機能です。Chrome拡張機能を入れると、Discordのキー操作が切り替わります。

・Enter → 改行(普通の文章入力と同じ感覚)
・Shift+Enter → 送信

これだけで、うっかり送信がゼロになります。

「いやいや、それだけ?」って思うかもしれませんが、使ってみると分かります。

地味にストレスだったものが消えると、文章を書くこと自体が快適になるんですよね。

落ち着いて長文が書ける。改行も自由にできる。送信は自分のタイミングで。

これが本来の「テキストコミュニケーション」だよなって感じます。

導入方法(1分で完了)

Chrome拡張機能なので、インストールはとても簡単です。
動画とテキストで解説しますね。

<動画はこちら>

<テキストはこちら>

ステップ1:ファイルをダウンロード

配布しているZIPファイルをダウンロードして、お好きな場所に解凍してください。

Chrome拡張:Discordテキスト装飾|無料プレゼント

ステップ2:Chrome拡張機能ページを開く

Chromeのアドレスバーに「chrome://extensions」と入力して、アクセスします。

右上にある「デベロッパーモード」をONにしてください。

ステップ3:拡張機能を読み込む

左上の「パッケージ化されていない拡張機能を読み込む」をクリック。

さきほど解凍したフォルダを選択すれば、インストール完了です。
Chromeのツールバーに拡張機能のアイコンが表示されます。

使い方

テキスト装飾

  1. 装飾したいテキストをどこでもいいので入力(メモ帳でもDiscord上でもOK)
  2. テキストを範囲選択して右クリック
  3. 「Discord テキスト装飾」メニューから装飾を選ぶ
  4. 自動でクリップボードにコピーされるので、Discordに貼り付け

もしくは、ツールバーのアイコンをクリックするとポップアップ画面が開きます。テキストを入力して、ボタンを押すだけでも装飾できます。

Enter改行

こちらは何もしなくてOK。拡張機能をインストールした時点で自動的に有効になります。

Discordのテキスト入力欄で、いつも通りEnterを押せば改行。送信したいときはShift+Enter。

設定も切り替えも不要です。

拡張機能の受け取り方

この拡張機能(v1.0)は、ぼくのコミュニティに参加してくださった方に無料でお配りしています。

そして、今後の改良版・最新バージョンはnoteメンバーシップで配布していく予定です。

実は今回の拡張機能、開発してみて「ここをもっとこうしたい」というアイデアがどんどん出てきています。

こういったアップデートを継続的にお届けしていきます。

メンバーシップでは拡張機能だけでなく、コミュニティ運営やフリーランスの働き方についてのコンテンツも発信していますので、興味のある方はぜひ覗いてみてください。

のりのウラ話~仕事・お金・子育てのリアル~|のり

開発の裏話

Enter改行の実装はかなり苦戦しましたが、AIのおかげで解決しました。

エンジニアとしての技術力と、コミュマネとしての「現場の困りごとへの理解」。

この2つが掛け合わさったからこそ、作れたものだと思っています。

「不便」は「つくる理由」になる。

コミュニティの中で見つけた「困った」を、自分の手で解決する。そのプロセスは大変だけど、完成したときの達成感はかなりのものでした。

Discordを日常的に使っている方、ぜひ試してみてください。小さなストレスが消えるだけで、コミュニケーションがぐっと快適になりますよ。

最後まで読んでくださり、ありがとうございました。

🎁 ツール(v1.0)はこちらから受け取れます👇

Chrome拡張:Discordテキスト装飾|無料プレゼント

最後まで読んでくださり、ありがとうございました。