フリーランスWebデザイナーの制作環境のご紹介

今回は私の制作環境のご紹介です。制作に使っているパソコンツールやサービスなどもピックアップしていきます。

PC環境

MacBook Pro 13インチ

メインで使っているPCはMacBook Proです。この他に主に表示確認用としてWinのサブ機も持ってます。

Web制作を始めたことはWinで制作をしていました。初めて勤めた会社がWinだったので。Macにしたのは独立してからですが、WinがいいかMacがいいかはよく分かりません。Webサイトがしっかりと制作できるのであれば、どちらでも良いと思っています。

スマホやタブレットもApple製品なので、各デバイスのデータの共有のしやすさという点ではApple製品で揃えているのは便利だなと思います。

ただこの仕事をしていると「パソコン全般に詳しい人」というレッテルを貼られ、パソコンの使い方についてクライアントから尋ねられることが多いです。その場合、クライアントのパソコンはWin率が高いので、Winの操作方法や知識など頭に入っていた方が仕事の幅が広がると思います。

LG モニター ディスプレイ 34インチ ウルトラワイド(3440×1440)

Macbook Proはディスプレイが小さいので、事務所で作業をする場合はLGの34インチワイドモニターに接続してマルチディスプレイとして使っています。

LGのモニターを使い始めてから作業効率がものすごく上がりました。例えばWebサイトを作る場合はMacBookにエディターを置いて、LGモニターの左半分にデザイン、右半分にブラウザでの表示確認みたいな感じで使っているので、ストレスなくコーディングができます。

これに慣れると画面が小さいMacbook Proだけでの作業は少し辛いです。

iPad・iPhone

スマホ・タブレットもApple製品です。webサイト制作をしているときは、Visual Studio Codeのライブプレビュー機能を使って、PC・タブレット・スマホで常に実機確認するような体制にしています。便利ですね。

PC・スマホ・タブレットスタンド

PC・スマホ・タブレットスタンド

私になくてはならない存在。各デバイスのスタンドです。もうスタンドなくっちゃやっていけないってくらいスタンドLOVEです。

エレコム デスクマット マウスパッド 

エレコム デスクマット マウスパッド

600mm×奥行297mm×厚み4mmという大きさで、かなり大きいです。マウスパッドの上にキーボードも一緒に置いて使っています。これを使い始めたら、小さいマウスパッドは使えなくなりました。

ロジクール アドバンスド ワイヤレスマウス

ネットで「このマウスはいい!」というレビューをよく見ていたので、ちょっと価格は高いけど思い切って購入したロジクールのマウス。

今までいろんなマウスを使ってきたけど、このマウスは疲れ知らず。
握りやすい形状なので、ずっと使ってても手が疲れることはありません。

他にもいろんな機能があるので、それらの機能を使いこなせれば作業効率が上がると思う。
私はこの優秀なマウスの機能を使いこなせていないのですが…笑

Anker USBハブ

Anker USBハブ

普段はPCに色々繋げながら作業しているのでUSBハブは欠かせません。最初は外国製のよくわからないメーカーの比較的安価なUSBハブを使っていましたが、読み込みなどに不具合が出て…。そこでAnkerのUSBハブに切り替えました。こちらに切り替えてから、接続不良などは起こっていません。

ネックスピーカー シャープ サウンドパートナー

Zoomなどでオンラインミーティングを行う際は、ネックスピーカーを使用しています。

Macのデフォルトのマイク&スピーカー機能を使っても良いのですが、その場合ある程度Macに近づいていないと自分の声が小さかったり、相手の声が聞こえづらかったりしますよね。

そんな不満を解消するのがこちらのシャープのネックスピーカー。これは首にかけて使います。首元から自然な感じで声が聞こえてきます。イヤホンのように耳に入れるタイプではないので、耳に入れるのが苦手な方にも向いているかなと思います。

これを装着したまま、部屋の中を動き回っても大丈夫。ただし、周囲にスピーカーからの音が漏れるので、音漏れが嫌な方には不向きです。

利用ソフト

Visual Studio Code

Visual Studio CodeはMicrosoft社が開発しているテキストエディターです。VSCodeとも言われていますが、こちらを使っている方は多いのではないでしょうか。様々な拡張機能があり、自分が使いやすいようにカスタムすることができます。htmlなどのコードを書くときに使ってます。

Adobe XD

Webサイトのデザインを作成するときに使ってます。以前はイラストレーターやフォトショップなどでデザインしていましたが、最近はXDです。

Adobe Illustrator

Webサイトのバナー画像や印刷物を作るときなど、幅広く活躍してくれます。

Adobe Photoshop

写真を加工するときはフォトショップです。昔はフォトショップでWebサイトのデザインなんかも作っていましたが、最近はめっきり使う機会が減ってきたかもしれません。

Adobe Lightroom

一眼レフカメラで撮影したRAW画像を加工する際に使っています。ちょっと影が強くて黒く潰れちゃってる写真など、Lightroomで加工して綺麗になったときは気持ちがいいです。

DropBox

仕事で使うデータはほとんどDropBoxにアップしてあります。PCのローカル保存だけということはしないです。PCがいきなり壊れたりしたら怖いので。DropBoxにアップしてあると他のデバイスでも利用・確認することができますし、とっても重宝してます。ドル払いなので、円安になった際は月々の支払いが高くなり辛いです。

その他

Kate SpadeのPCバッグ

Kate SpadeのPCバッグ

こちら、お気に入りのケイトスペードのPCバッグ。高級感もあってしっかりしてさらにツートンカラーになっているところが可愛くてお気に入りです。以前もケイトスペードのPCバッグを使っていたのでこれは二代目PCバッグですね。

以上、私の制作環境のご紹介でした。