MacでWebデザイン、あると便利なアプリ48+2

最近Webデザイン系のいろいろなセミナーやイベントに出ると、MacBookなんとかを持ってる方を多く見かけます。で、これからWebデザイナーになりたいなとか、これからMacに変えちゃおうかな?と思ってる皆さんに向けて、Macを使ってWeb制作とかする時にあると便利なアプリをまとめてみました。

OS X Apps for Web Designers

「Web制作といえば、AdobeのCreative Suite」みたいな人も多いでしょうが、サブスクリプションプランが始まったとはいえ、いきなりウン十万もソフト含め投資できないこともありますからね(会社が買ってくれるならいいですw)。別にそれがなくても、他で代用すれば仕事はできるから大丈夫です。

いま現在MacでWeb制作をしている皆さんには定番なのも多く含まれますが、ちょうどこないだLionデビューして環境整備がてらまとめたので、最後まで流し読むと「え?何それ」みたいなのがあるかもです。

今回は各種ブラウザとサーバ関係なんかは入れてません。では、48(+2)個いってみましょうか。

グラフィック関係のエディタやツール

Lineform

Lineform

Lineform」は、Illustratorの置き換えになるというか、パスを使ってイラストを描いたりとかっていうベクタードローイングアプリケーション。

Sketch

Sketch

Sketch」もまたベクタードローイングアプリケーション。App Storeのレビューではバグがあるとか書いてありますが、比較的安価なのと書き出しのフォーマットが多いのでいいかな、と。

Drawit

Drawit

Sketchを出しているところのもう一個のアプリ「Drawit」は、ベクターデータをビットマップ風に扱えるもの。フィルターかけたりとか。Web制作だと、UIとかアイコンとか作ったりもしますからね。

Inkscape

Inkscape

Illustratorの置き換えになるアプリケーションとして有名な「Inkscape」は、オープンソースで開発されています。SVGベースになってますが、.aiファイルとかを読み込んだり.epsで書き出したりといったことも(開けないのもあるとは思う)。

Adobe Photoshop Elements

Photoshop Elements

Webデザインにおいて、ゴリゴリとレイヤー重ねてイメージを作るって用途ではなく、簡単に写真を修正・加工するぐらいなら「Photoshop Elements」で十分じゃないかと。実際、ボクは一番使ってました(一応過去形)。

Pixelmator

Pixelmator

Photoshopの完全なる置き換えにはならないと思いますが、安価で一通りの画像編集ができることで有名な「Pixelmator」。App Storeでも2,600円です。桁は間違っていません(笑)。パスがないとか、そのぐらいですか?

ImageOptim

ImageOptim

Webサイトの表示に時間がかかる原因のひとつは、サイトで使ってる画像の量やサイズだったりもします。そんなJPGやPNGの画像は、最適化すればもっと軽くなるわけで。最近「jpegmini」というとんでもないサービスが話題ですが、それはそれとして「ImageOptim」は入れとかないと。

Quick Sprites for Mac OS X

Quick Sprites

CSS Sprite作るのって、画像を並べるだけなら簡単なんだけど(笑)、それからCSSを作ってとかって作業がちょっと面倒。そんな作業を簡略化してくれるのが、この「Quick Sprites」です。デモの動画がサイトにありますよ。

OmniGraffle

OmniGraffle

ダイアグラムやフローチャートといった図を作れるアプリケーションとして有名な「OmniGraffle」は、ワイヤーフレームとか作るのにも重宝します。海外に目を向けると、Webサイトやスマートフォンサイト用のOmniGraffle用のステンシル(拡張パックみたいなのね)が沢山公開されています。

Review

Review

Review」は、MacからpsdをiPhoneに飛ばして、実機でモックアップを確認できる代物のようです。もちろんRetinaも古いのも対応。なにげに初期段階では便利ですよね、きっと。似たようなので「Prototypes」ってのもあって、こっちはボタンの指定なんかもできちゃったり。

テキストエディタとかコーディング系

Coda

Coda

いまさら説明の必要もない気はしますが、Dreamweaverの置き換え的にコードの入力補完機能やサイト管理機能などが充実しているアプリケーションが「Coda」です。最新版はSubversionにも対応してます。

Sublime Text 2

Sublime Text 2

ボクは普段 TextMateというエディタを使ってるんですが、今回 Lionにするにあたって最近日本語が使えるようになったという「Sublime Text 2」に。いろいろな言語に対応したテキストエディタです。省略形からコードを展開する機能はデフォで搭載されていて、Windows版とかもあります。

Sublime 2 ZenCoding

ZenCoding for Sublime 2

Sublime 2は、HTMLとかJSなら省略形から展開してくれるんですが、さすがにZen-Codingになれた指先にはCSSを展開してくれないのが困るわけで…。欧米の皆さんは仕事が速くて助かります、こちら Sublime 2用のZen-Codingプラグインです。

Byword

Byword

Byword」はテキストエディタの一種で、Markdownでテキストを編集できる素敵アプリ。Markdownは、サイト内の記事をHTML込みで書くときとか便利で、いちいちマークアップしなくてよくて書き出せばHTMLになります。iA Writerでも使えるのかな? フルスクリーンにも対応しているので書くことにも集中できます。

Jedit X

Jedit X

日本語のテキストエディタの定番「Jedit X」。テキストだけを集中して書く、文字数とかを気にしながら書くといった時だけでなく、送られてきたテキスト原稿の「全角・半角」を統一する時、複数ファイルに含まれるテキストの検索・置換とかにも重宝します。ないと困ります。

TextExpander

TextExpander

Text Expander」はテキストの入力支援というか、登録した文字列を任意の文字入力で呼び出すアプリケーションです。IMEの単語登録だと文字数の限界とかもありますから、ちょっとしたコードなどをスニピットとして登録して呼び出す、みたいな使い方ができます。HTMLコードのスニピットとかも公開されてます。

HTTP、FTP、その他のクライアントとか

WebKit

Webkit

Webkit」は、SafariやChromeのレンダリングエンジンとして有名ですね。オープンソースで開発されています。で、なぜWebkitまでっていうと、電子書籍のフォーマットであるePub 3.0の確認用として入れてます。縦書きとかその辺もあるんで(Chromeでも見れるかな、いまは)。

Transmit

Transmit

Codaを出しているPanicさんが、古くから単体のFTPクライアントとして出しているのが「Transmit」です。Mac用のFTPクライアントには、CyberduckやForkLift、FileZillaなんかもありますけど、対応しているプロトコルの多さとタブで複数サイトに接続できるのが決め手ですかね。ずっと使ってます。

Interarchy

Interarchy

なんか久しぶりに名前を聞いた気がするんですが、「Interarchy」もFTPクライアントのひとつです。これをなんで取り上げるかというと、Transmitでも対応していないサーバ(Google Storage、Rackspace Cloud Files)もオッケイと。いざという時のために。

Tower

Tower

ボクは普段ひとりで自己完結してる仕事が多くて、Gitとか使うこともないんですが一応。「Tower」はゲームじゃなくて、GitのGUIクライアントです。Gitのクライアントは他にもいろいろあります。

GitHub for Mac

GitHub for Mac

ま、そんなわけなので GitHubを使うこともないわけですが(笑)、いざ使わなければならないという時のために、GitHubのGUIクライアント「GitHub for Mac」もね。

Versions

Versions

DreamweaverやCodaでもSubversionはサポートしてますが、他にもSubversionのGUIクライアントがいくつかあります。そのひとつがこの「Versions」。余談ですが、こちらの開発元はこないだFacebookに買収されました。

Terminal

Terminal

これがあるとないとでは大違いなのが、OS Xに標準搭載されている「ターミナル」です。いや、ないと困ります。直接サーバにログインしてファイル操作したり、いざとなったらこれからSFTPするぐらいの勢いで。この中では「vi(vim)」とか使います。

Alkaline

Alkane

Alkaline」は、MacでWindowsのIEの確認を…というか、URLを入力して指定したブラウザのバージョンでプレビューできるアプリケーション。LitmusというEメールのプレビューサービスとか解析をやってる会社のです。無償だと制限がありますが、HTMLメールの確認とかも必要であればいいかも。

Better Link Tester

Better Link Tester

Better Link Tester」はリンクチェッカー。404とか出てないかとか、ちまちま確認とかしてられないですからね。Dreamweaverとか使ってない方へ。

Charles Web Debugging Proxy

Charles

普通に表向きのWebデザインだけやってるとあまり用はないかもしれませんが、「Charles」はWebサイトのデバッグ用のプロキシアプリです。これがあると、リクエストに応じて何(どういうデータ)が戻ってきてるとかわかるし、回線速度のシミュレートができます。ふふふ(謎)。

ファイルのやりとり、原稿表示・確認系ツール

Dropbox

Dropbox

Dropbox」は説明の必要もないですよね。ファイルのやりとりする時には、メールで添付する以外の選択肢としてオンラインストレージとか使うと便利です。ローカルのファイルのやりとりでも便利なので、ちょっとしたファイルを移動する時はバックアップ代わりに使っています。

iWork ’09(Keynote / Numbers /Pages)

iWork

いわゆるMac版のオフィスアプリケーション「iWork ’09」。Keynoteはプレゼン用途だけでなく、ワイヤーフレームを作ったりもできますからね。Keynote用のパーツとかも海外では公開されていますよ。

OpenOffice

OpenOffice

オープンソースで開発されているオフィススイートといえば「OpenOffice」が有名ですね。これをMacに最適化した「NeoOffice」もありますが、いろいろあってこっち入れてます(謎)。

Preview

Preview

これもOS X標準搭載のアプリケーションですが…(笑)、「Preview」は送られてくる原稿のちょっとした確認に重宝しています。フォルダをドラッグすれば中のファイルが一個にまとまったり、簡単な編集もできるし便利っす。

GraphicConverter

GraphicConvertor

これで開けない画像形式とかあるのかな?って思うぐらい、多種多様なフォーマットに対応したグラフィックエディタが「GraphicConverter」です。いまではPhotoshopにもバッチ処理とかありますけど、これのバッチ処理とかも強力です。開けない画像はとりあえずコレにドラッグ。

メディア系プラグイン、映像編集・コンバートなど

Adobe Flash Player

Flash Player

いや、Creative Suite入れれば入りますけど、Lionからは標準でインストールされてないようで(笑)。Flashコンテンツ見るためには必要ですからね…。あ、そうそう、Chromeの中のFlash Playerは別であらかじめ組み込み済みです。Flash Playerに脆弱性があったとしても、先に更新されちゃったりします(笑)。

Windows Media player for Mac(Flip4Mac WMV)

Windows Media player for Mac

Flip4Mac WMV」は、無償で利用できるWMV用のQuickTimeコンポーネントです。無償版は見るだけですけど、元がWMVのファイルをコンバートしないといけない時とかもあります。ライセンスを買って入力するだけで、書き出しできるバージョンへ切り替わります。

Microsoft Silverlight

Silverlight

Microsoftさんの「Silverlight」も閲覧用になりますが、念のため入れておきましょう。なくて困ったことはほとんどないのですが…(笑)。

Miro Video Converter

Miro Video Converter

ボクは仕事の関係上、動画を扱うことが多かったのもありますが、世のWebデザイナーさんもこれから動画を掲載しなければ…とかあるかもしれません。映像にはコーデックというややこしいものがあるんですが、これを入れておくと多様なフォーマット(MP4 / WebM / Ogg Theora)に変換できます。

QuickTime 7 Pro

QuickTime 7

OS X LionになってからQuickTime Xになってしまって、一部の形式を除いてファイルの書き出しとかができなくなってしまい…。仕事だと何かあった時にちょっと困るので、Lionにも入れられるSnow Leopard対応の7.6.6を入れてPro版に。

Final Cut Pro X

Final Cut Pro

普通のWebデザイナーさんだと動画編集までしないかもしれませんけど(笑)。以前は、簡単な動画編集用としてFinal Cut Expressがありましたが、統合されて「Final Cut Pro X」になってましてね…、これからはコレで。

Ustream Producer

Ustream Producer

やはり普通に生活していると動画配信とかもやることはないでしょうが、ボクは仕事でやる機会がゼロとは言えないので、最近はUstreamでしょうねってことで「Ustream Producer」。

CamTwist

CamTwist

Ustream Producerだけでも十分ですが、テロップ入れたりとかするのに重宝する「CamTwist」も入れておけば万全ですね。

圧縮、解凍、その他ツール

MacWinZipper(WinArchiver)

MacWinZipper

ファイルのzip圧縮なら選択して右クリックで「〜を圧縮」でいいんですけど、世の中には「Thumbs.db」入れてくる割には「.DSstore」を嫌う人もいますからね(笑)。Windowsの方にもそうでない方にもクリーンなzipを送るために。あと、日本語のファイル名をつける人は文字化けしないアーカイブになります。

The Unarchiver

The Unarchiver

zipはダブルクリックで展開されるし、他の圧縮形式を解凍するなら後述のStuffit Expander一個あればどうにかなりはするものの、.lhaだとフォルダ付きが全部一カ所に展開されるとか不具合もあって、こちらの「Unarchiver」を入れてます。

StuffIt Expander

StuffIt Expander

前述のUnarchiverは、.sitにも対応しているみたいですが、開けないのとかあっても困るので、念のため「Stuffit Expander」も用意しておきましょう。いまどきあんまり見かけませんよね、サイトを見ても昔の勢いは感じられません(笑)。

システム関係のアプリケーションなど

MenuPop

MBPとかMBAとかで作業してる人はショートカットの達人かもしれませんが、ショートカットがなければトラックパッドでえっちらほっちらメニューまで…。大きなモニタの人も似たようなもんですね。「MenuPop」は、任意のキー入力でメニューをカーソルの位置に表示します。便利です、はい。

AppCleaner

AppCleaner

アンインストーラーのないことで有名なOS Xです。アプリケーションをゴミ箱に捨てればそれはなくなりますけど、関連ファイルまでは消去されません。そこで「AppCleaner」とかを入れておくわけですね。ドラッグすれば関連ファイルも一網打尽。ゴミ箱に入れれば勝手にやってくれるオートデリートみたいな機能は初期設定で有効にできます。

CleanApp

CleanApp

CleanApp」もアンインストーラーの一種なんですが、こちらはファイルのインストールのログとかも記録できたり、長期間使ってないファイルの表示、使わない言語を削除したりもできます。これはこれで便利なんですよね。あ、有償です。似たような別のだとCleanMyMacとか。

Launchpad-Control

Launchpad-Control

OS X Lionから搭載されたLaunchpadですが、何のためにあるのかいまいちわかりません(笑)。別にLaunchpadになくてもいい、インストールしたアプリもずらずら並んでいくのでかえって使いづらいというね…。そんなLaunchpadのアプリの表示非表示をコントロールするのがこの「Lauchpad-Control」です。

ClamXav(w/ ClamXav Sentry)

ClamXav

OS Xはゼロとは言いませんが、いわゆるウイルス的なものの数はさほど多くはありません。とはいえ、アンチウイルスソフトも入れておきましょう。市販のアプリもいくつかありますが、ボクはサーバにも使ってたりしたコレを入れてます。なお、App Store版は常駐監視してくれるClamXav Sentryが入ってません。

Fontcase

Fontcase

OS Xに標準搭載されているFont Bookでも十分な気はしますが、フォント管理ソフトが必要であれば「Fontcase」とか「Font Explorer X」とか入れておくといいですかね。ちょっとバグとかあるみたいですけどw

Memory Sweeper Pro

Memory Sweeper Pro

メモリの空き容量を増やしてくれるお掃除アプリ。この類のアプリはいろいろあります。しかし、どれもこれもアイコンとか表示とかがダサいというか、美しさのかけらも感じられない。で、この「Memory Sweeper Pro」を。

Name Mangler

Name Mangler

ファイルのリネームとか膨大な数だと気が狂いますね…、拡張子の変更とかそういうの含め。「Name Mangler」は、フォルダ内のファイル名を検索置換したり、連番に変えたりで重宝します。リネーム系のソフトはいろいろあります。

といった感じでどうでしょうか?

AdobeさんのCSなど定番中の定番はのぞいて、できるだけ安価で用意できそうなものを中心にしてみましたがいかがでしたでしょうか。テキストエディタなどは好みなんかもあるので、必ずしもココにあるものがいいとは言いませんが(笑)。ま、それ以外はインストールしないまでも頭の中に覚えておけば、いずれ使う時がくるかもしれません。

ひとつのアプリケーションでの作業に固執すると、作業内容によっては無駄に時間もかかることもあります。やりたいことにあわせて適材適所で切り替えるのが仕事効率化のコツです。では、Macで良いWeb制作ライフを。

MacBook Proに入れたアプリ22個+おまけ | gaspanik weblog
人によっては便利なiPadアプリあれこれ | gaspanik weblog

Tags: , , , , , , ,

   

Comments are closed.


Performance Optimization WordPress Plugins by W3 EDGE