ウェブ業界の現状
通常ウェブデザインの業界では Adobe の Photoshop と Illustrator が一般的に使われていますが、イギリスの Serif が開発した Affinity Photo, Affinity Designer などのライバル製品が登場してからは脱Adobe の道が本格的に模索されるようになってきました。
レスポンシブデザインが必須の今、制作の流れとしては Photoshop などのピクセルベースペイントツールはバナーなどの画像素材作成のみに使用し、Illustrator や Sketch App などのベクターベースのレイアウトツールを使って全体のレイアウトを組む場合が多いかと思います。
そこで、Affinity Photo、Affinity Designer を使って実際の仕事でウェブ制作を完結することができるのかについて検証してみます。
Affinity Photo
https://affinity.serif.com/ja-jp/photo/
Affinity Photo は写真加工や RAW 現像など、写真を編集する機能に特化したソフトウェアです。Mac / Windows に対応しており、執筆時点では6,000円程度で購入でき、サブスクリプションなどの継続的な支払いはありません。
Photoshop の PSD 形式ファイルの読み書きが可能で、レイヤースタイルをある程度保ったまま読み込む事ができます。
色調補正や各種ブラシもそれなりに揃っているので通常の補正で困ることはなさそうです。
RGB, CMYK の両方に対応し、HDR合成やパノラマ結合など豊富な機能があり、単体のペイントソフトとして見るなら十分にパワフルで実用的なソフトです。ドロップシャドウや光彩、境界線などのレイヤースタイルも Photoshop と同じ感覚で使えます。ただし PSD ファイルの読み込みは完全とはいえず、信用はできません。日本語テキストの一部が文字化けしたり、サテンなどのレイヤースタイルエフェクトが欠落したりします。現時点ではテキストの縦書きにも非対応なので注意が必要です。
最初からすべて Affinity Photo を使って作ったデータをもとに制作を進めるなら問題なく使えますが、他の人が Photoshop を使って作ったファイルをもとを Affinity Photo で読み込んで使うとなると互換性にやや不安があります。
Affinity Designer
https://affinity.serif.com/ja-jp/designer/
Affinity Designer はベクターベースのドローツールで、こちらも執筆時点では6,000円ほどで購入できるサブスクリプション不要の買い切り型ソフトウェアです。Mac / Windows のどちらでも利用できます。
パスツールを使ったベクターはもちろん、ピクセルペルソナに切り替えることでピクセルベースのペイントも行うことができるようになるので、無機質なシェイプにアナログブラシの質感を与えることもできます。
特筆すべきは「シンボル」で、サイト内で繰り返し使うパーツをシンボルとして定義して配置すると、シンボルの１つを書き換えるだけで他のシンボルも同様に変化します。これを使うとヘッダーやフッターなどの共通パーツの管理が楽にできます。
もう１つの長所は「制約」で、アートボードのサイズ変更に対して位置やサイズをどのように変化させるかを指定できます。常に右上に配置したいものは制約で右上に指定しておくと、アートボードのサイズが変わっても右上の状態が維持されます。レスポンシブ対応のサイトをデザインする上で有用な機能です。
「アセット」もサイト作成には便利です。矢印やメニューアイコンなどのよく使う基本図形をアセットに登録しておくと、一覧から選んで簡単に配置できます。
一応 Illustrator の AI ファイルも読み込めますが互換性に関してはこちらも完璧を期待してはいけません。
書き出しに関しては AI は無く、主要なものとしては PNG, JPEG, GIF, TIFF のほか PSD, PDF, SVG, EPS などがあります。言い換えるならベクターのレイヤー構造を維持したまま他のソフトで読み込むことのできる形式はないということです。
CMYK には対応しますが執筆時点ではテキストの縦書きやトリムマーク（トンボ）作成機能はないのでパンフレット等の印刷物を作るには向かないと思います。
まとめ
Affinity Photo も Affinity Designer も素晴らしいソフトウェアで、Adobe系ソフトとの互換性や縦書きの問題を除けば十分に仕事で使えるように思います。少なくとも低価格ペイントツールの中では Photoshop Elements や Pixelmator よりも Affinity Photo のほうが優れています。Affinity Designer に関してはウェブ用途に限っていえば Illustrator 以上の実力と言って良いと思います。
現時点では Photoshop を完全に手放すのは難しい状況ですが、Creative Cloud のフォトプランにして月々のコストを抑えつつ Illustrator の代わりに Affinity Designer を使うというあたりが現実的な落とし所ではないでしょうか。
Similar Posts:
- Adobe Creative Cloud 導入
- [PHP]2018年現在使っているおすすめの開発ツール・開発環境(Mac)
- [XML]要素・属性の使い分けと命名規則（要素名・属性名の決め方）
- MacでのPHP開発におすすめのテキストエディタ比較
- [PHP]投稿数や出現回数に応じて文字サイズが変わるタグクラウド
- 初心者の方でも簡単に個人サイトが作れる Mobirise の使い方
- [PHP]WindowsでHomesteadを使ってLaravel5開発環境を作る(1/2)
- Symfony 3 のインストールと基本構成
