I am うるぞー

エンジニアがラクして稼ぐ方法

まだ画面の行き来に消耗してるの?作業を効率化させたいならデュアルディスプレイを買おう

f:id:uruoikun:20170722125418j:plain

どうも、エンジニアのうるぞーです。

前回新型Macbook Proを購入した記事を公開しましたが、今回も一歩上のエンジニアを目指すための商品のご紹介。
作業を効率化させるためにモニターを購入しました。

ノートパソコンでたくさんのタブを開き、画面を行ったり来たりして作業をしている消耗しきったあなたにオススメです!
エンジニア以外にも、デザイナーやブロガーでたくさんのアプリケーションを開いている人も参考になるはず。

モニターなしのプログラミングの辛さ

僕はRuby on Railsエンジニアなので、基本的に開くものは以下の3つです。

  1. Google Chrome
  2. Atom
  3. Terminal


と言っても非エンジニアの方やこれからエンジニアになろうとしている人にはちんぷんかんぷんだと思うので簡単に説明すると、

  1. Google Chrome: 作ったWebサービスを開いて確認したりログを見る、わからないことをググるブラウザ
  2. Atom: プログラミングをするために開くエディター(コードを書くためのソフト)
  3. Terminal: 仮想のサーバーを立ち上げたり、サーバーにデータを送ったり、データベースの中身を見たりするツール


ときに使います。

例えば、これらをデスクトップ画面に全て表示するとカオスな状況になります。

f:id:uruoikun:20170722125449p:plain

それぞれを開くたびに他のものが隠れてしまって、非常に作業がしづらいですよね。
ものすごくストレスが溜まります。

そこで活躍するのが「最大化」です。(Macで話を進めています。Windowsはよくわかりませんごめんなさい)
左上の閉じるボタンと並んでいる緑色のボタンのやつですね。

f:id:uruoikun:20170722125730p:plain

「最大化」することによって先ほどよりかは見やすくなります。
トラックパッドに指を4本置いて、左右にシュッシュとやるだけでGoogle ChromeからAtomへの移動も楽になるし、AtomからTerminalへの移動も楽にできます。

しかし、まだこれでもめんどくさいんです!!!
Ruby on Rails開発をする際に、以下のようなフローがいつも発生します。

  • Atom(②)で修正したコードがどのような表示になるのか確認するためにGoogle Chrome(①)に移動する
  • 表示がうまくいったのでAtom(②)に戻り修正を続け、再度Google Chrome(①)に移動する
  • 今度はエラーが表示された。エラーの原因を探るためにTerminal(③)に移動する
  • エラーの原因がわかったのでAtom(②)に戻り修正し、Google Chrome(①)に移動する

・・・

みたいなことを毎日8~12時間とか平気でやるわけですよ。
毎日こんなことをしていると次第にイライラしてきて

あーまじで画面移動めんどくせー時間もったいないしストレス溜まるわー

となってきます。
イライラしているとプログラミングの作業効率はめちゃくちゃ落ちるので、この問題は非常に重大です。
プログラミング以外にも、ブログを書くときに画面を行ったり来たりしながら書くのはストレスがかかりますよね。
だからこそ、画面移動をできるだけ少なくするのが正義です。

ちなみにあんまり知っている人がいないみたいなので、ついでにご紹介しておくと、最大化したウィンドウはくっつけることができます。

やり方は非常に簡単。
まずくっつけたいウィンドウをそれぞれ最大化させて以下の画面のような状態にしておきます。
そして4本指でトラックパッドを下から上にシュッとやって(F3キーでもできます)、くっつけたいものをドラッグしてくっつけるものの上に乗せるだけ。

するとこんな感じになります。

f:id:uruoikun:20170722125809p:plain

AtomとTerminalをくっつけることができました。
実際に合体して表示された様子はこちらです。

f:id:uruoikun:20170722125841p:plain

一番最初よりはだいぶましになりましたね。
画面移動の回数が1回減っただけでかなりの効率アップとストレス削減です。
しかし、Atomの画面を見てもらえばわかる通り、コードが途中で切れちゃっているんですよ。
旅行先やカフェで仕事をする際はこれでやっていますが、家で仕事するときは作業効率を良くしたいものです・・・。

そんなときに役立つのがモニターを使ったデュアルディスプレイでの開発なのです!

モニターの開封の儀

では恒例の開封の儀をやっていきましょう!

僕が選んだのはLGの27インチモニターです。
モニターって色々あって、EIZOにしようかiiyamaにしようかとか、結構悩みました。
最終的には手が出しやすい価格で、Amazonの評判も良くて、周りのエンジニアが使っているモニターに決めました。

f:id:uruoikun:20170722125908j:plain

実際に27インチが届くとデカさがわかります。

f:id:uruoikun:20170722125922j:plain

ダンボールを開けるとモニターを立てる台と、DVIケーブルとVGAケーブルが入っています。
WindowsパソコンでDVIケーブルとD-Subケーブルが使えるPCであればモニター購入してすぐに快適な作業環境下で仕事を始めることが可能です。
Macの人はDVI,D-Subともに端子がないので接続できません。
そのため変換ケーブルが必要になりますのでご注意を!
僕は新型Macbook Proなので、新しく変換ケーブルとHDMIケーブルを購入しました。

f:id:uruoikun:20170722130042j:plain

ダンボールから取り出すとこんな感じ。
ケーブルやら説明書やらCDやらが入っています。

f:id:uruoikun:20170722125945j:plain

モニターはこんな感じです(わかりにくいですね、すいません)

f:id:uruoikun:20170722130003j:plain

説明書を読みながら5分くらいで組み立ては完了です。
設置してケーブルを挿して電源オンしたら画面がついて完成です!

f:id:uruoikun:20170722130025j:plain

実際に使ってみた感じ

実際にMacbook Proとモニターをつなげてみました。
繋げるとすぐに鮮やかな画面が映りました!
タイムロス的なものはなくて、1秒ほどで表示されます。
(高さが合わなくてMacbook Proの箱を台にしてますw)

f:id:uruoikun:20170722130122j:plain

実際に、

  • Macbook Proの方にGoogle Chromeを表示
  • モニターの方にAtom + Terminalを表示

させるとこんな感じです。

f:id:uruoikun:20170722130445j:plain

ほら、全然違うでしょ?
これで指4本でスライドをさせることで画面の行き来をする必要がなくなりました。

デュアルディスプレイのおかげで

  • Google Chromeを更新した際のログをでかいモニターの方に表示させているので確認が楽&早い
  • Atomで書いたコードのテストをするために隣に表示されているTerminalですぐにコマンドを打つことができる
  • モニターの画面がでかいのでコードの全体像を見渡しやすい

などのメリットがたくさん受けられるようになりました。

さらにはですね、大画面の綺麗なディスプレイで映画やYoutubeを楽しむこともできます。
大画面で僕のYoutube動画を見ることもできますよ!

f:id:uruoikun:20170722131416j:plain

▶︎動画解説!Ruby on Railsを使って爆速でブログを作る方法

もっとガッツリ仕事を効率化させるのであれば、もう一つモニターがあっても良いかと思います。
ノートPCには自分がよく使うもの、モニター①にはAtomとTerminalなどの開発ツール、モニター②にはChatworkやslackなどの連絡ツールを貼り付けておくと良いですね!
特にモニター②はモニターを横ではなく縦に設置して縦画面で表示させるとやりとりが長く見渡せるのでオススメです!

Macの方は

システム環境設定 → ディスプレイ → 接続しているモニターに表示されたウィンドウの「回転」を変更

すると画面の表示の向きを変えることができます。

f:id:uruoikun:20170722130643p:plain

こんな感じに。

f:id:uruoikun:20170722130606j:plain

モニターは使い方によって作業効率をうーんとUPさせることができるので検討の価値ありです!

どんなモニターを選べばいいのか

モニターってピンキリで、良いものから悪いものまでたくさん世の中に出ています。
僕が実家で使っていたモニターはテレビ用のやつで、画質も悪くて見ていて疲れる&ジリジリと音が鳴るんです。
我慢して使っていましたが、かなりストレスのかかるモニターでした。

僕はあまりモニターに詳しくないですが、僕が決める基準にしたのは「価格」と「Amazonレビュー」、そして「周りのエンジニアの評判」です。

価格はみなさんも気にするところでしょう。
安いモニターだと1万円以下のものもありますが、大抵画質が悪かったり画面が小さかったりと作業がしにくいです。
エンジニアやデザイナーとして長時間モニターと向き合って仕事をしていくのであれば、ここは仕事への投資と思って値段を上げた方が良いです。
2〜3万円ほど出せれば良いもの買えます。

次にAmazonレビューですが、4.0以上の評価がついているモニターで興味のあるものを開き、レビューコメントを見てみます。
当たり前の調べ方ではありますが、これが外れを引くことがなくて良いです。
いろんな人がメリットやデメリットを書いてくれているので、それを読んだ上で自分が興味のあるものを絞っていきます。

最後に周りのエンジニア評判が良いかどうかで決めました。
僕の周りのエンジニアはiiyamaやLGのモニターを使っている人がいたのでLGにしました。 周りにエンジニアがいない人は「iiyama」「LG」「Acer」あたりから選ぶと良いと思います。

【まとめ】デュアルディスプレイでストレスを減らし生産性を上げる

新しいMacbook Proを購入してから2週間、モニターを購入して1週間と経ったわけですが、やはり最新の機器があると仕事が捗ります。
マシンの処理速度が速くなれば、ストレスは減るしいつもかかっていた処理の時間が1/10になったりするわけです。
モニターも画面移動にかかる負荷と時間ロス、画面の見やすさを考えたら絶対にあった方が良いですね。

作業効率を良くしたい!と思っている人はモニターを購入して快適な作業環境を作ってみてはいかがでしょうか\\\٩( ‘ω’ )و ////


ーーーーー 僕が購入したものはこちら ーーーーー

【LGのモニター】


【新型Macbook Pro用の変換ケーブル】


【HDMIケーブル】

ーーーーー おわり ーーーーー

関連記事はこちら

▶︎一歩上のエンジニアを目指すためにMacbookPro2017年モデルを買いました

▶︎デスクワークにオススメ!腰痛を改善し猫背を矯正するクッション