Mobile Factory Tech Blog

技術好きな方へ!モバイルファクトリーのエンジニアたちが楽しい技術話をお届けします!

突撃! 在宅の開発環境 2021年夏

はじめに

こんにちは。ブロックチェーンチームのエンジニア、 @nanamachi です。

tech.mobilefactory.jp

前回の記事ではたくさんの方に閲覧&コメントいただきありがとうございました。この記事から1年。モバイルファクトリーは日本のどこからでも働けるようになり、書籍購入、資格取得、セミナー参加、懇親会の支援制度などフルリモートに適応できるよう多くの変化をしてきました ( https://recruit.mobilefactory.jp/work-style/ )。その中で社員の環境もさまざま変わったことでしょう。 この変化を記事にすれば、閲覧数を稼げる 弊社の魅力を発信できるに違いない!という目論見で、初めてバズった記事にすがるエンジニア組織開発責任者の@kfly8から次のようなチャットが送られてきました。

kfly8: インターネット識者*1の @nanamachi さん、よかったら在宅開発環境の記事の2回目書きませんか?

nanamachi: インターネット有識者……🤔🤔🤔

ということで今回はリモートワーク開始から1年半、さらなる進化を遂げた在宅環境をごらんください! 前回の記事も合わせて読むとさらに楽しめます♪


01. デザイナー @momoyagi さん

在宅環境の様子を教えてください

  • 社用のディスプレイ2枚+Mac Book Pro
  • 電動昇降デスク
  • ハーマンミラーのチェア
  • 無線のヘッドセットマイク
  • Alexa echo dot
  • バランスボード

f:id:Nanamachi:20210721135240j:plain:w640

推したいポイント、改善したいポイント

オフィスと同じものではないですが、電動昇降デスクを導入して立ち仕事を可能にしました。バランスボードでユラユラしながら仕事してます。

どんな変化があったか教えてください

仕事環境の改善のために書斎を設けられる広さの家に引っ越しました。電動昇降デスクを導入、モニターやチェアも一新して開発環境をグレードアップしています。MTGなども毎日あるので、音周り環境もう少しよく出来るんじゃないかなーと思ってます。

フリーコメント

BGMはDJAlexaです。


02. エンジニア @nanamachi

在宅開発環境の様子を教えてください

すでに在宅で仕事ができる環境に満足してしまったので、次はモバイルモニターとコンパクトなキーボードでノマド環境を整備しました。

f:id:Nanamachi:20210721135858j:plain:w640

推したいポイント、改善したいポイント

モニター: EVICIV 13.3インチ モバイルモニター

持ち運び可能なモニターです。サイズとしてはA4用紙とほぼ同じくらい。ベゼルが薄いためMacとシームレスに作業できGOODです。 また、USB Type-Cケーブル1本で給電と映像出力の両方ができるのでケーブルがごちゃつかない利点もあります。

キーボード: VORTEX Core 47キー メカニカルキーボード

テンキーレスのキーボードから更にFunctionキーと数字キーなどを除いた、40%キーボードと呼ばれるジャンルのミニサイズキーボードです。 カスタマイズ性が非常に高く、設定次第ではフルサイズキーボード以上の使い勝手にすることが可能です。 自分はなるべくフルサイズキーボードに近い操作感を保つため、下記の配置にしています。

f:id:Nanamachi:20210721135917p:plain:w640

青字で書かれたキーは左親指に割り当てられたFnキーと同時に押すと入力されるキーです。 標準では右Spaceの一つ右のみなのですが、Fnキーを多用する配列にしたため押しやすい位置に移動しました。

その他こだわりの点はこんな感じ。

  • フルサイズキーボードの最上段をそのまま一つ下に下げた位置に配置
  • コーディングでも日本語入力でもよく使うハイフンを同時押し無しで押せる配置
  • ホームポジションで矢印キー*2にアクセスできる

特に数字・記号・矢印などのキーを短いストロークで打てる点が便利で、慣れたら戻れないという意見も納得です。

また、設定を変えたことによってキーキャップに印字されているキーと異なる配置になったためキーキャップも改造しました。 無地のキーキャップにプラモデルなどに用いる装飾シール*3をちまちま貼っていけば、オリジナルキーキャップの完成です。

f:id:Nanamachi:20210721135922j:plain:w640

アナログなモノづくりが久しぶりだったことありなかなか楽しかったです。

整備してみて

外に出る機会は少ないのですが自宅の中で場所を変えて仕事するだけでも気分転換になるのは良い発見でした。展開に時間もかからないのでおすすめです。


03. 事業部長 Sさん

在宅開発環境の様子を教えてください

  • ディスプレイ: EIZOの4Kディスプレイ
  • キーボード: HHKB HYBRID TYPE-S 無刻印
  • 机: FlexiSpotの電動式昇降デスクの脚にイケアの150x75の天板
  • 椅子: アーロンチェア
  • オーディオインターフェイス: UNIVERSAL AUDIOのAPOLLO TWIN X QUAD
  • スピーカー: GENELECの8320 GLM Studio
  • ウェブカメラ: ロジクールのC922n
  • マイク: オーディオテクニカのAT4040
  • 照明: Profoto C1 Plusを複数台

f:id:Nanamachi:20210721140010j:plain:w640
f:id:Nanamachi:20210721140015j:plain:w640

推したいポイント、改善したいポイント

前回記事からの進化としては、スタンディングデスク導入と、ビデオ会議時の音声品質の向上が大きなところです。

リモートワークが始まった当初は、映像の方に力を入れていて、ミラーレスカメラを使用したり、Blackmagic Design ATEM Miniを導入したりしましたが、結局、大事なのは映像より音声だという結論に至り、マイクやオーディオインターフェースなど試行錯誤を重ねました。 去年の夏頃にオーディオテクニカのAT4040とUNIVERSAL AUDIOのAPOLLO TWIN X QUADの組み合わせにしてからは非常に満足しています。 APOLLO TWIN Xでは、Neve 1084、Teletronix LA-2A、PULTEC EQP-1Aといったプラグインをリアルタイムにかけていて、ビデオ会議の相手に聞きやすい音声となるよう調整を行っています*4。 自分で壁に吸音材も取り付けました。

映像については、ロジクールのC922nでビデオ会議には充分なクオリティと判断して、机の上をなるべく広くするために映像関連の機材は撤去しましたが、Elgato MULTI MOUNTというスタンドを使って、カメラや照明などは必要に応じていつでも取り付けができるようにしています。

スタンディングデスクは気分転換で時々利用します。また、会社からハーマンミラーのセイルチェアと32インチモニターを送ってもらったので、リビングの隅にも作業スペースを作りました。 MacBook ProとHHKBだけ持っていけば自室とほぼ同じ環境で作業できるように、マウスやウェブカメラの機種、机の天板の色などは同じもので揃えています。


04. エンジニア @the96 さん

在宅環境の様子を教えてください

モバワークを活用して実家からの参戦です*5。 そこそこ田舎なので、休みの日には5kmくらい散歩して神社に行ったりしています。

  • 左ディスプレイ: LG ULTRAGEAR 27GN800-B (27インチWQHD)
  • 右ディスプレイ: IO-DATA LCD-MQ321XD (32インチWQHD)
  • ディスプレイアーム: エルゴトロン LXデュアル デスク マウント アーム スタッキング
  • MBPスタンド: Twelve South BookArc for MacBook
  • キーボード: Mistel Barocco MD770
  • キーボードの間にあるもの: Anker PowerWave 10 Stand (ワイヤレス充電器), タニタ TT-580 WH (質温度計)
  • 机: 幅145cm 奥行き60cmのL字デスク
  • 椅子: 中古のバロンチェア
  • オーディオインターフェース: UR12 + MG10XU
  • スピーカー: JBL 104-BT-Y3
  • マイク: sE Electronics X1

f:id:Nanamachi:20210806121932j:plain:w640

推したいポイント、改善したいポイント

おすすめ: 分割キーボード

キーボードが左右に分離しているので、肩を開いて自然な姿勢でタイピングすることが可能です。 普段は背もたれに身を預けて楽な姿勢で仕事しています。 あと、体の正面が空くので、資料を置いたり時計を置いたりワイヤレス充電器を置いたりできて便利です!

お気に入り: スピーカーとイヤホンの同時接続

スピーカーとイヤホンから同じ音を流していて、スピーカーの音量つまみを操作するだけでMTGに対応できるのがお気に入りです! MG10XUはWin機とMBPでマイクやスピーカーを共有するために使っています。

フリーコメント

推しに囲まれて仕事するのたのしいです


05. エンジニア うっひょいさん

在宅環境の様子を教えてください

開発者自身の筋肉のスケールアップ、体の軽量化を行った*6

Before

f:id:Nanamachi:20210721142636j:plain:w300

After

f:id:Nanamachi:20210721142700j:plain:w400 f:id:Nanamachi:20210803183249p:plain:w300
f:id:Nanamachi:20210803183219p:plain:w600
逆立ちしながら考えている様子

f:id:Nanamachi:20210721142639j:plain:w600
Before
f:id:Nanamachi:20210721142707j:plain:w600
驚異の-8.2kg!

推したいポイント、改善したいポイント

在宅開発環境で推したいポイントとしては僧帽筋と三角筋です。日々の自重トレーニングによって、僧帽筋や三角筋を鍛え上げ、長時間デスクワークをしても肩こり知らずです。 また、三角筋や体幹を鍛えればコーディングのときの実装で悩んだときは逆立ちしながら考えることが可能です*7

在宅開発環境で改善したいポイントとしては腸腰筋です。デスクワークのときの眠気覚ましにVシットや逆立ちをやってるのですが、腸腰筋が弱いので安定しなくて困っています。


06. エンジニア組織開発 @kfly8 さん

在宅環境の様子を教えてください

200cmの机をDIYして使っています。 夫婦で並んで作業するだけでなく、子供もお絵描きをしたりして気に入っています。 子供は横並びになったり、向かいに座ったりと好きなところに座ります。

1年が経ち、次の点を変えました。

  1. 腰が痛かったので、セイルチェアに変えた。デザインも生活空間にあっても違和感なし。最高。一脚は会社から譲渡してもらった。
  2. 机の角が痛かったので、削った。娘が楽しそうにヤスリがけをしていた。
  3. ディスプレイ背面、モニターアーム、ケーブル類を、スプレーで黒塗りをした。

最近は、モバイルプロジェクターのAnkerのNebula Capsule IIを購入して、子供が動画を観るのにはかどっています。左右の台形補正が入ったら、嬉しいなーと思う人生を過ごしています。

f:id:Nanamachi:20210721141354j:plain:w360
みかんは「愛媛まどんな」という品種で、美味しい

f:id:Nanamachi:20210721141453j:plain:w640
元々は白いディスプレイ背面、アルミ色のモニターアームでした。塗りました。

f:id:Nanamachi:20210721141506j:plain:w360
モバイルプロジェクターで動画を選んでいる様子

推したいポイント、改善したいポイント

正直、塗装は酔狂な人がすると思っていました。ですが、スプレー缶数本で生活環境に統一感を出せるので、非常にコスパが高く合理的。 買い換えるコストと比較したら、「いい仕事をした」と妻に褒めてもらえました。

※塗装は自己責任でお願いします。

フリーコメント

塗装風景はコチラです。趣味が活かせて良かったです。 https://twitter.com/kfly8/status/1343786958313594880


07. 採用担当 @overallfactory さん

在宅環境の様子を教えてください

◆ディスプレイ

ディスプレイは、もともと持っていたLGのモノと会社から譲り受けたDELLのモノを使用しています。採用の仕事柄Slackやメールをすることが多いため、ディスプレイの一つは縦型にしています。

◆机

机はリモートワークスタート共にFlexiSpotのスタンディングデスクに変更しました。眠くなったら立って仕事をしています。

◆キーボード

机にモノを増やしたくない+浅いストロークのキーボードが好みということで、Magic Keyboardを利用しています。ただ、キーボードに傾斜が欲しかったので、裏にキーボードスタンドを取り付けています。

◆配線

一日中家にいると、机や床が汚れるスピードがとても早いです。 毎日掃除をしたい人なので、コードやティッシュ、文房具などは全て浮かせるようにしています。浮かすは正義です。

◆ライト

会議や面談でテレビ電話をすることが多いので、デスクライトを買いました。 机の上のモノを増やしたくなかったので、USB給電でディスプレイ上につけられるライトを選択。 また、家でON/OFFを切り替えるのが得意ではないため、仕事の時と休憩の時で色を変えられるものを選びました。

f:id:Nanamachi:20210803184132j:plain:w640
f:id:Nanamachi:20210803184126j:plain:w640
f:id:Nanamachi:20210803184119j:plain:w640

推したいポイント、改善したいポイント

二点あります。 一つは照明へのこだわりです。 ライトの色で自分はON/OFFを切り分けています。 ONの時は昼白色、OFF時は電球色にして過ごしています。

もう一つは部屋から色を無くしたことです。 集中力が増すように、デスク周りはもちろん、家にある家具(カーテン、絨毯、小物)を全て茶色か白黒に変えました。


08. エンジニア @odan3240 さん

在宅環境の様子を教えてください

開発の作業はMacBook Pro と31インチのディスプレイがメインです。この31インチのディスプレイは会社の移転に伴い、昔会社で使っていたものを抽選で譲ってもらいました。基本的には MacBook Pro でコードを書いて、ディスプレイは Slack の周回、ブラウジング、コードリーディングに使用しています。 机は Amazon で横幅120cmのものをポチって使っています。FlexiSpot も検討したのですが、昇降機能は MUST ではないと考えてこちらにしました。 椅子は最近セイルチェアを購入しました。これは椅子について詳しくないため、会社で使用していて座り心地が良かったので同じセイルチェアに決めました。

Before

f:id:Nanamachi:20210721142459j:plain:w360

After

f:id:Nanamachi:20210721142449j:plain:w640
f:id:Nanamachi:20210721142504j:plain:w640

推したいポイント、改善したいポイント

推したいポイントは31インチのでディスプレイです。サイズが大きいため左右に分割してブラウザと Slack を開いていることが多いです。1枚のディスプレイで実質2枚分の働きをしてくれるのが良いところです。

改善したいポイントは机と配線です。 机を購入した当時は立って作業することはなかったので、昇降機能は MUST ではないと判断しました。しかし実際に机を使用しているうちに高さではキーボードのポジションに違和感を覚えるようになりました。なので次机を購入するときは FlexiSpot などの昇降機能が付いているものを検討したいです。

また配線はちょっとぐちゃぐちゃしているのをなんとかしたいです。HDMI の分配器など机の下に隠せるものはいくつかあるんですが、ゲームのイヤホンのコードなど、どうしても有線で繋ぐ必要があり机の上に配線を置く必要があるものを、いい感じに整理したいです。

フリーコメント

左の一回り小さいディスプレイはゲーム用です。お昼休みや退勤後即ゲームができる環境が整っています。息抜きも大事です。


Ex. @NortonSam1 さん

前回の記事で異色の存在感を放っていた @NortonSam1 さんは惜しくも先日退職されましたが、特別に回答していただきました! 今回はどのようになっているのでしょうか……?

在宅環境の様子を教えてください

職が変わり自宅での作業が皆無となった現在、転居先の住居は食事睡眠入浴以外の用途を果たさなくなりました。その結果荷ほどきもろくにせず、段ボールはそのまま簡易テーブルに早変わり。されど前回デスクの役割を果たしていたアイロン台は依然として健在です。

Before

f:id:Nanamachi:20210721142743j:plain:w500
f:id:Nanamachi:20210721142748j:plain:w250 f:id:Nanamachi:20210721142751j:plain:w250

After

f:id:Nanamachi:20210721142810j:plain:w500
f:id:Nanamachi:20210721142824j:plain:w250 f:id:Nanamachi:20210721142836j:plain:w250

推したいポイント、改善したいポイント

気に入っているポイントは特にありません。エアコンをつけるとくしゃみが止まらなくなるので転居先を探しています。強いてあげるならば山が近いことでしょうか。最近は仲良くなった地域住民に空き家を譲ってもらおうと頑張っています。

どんな変化があったか教えてください

職が変わりました。現在は木こり見習いとして活動しています。椎茸栽培にも手を出しています。夏にはわな猟の免許を取得します。昨日は乗っていた軽トラックの後輪が走行中に外れて田んぼにすっとんでいきました。


おわりに

ここまで読んでいただきありがとうございました!

「仕事しやすい」から一段先のこだわりが見えてきて、1年前よりも更に個性が出てきたように思います。それぞれ違う最適な環境を作り上げていけるのはリモートワークならではの醍醐味ですね。

モバイルファクトリーに働き方についてさらに詳しく知りたい方は下記のサイトからどうぞ! 在宅環境こだわる方もこだわらない方も募集中です♪ まずは気軽にお問い合わせください。 recruit.mobilefactory.jp

*1:本当にこう書いてありました。違うのに!

*2:当然HJKLです

*3:デカールシールというそうです

*4:実際に聞いたところ非常に音質がクリアで良かったです

*5:ここ2年の新卒の方は特に実家からリモートワークしている方が多いようです

*6:これも広い意味では在宅環境の様子ですね!!!!!

*7:タイピングも逆立ちしながらするのでしょうか

モバファクのフロントエンドランチ会の紹介

こんにちは。ブロックチェーンチームのソフトウェアエンジニアの id:odan3240 です。

この記事では昨年の9月から社内で取り組みを続けているフロントエンドランチ会について紹介します。

フロントエンドランチ会とは

第2木曜と第4木曜のランチの時間 (13:00-14:00) にフロントエンド技術に興味がある有志のメンバーがオンラインで集まってランチする会です。

この会の目的は以下の通りです。

  • フロントエンドに関する技術の情報交換
  • フロントエンドに興味がある人の親睦を深める

この会で実際に行っていることは以下の通りです。

  1. 13時頃にみんなぼちぼち集まってくる
  2. その日のファシリテーターを2人決める
    • ファシリテーターは約30分で交代する
  3. ファシリテーターの画面を共有しながら JSer.info の最近の記事を開く
  4. ファシリテーターが記事の内容を読み上げつつみんなで深堀りしていく
    • わからない単語/概念はないか?
    • 実際に仕事に活かせそうか?

企画しようと考えたきっかけ

物理出社時代のランチでの雑談の再現

東五反田オフィスには「リフレッシュルーム」と呼ばれるランチを食べるための部屋がありました。そこで相席になったエンジニア同期とゆるいテックトークをするのが当時の楽しみでした。しかし昨年の2月からのリモートワーク化に伴いこの時間が失われてしまいました。

なんとかゆるいテックトークを会社の人とオンラインでやりたいという気持ちを抱えて半年が過ぎていました。

他社のフロントエンドランチにあこがれて

ゆるいテックトークで思い出したのはサイボウズさんのフロントエンドランチ1でした。自分がこの催し物を知ったのはコロナ禍以前で、参加者の方が Twitter でその様子を実況しているのを見て、「羨ましい」「いつか参加してみたい」などと考えていました。この理由としてはお互いの知見を広げられることや単に自分がテックトークをするのが好きだからです。

このときはもし転職するならこういう文化がある会社が良いなぐらいの気持ちでした。しかし上記のランチでのテックトークをオンラインで復活させたいというモチベーションと掛け合わせたときに、文化がある会社に行くより今いる会社で文化を作るほうが面白いという考えに至りました。

この流れがあり、去年の9月にフロントエンドランチ会を企画することにしました。

実際の様子

2021-07-08 に開催されたフロントエンドランチ会の様子を紹介します。

この日は 2021-07-06のJS: TypeScript 4.4 Beta、immutable-js 4.0.0-rc.13、petite-vue - JSer.info をみんなで読みました。このときのサマリーを紹介します。

  • TypeScript 4.4 beta の useUnknownInCatchVariables は顧客が求めていたものと言う話になりました
  • imutable-js は OSS の運用周りでなにかあったらしい
    • 大変そう
    • 最近だと immer をよく聞くよね
  • 社内で Vue.js を採用しているプロダクトが多いため petite-vue に関心が集まった
    • HTML の構文に違反しないように v-effect が新しく導入されたのでは
    • コミットログを見返すと Evan You が約1週間で petite-vue をフルスクラッチから実装していてやばい
  • actions/setup-node にキャッシュ機能が入ったのは便利そう
    • ただ actions/setup-node の存在と UNIX 哲学ことを考えると諸説あるのでは
  • The State of WebAssembly 2021 について
    • The State of Hoge を見ると年末感出るけどまだ6月w
    • やっぱ Rust が多いよね
  • polyfill とは別に ponyfill という概念があるんだ

実際にフロントエンドランチ会を開催してみた感想

第一に企画当初の狙い通り、定期的にフロントエンド技術についてキャッチアップすると技術的な雑談をする時間を確保できたのが嬉しい点でした。

企画当初には考えてなかった嬉しい点もありました。それは会社に入ってきた新しいメンバーとの交流の場にもなった点です。会社のフルリモートワーク化に伴い別のチームのメンバーとの交流の機会が減る中で、チームを超えた交流が促進されました。

運営で心がけていること

ゆるく継続して開催することと、参加者の意見を取り入れて内容をブラッシュアップすることを心がけています。

ゆるく継続して開催するために、ファシリテーターを交代制にすることと、開催頻度を隔週にしました。ファシリテーターを交代制にすることで主催者である自分自身の負荷を軽減しています。開催頻度については、毎週開催にすると「木曜日はフロントエンドランチ会」という固定概念とともに参加に対する義務感が生まれてしまうのではという懸念から隔週にしています。

また参加者の意見を取り入れるために、開催初期は表明じゃんけんを使って最後に参加者に良かった点と改善点の声を募るようにしていました。この結果記事に対する深堀りの方針として「実際に仕事に活かせそうか?」という視点が追加されました。

終わりに

フロントエンドランチ会の概要、企画のきっかけ、実際の様子を紹介しました。フロントエンド技術のキャッチアップだけでなくチームを超えた人との交流も促進されるため個人的な満足度は高くおすすめの取り組みです。