×

ご興味をお持ちいただいて
ありがとうございます

ご相談・お問い合わせなどは、こちらのフォームよりご入力いただき、
「確認」ボタンの押下をお願いします。

入力

確認

送信

修正

下にスクロールできます

左にスクロールできます

×

ブログ | さなディズム

フリーランスクリエイター
真田 明と申します。
このブログでは、
僕の考え方などを書いています。

デザイナーやエンジニアとしてそれぞれ使ってるツールやサービスが気づかないうちに30個になったので紹介します(前半)

9月にFavoritaという屋号で独立予定の真田明です。独立からではなく、すでに日々ツールやサービスを使うことで、仕事のワークフローを確立できると思っています。新しいサービスを試すことは、ひょっとしたら嬉しい発見のきっかけになります。
いつからか、気がついたら自分が使ってるツールを数えて30個になりました。お気に入りのツールがあればぜひ使いこなして仕事に役立ててほしいものです。今回は、デザイナーとエンジニアとして使っているものをご紹介します。

デザイナーとして使ってるもの

Pinterest

オススメ度 ★★★☆☆
画像系のブックマークSNSですね。アイデアに困ってるときはたいがいここでヒントをもらったりします。ピンタレストのいいところは、ほかの人のピンだけでなく、自分も写真やサイトのピンを作れることです。ボードというアルバム的な機能はあるので、例えば見出しなど特定のジャンルのピンを集めることで、システムは自動的に自分が集めたピンと似ているものをメインボードに表示してくれます。あとはデザインと関係ないですが、ペキニーズ大好きなんで、ペキニーズのボードも作ったりしています(笑

Adobe XD

オススメ度 ★★★★★
デザイナーの三種の神器その一。
プロトタイプを作るときよく使います。特にページの遷移を確認できるので、動かない一枚カンプより断然効率がいいです。あと確認はリンク一つでできるので、相手はブラウザさえあれば問題ありません。現時点で僕が物足りないと感じるところは、XD本体にカラープロファイルがないことです。このままのカンプでデザインが確定すると、コーディングで色が変わる可能性があります。作り込みのカンプが必要な場合は、まだphotoshopで作るほうがよさそうです。

Adobe Illustrator

オススメ度 ★★☆☆☆
デザイナーの三種の神器その二。
愛してやまないツールですね。ロゴや紙ものを作るときに基本イラレを使います。難点としては、アセット書き出しの際にクリッピングパスをかけると、画像などが輪郭の外側にはみ出て書き出されます。これを防ぐために、一旦オブジェクトをライブラリに移動して、そこから取り出すか、画像自体を抜き取りすることです。この点について、XDはうまくカバーしてくれていて、クリッピングがかかっている画像オブジェクトでも綺麗に輪郭通りに書き出してくれます。

Adobe Photoshop

オススメ度 ★★☆☆☆
デザイナーの三種の神器その三。
イラストの塗りや色調整としてもお世話になっているツールです。基本的に画像の補正として使いますが、最近では、アートボードの追加によって、アートボードごとの書き出しができるようになったので、画像やバナーの作成のときも十分オブジェクトを操る実力が発揮できます。「画像補正+そのままバナー書き出し」という最強パターンでよく使います。アートボードも1ファイルに複数追加できるので、デザインカンプや複数画像サイズ作成にも役に立ちます。

Adobe Indesign

オススメ度 ★☆☆☆☆
DTPの神ツールですね。
一回だけパンフレット作成でIndesignを使ったことがあります。とにかく情報設計が大切という感じでした。というのも、書籍を作るツールなので、文章の見出しやフォントなどあらかじめに決まった前提で書式を整えていかなければいけません。デザインしながら使うより、事前にイラレなどでデザインカンプを作ってからIndesignを使う方が楽だという印象でした。もちろんスキル的はまだまだだから使いこなしていないですが、慣れてくると超絶便利なツールと感じることは間違いないなしです。

Typekit

オススメ度 ★★★★☆
Adobe CCに入ると使えるフォントサービスです。とにかく欧文フォントは非常に充実していて、DINやFUTURAなどの有名書体の本家や代用書体も使えたりします。和文フォントは、ひとつ前までは使える種類は限られてましたが、最近となったらかなり豊富になってきて、明朝やゴシックはもちろん、デザイン書体もそこそこの種類があるので、モリサワパスポートなどのフォントサービスを購入しなくてもある程度の幅のデザインはまかなわれます。

Adobe Comp

オススメ度 ★★★★★
モバイルデバイス専用のAdobe謹製アプリです。これは本当に神ってるって感じです!カンプやワイヤーフレーム制作のシーンでモバイルの特性を活かして、非常に使いやすいです。なにより、ジェスチャーでの図形やテキストの作成は本当に素晴らしいです。さらに、TypekitやAdobe Stockとの連携や、ほかのAdobeツールへの出力ができるので、移動中などのときに端末でワイヤーを作って、家やオフィスで作り込みという感じでワークフローが非常にスムーズになります。

モリサワパスポートアカデミック

オススメ度 ★★☆☆☆
言わずと知れるフォントメーカー。
大阪芸術大学の通信教育に入学しているので、モリサワパスポートのアカデミック版を使えています。商用不可なので、こちらは勉強や自主製作に使用しています。ただ、モリサワだけあって、メジャーフォントに触れる機会として、アカデミック版はとてもよいと思っています。

フォントワークスアカデミック

オススメ度 ★★☆☆☆
筑紫やマティスなどの有名フォントを作っているフォントメーカー。こちらも同様にアカデミック版を使用していますが、モリサワに劣らないくらいフォントの種類が豊富で、デザイン書体も、ベビポップやくろかねなど幅広く使えるものもある上に、四年間で5千円という価格設定も非常に魅力的です。

エンジニアとして使っているもの

Sublime

オススメ度 ★★★★☆
コーディング用のテキストエディタですね。C言語で書かれているので、動作は非常に軽いです。デフォルトの画面はシンプルですが、様々なパッケージ=プラグインがあるので、必要に応じてカスタマイズもできます。フォルダごとに作業できるので、複数のプロジェクトを立ち上げて作業することもできます。

Mamp

オススメ度 ★★★☆☆
phpなどを動かすためのローカルサーバー環境構築用のソフトですね。ワンクリックでサーバーが立ち上がって、ローカルでの開発ができるという点では、とても使いやすいと思います。特にバーチャルドメインの設定もできるので、テストサーバーと本番サーバーの行き来などの際に、サブドメインをバーチャルドメインとして設定するととても便利です。

Git

オススメ度 ★★★★☆
チームで開発するときのバージョンを管理するために生まれたソフトです。ターミナル(Windowsでいうコマンドプロンプト)で簡単なコマンドですぐ修正履歴の比較が表示されるという点ではとても重宝しています。チームでなくても、僕が個人で開発するときに、修正されるファイルが多くなると、プロジェクトにGitをインストールして、修正ファイルを管理するようにしています。

Bitbucket & Github

オススメ度 ★★★☆☆
Gitのプロジェクトフォルダ(リポジトリ)をWeb上でホスティングしてくれるサービスです。無料枠で使う場合、Bitbucketではすべてのプロジェクトを非公開にできる代わりに、共有できるメンバーの数が少ないです。Githubはその逆で、非公開できるプロジェクトは一つしかない代わりに、共有メンバーの数に制限がありません。開発の目的に合わせてそれぞれ使いわけたほうが良さそうです。

Sourcetree

オススメ度 ★★★★☆
Gitは基本的にCUIソフトですので、ターミナルでしか使えません。ターミナルが苦手な人でも気軽にGUIとして開発されたソフトはSourcetreeです。とにかくUIは見やすく、修正履歴や修正ファイルのリストはとても確認しやすいです。さらにコミットやプッシュといったGitコマンドもボタン一つで使えるので、デザイナーでも低いハードルでGitを始めることができると思います。

Cloud9

オススメ度 ★★★★★
クラウド上のIDE(統合開発環境)です。これがなければ今の僕がいなかったくらい大変お世話になっています。htmlのみならず、php環境やruby環境などもボタン一つでコンテナが作成され、開発環境として整えられます。クラウドIDEがもっとも重宝されるところは、場所、デバイスを選ばないことです。家でデスクトップ、外ではノートパソコンといった具合でも、ネットさえつながれば、簡単に開発を始めることができます。

Web上のサービスは無数にありますが、ご自身にとって一番使いやすいものを見つけることも仕事の一部だと思います。デザイナーとエンジニアとして使っているものは、僕的にはこれくらいで十分かなと思っています。まあモリサワとフォントーワークスは、独立したらやはりフルライセンスを取らないとしんどいですが、今はアカデミック版でも勉強させて頂いてます。
後半の記事では、また情報収集系や仕事効率化系などをご紹介します。