リモートワーク中、家族に画面を覗かれて変な空気になったので、Chrome拡張機能を開発している

DMMアドベントカレンダー18日目の記事です。
昨日は、@matsuda-hirokiさんの「なにもしてないのにEC2インスタンスが壊れた」でした。

奥さん「何見てるの？」

こんにちは。DMM.comの@tmitsuoka0423です。

今年4月に電子書籍事業部にジョインし、ずっと自宅でリモートワークをしています。
電子書籍事業部では、一般向け電子書籍サービスであるDMM電子書籍と、成人向け電子書籍サービスFANZA電子書籍の両方の開発を行っています。

そんなある日、悲劇は突然起こりました。

アダルトコミック画面の機能を開発していた夕方のこと。
奥さんが仕事から帰ってくるなり、私のディスプレイを見て言いました。「何見てるの？」

リモートワーク中はディスプレイの覗き込みに注意

私は真剣に仕事をしていただけですが、家族から見るとそうは見えないみたいです。
（仕事内容は事前に伝えているのに）
お子さんのいる方・二世帯住宅にお住まいの方はもっと注意が必要になるのではないでしょうか。

Chrome拡張機能「tile」を開発中

そんなリモートワーカーのために、Chrome拡張機能を開発しています。

HTML上の画像にぼかしを入れてくれます。

完成次第、公開します！

使い方イメージ

1．インストール後、Chrome右上のパズルマークをクリック、tileをクリックします。

2．ぼかすを選択します。

3．ページに表示されている画像にぼかしが入ります。

内部処理の概要

内部で行っていることはとてもシンプルです。
全てのimgタグを取得し、CSS関数のblurを利用してぼかしをかけています。

constimgList=document.getElementsByTagName("img");for(leti=0;i<imgList.length;i++){imgList[i].style.cssText="filter: blur(8px);";}

上記のコードを利用して、拡張機能をインストールせずに、Chrome DevToolsのConsoleタブから実行することも可能です。

まとめ

開発中のChrome拡張機能「tile」の紹介しました。
リモートワークをより働きやすくするためのアプリを今後も開発していきます。