https://labs.cybozu.co.jp/blog/akky/tags/chat/ Recent content in Chat on akky@サイボウズラボ・ブログ Hugo ja Thu, 17 Nov 2022 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/ Thu, 17 Nov 2022 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/ <p><a href="https://pomochat.com/">Pomochat</a>は、webブラウザ上で動くポモドーロタイマーに、チャットルームを組み合わせたサービスです。</p> <p>ただのタイマーサービスと違うのは、サービスを使っている人の間でテキストチャットができること。</p> <p>ポモドーロの1セッションは30分間で、そのあと10分の休憩。よく見るツールは25分作業して5分休憩が多いと思いますが、このあたり「正しい」決まりとかるんでしょうか。</p> <p><a href="https://pomochat.com/"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-break-time-screenshot_hu_863fc37e74e11722.webp 480w, https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-break-time-screenshot_hu_35db965b9e34955f.webp 627w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-break-time-screenshot.png" width="627" height="415" alt="" loading="lazy" decoding="async"> </picture></a></p> <p>30分間のセッション中はチャットルームはロックされ、誰も書き込めません。30分経つとセッション終了のアラームが鳴り、10分間チャットをすることができるようになります。</p> <p>チャットルームはサービス全体で一つのようです。Hacker News のトップページに掲載されて来た人たちが30人ぐらい。全体で同じタイマーを使っているようで、セッション中に入るとそのセッションが終わるまでは何もできません。</p> <p><a href="https://pomochat.com/"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-screenshot_hu_2c857779b5122b34.webp 480w, https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-screenshot_hu_b45caac8b89b38cb.webp 768w, https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-screenshot_hu_a04582f8145dca1f.webp 973w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2022/11/pomochat-communicate-with-random-others-during-pomodoro-break/pomochat-chat-screenshot.png" width="973" height="837" alt="" loading="lazy" decoding="async"> </picture></a></p> <p>PomoChat - 集中タイム中。最下段に残り時間が表示</p> <p>休憩時間のチャットでは、自分が住んでる国や都市の天気の話をしたり、知らないどこかの人と交流が始まっていました。</p> <p>個々のユーザーとプライベートチャットをすることもできるようですが、これも休憩中に限られています。他には右サイドバーでwebラジオ局がいくつか選局できますが、これは音楽を聴きながら作業する人のための機能のようですね。いつでもオンオフできます。</p> <p>ユーザー登録もできますが、ゲストでも使えるようになっていて、今いる人のほとんどはゲストで入ってきていますね。</p> <p>PomoChat は、一人で作業している時の孤独感を減らそうというwebサービスの一つだと思います。discord とかでそういうチャンネルに行くのでもいいとは思いますけれど。</p> <p>世界から来ている特に統一感のない人たちとチャットすることが習慣になるかどうかはわかりませんが、ポモドーロタイマーに興味がある、ぐらいの共通点はあるので、そういう仕事の習慣ややり方みたいなコミュニティの方向に伸ばせればあるいは固定ユーザーも集まるのかな。</p> <p>30分集中したら少し時間を残してこの記事が書けたので、休憩時間にまたチャットしてみようと思います。</p> <p>[追記] 人気が出たら有料にするとかのモデルかなと思っていましたが、メニューの中にポイントの購入と、ポイントを使った広告という機能があるようです。お金を払って告知したいことをチャットの人たちに宣伝できる、というのが一つの収入源として設計されているよう。</p> <p>via <a href="https://news.ycombinator.com/item?id=33628831">Hacker News</a></p> https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/ Wed, 08 May 2019 00:00:00 +0000 https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/ <p>ケビン・クッチャさん(Kevin Kuchta)の<a href="https://github.com/kkuchta/css-only-chat">kkuchta/css-only-chat</a> は、JavaScript を使わない非同期ウェブチャットサーバーです。</p> <p>二つ(以上)のブラウザからこのサーバに接続し、アルファベットをクリックしてメッセージを作り送信すると、同じサーバに接続した他のブラウザでも即時表示される、いわゆるブラウザチャットです。しかし面白いのは、このページで JavaScript は使われていないというところ。</p> <p><a href="https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/css-only-chat.png"><picture> <source type="image/webp" srcset="https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/css-only-chat_hu_f784542b6d5fabe3.webp 480w, https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/css-only-chat_hu_e211505fdb5a49f1.webp 768w, https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/css-only-chat_hu_cf8202e93c78cdd5.webp 959w" sizes="(max-width: 56rem) 100vw, 54rem"> <img src="https://labs.cybozu.co.jp/blog/akky/2019/05/css-only-chat-css-only-browser-chat/css-only-chat.png" width="959" height="793" alt="" loading="lazy" decoding="async"> </picture></a></p> <h3 id="送信側">送信側</h3> <p>CSS の :active 疑似クラスを使うことで、ある領域をクリックした際に、はじめて画像ファイルを読み込ませることができます。つまり、ボタンが押されたタイミングを画像ファイルの読み込みでサーバ側から検知できるということ。</p> <p>「同じボタンが2度目押された時は(画像はもうブラウザ側にロード済なので)サーバはわからないのでは?」となりますが、たとえば &ldquo;a&quot;&ldquo;a&rdquo; と押した時は、接続しっぱなしの状態で、元のボタンを隠し、新たに「&ldquo;a&quot;を押した」という情報を持った別の画像ファイル名を持つボタンを表示しているようです。これをすべてのボタンに対して行うことで、ボタンが持つ画像ファイルのパスが、過去のすべてのタイプ内容を保持することになります。</p> <h4 id="受信側">受信側</h4> <p>表示はどうやって更新してるのか、も解説されています。接続しっぱなしの状態で、これまで送った html が不要になったら、style タグを送って過去の要素を display:none で隠し、新たにページ内容を追記します。</p> <p>これを、自身か他のブラウザから新たなデータが届くまで待機しながら繰り返しているということ。じゃあソースコードはとても長くなるのでは、と思って Chrome でソースを表示しようとしましたが、何も表示されません。Firefox では何千桁もある一行のソースコードを確認できました。</p> <p>今のところデモサイトは用意されていないので、試すには自分で動かす必要があります。</p> <p>via <a href="https://news.ycombinator.com/item?id=19852105">Hacker News</a></p>