FC2ブログ
ぴぽやフレンズについて

PhotoShopCS5をドット絵ツール化

2011.01.18
遅まきながら、AdobeCS5にアップグレードをしました。

さて、私がドット絵を描くときはPhotoshop7.0に付属していたWEB画像制作特化なImageReady(FireWorksみたいなのです)を使用しているんですが、古いソフトなのでいつか新バージョンのWindowsで動作しなくなるんではないかとビクビクしてました。幸いWindows7でも動作しているんですが、新バージョンのPhotoshopが出るたびにまずはドット絵ツールとしての適正を調べています。

ドット絵ツールとして有名なEDGEの有料版のEDGE2も持っているのですが、やはりPhotoshopライクな使い方をしたいんです。まあ、EDGEに慣れれば、そっちがよくなるんでしょうけど。

で、今回のPhotoshopCS5はドット絵ツールとしての適正がかなり高くなっています。
Adobeがそんなの意識しているわけないので、勝手にそういう使い方をしようとしているわけですがw
CS4までは、なにか問題があって(わすれちゃいましたが……)ドット絵ツール化は断念してたんですが、CS5では解決されたようです。(CS4での機能はちゃんと見てなかったので、実はCS4でも解決されていたのかも?)

さらに↓の記事で紹介されている「Adobe Configurator」を使用することで、使いやすさが飛躍的にアップしました。

ASCII.jp:自分だけのPhotoshopが作れる!超便利な新機能
http://ascii.jp/elem/000/000/194/194587/

このツールは、Photoshopの機能から自分が使いたいものを独自のツールパネルにまとめることができるというものです。自作のアクションやスクリプトもボタンとして配置できるので、ドット絵ツール化関係なしに利用したいツールです。バージョンが1と2があって、1はCS4用、2はCS5とInDesignにも対応しているようです。ちなみに1はわからないですけど、2は日本語で使えるようになっています。


そんなわけで、ドット絵ツールとして必要な機能を見ていくと。

○ピクセル単位での描画
 これは「鉛筆ツール」や□描いたりするときに「アンチエイリアス」をオフにすれば解決。
 ブラシも独自にドットがハッキリしたブラシを「ブラシ定義」でどんどん追加していけばいいので問題なし。
 諸々の単位表示も「Pixel単位」に設定してしまえばOK。
 このへんは元々問題ないところでした。

○左右反転、90度単位での回転機能
 キャラクターのアニメパターンを作るときなんかによく使いますねぇ。
 「編集>変形」にありますんで、ショートカットキーを割り振っておけば便利です。
 これも前から。

○1ピクセルごとの上下左右スクロール(ラップアラウンド)
 たしかCS4ではこれがうまくできなかったんじゃないかな?覚えてないけど。
 この機能もよく使いますねぇ。パーツの一部をちょっと微調整でズラしたりとか。
 「フィルター>その他>スクロール」でできるようになっています。
 「ラップアラウンド」は画像をスクロールさせて画面の端に行くと逆側からでてきてループするようにできます。
 私の場合はこれを「アクション」を4つ使って、上下左右に各1ピクセルずつスクロールするように設定して、ショートカットキーで操作できるようにしています。
 今後は斜めとかも設定してもいいかなぁ?
 
○グリッド表示&スナップ
 これもPhotoshopのはちょっと使いにくいんですよねぇ。
 グリッドの幅の設定は「編集>環境設定>ガイド・グリッド・スライス」で、グリッドを表示するには「表示>表示・非表示>グリッド」で、スナップ(吸着)させるには「表示>スナップ」という具合。
 グリッドの幅の設定をしに行くのがちょっと遠いなぁ。というところです。まあショートカットキーを割り振れば解決しますが。

○パレット管理
 これはもう時代的にフルカラーで問題ないので、不要ですねぇ。
 スウォッチにガンガンと好きな色を設定できるので、自分用のカラーをいくらでも用意できます。

○アニメーション
 Photoshopでのアニメーション機能はレイヤーアニメーションになるので、EDGEみたいにキャンバス内の場所を矩形で登録していくようなことができないので、ここはEDGEを使いたいところですが、私の場合はアニメーションを作る場合はそのパターンだけ切り取って、アニメーション作成用の新ドキュメントでレイヤーわけして作業していたりします。単純なものならいいですが、ちょっと複雑なものはきびしいかもしれないですけど、できなくはないです。まあ、EDGEなんかのアニメ機能の方がやっぱ便利でうらやましいところですけどね。

○実寸プレビュー
 1つの画面では拡大して作業しながら、もうひとつのクローン・プレビュー画面で等倍表示が見られる機能も重要です。
 ここが一番ネックでいいエクステンションがないか、探したんですけど、よくわからず、結局「ウィンドウ>ナビゲーター」で妥協しました。
 等倍表示ではないんですが、ないよりはマシ。

○画像の出力
 ドット絵向きの画像形式として、普通にPNGやGIFでの保存は「ファイル>Web及びデバイス用に保存」で行えるので、透過色設定含めて問題ないです。もちろんαチャンネル付きのPNGも書き出せます。


以上のようなことが、CS5ではすべて可能になったので、晴れて十分な機能を備えたドット絵ツールにも使用できるようになりました。

機能は十分。あとはどう使いやすくするかということで、先に紹介した。「Adobe Configurator」がでてくるわけです。
色々なところに散らばっているドット絵制作に便利な機能を1つのパネルにまとめていきます。
私の場合は「標準のツールパネルからドット絵描画によく使う機能をまとめたもの」と「反転や回転・スクロールなどの変形・調整機能をまとめたもの」、「グリッドの設定や表示・スナップ、パターン定義&塗りつぶし、WEB用保存をまとめたもの」の3つのパネルを作ってみました。
実際は反転や回転・スクロールについてはショートカットキーに割り振って使うのに慣れているので、パネルでの操作はしないと思いますが。
↓こんなかんじですね。ドット絵ツールっぽいパネルになったんじゃないでしょうか?
dot01.jpg


↓で、作業画面全体はこんなかんじです。ほぼ理想的なドット絵ツール?になっている気がします。
dot02.png


こうして、PhotoshopCS5はドット絵ツールとして帰ってきてくれました><
ドット絵が描ける機能+Photoshopのフィルタや画像補正や3Dなどの画像ソフトとしての最高機能を使えるわけですから、最強のドット絵ツールの1つとして問題ないはずです!

と、熱く書いてみましたが、いまのPCだとPhotoshopCS5はやっぱりちょっともっさりするので、しばらくは今まで通りにImageReady7.0でドット絵作業をしていくと思います。
そのPCを新調したら、乗り換えていこうかなぁ。

★2011/6/15に続き記事を公開しました。
PhotoShopCS5をドット絵ツール化 その2


関連記事

この記事へのコメント

- そん - 2013年05月07日 22:23:03 [編集]

プレビューは「ウィンドウ」→「アレンジ」→「(ファイル名)の新規ウィンドウ」ではどうでしょうか?
画像を編集すると同時に全ウィンドウに反映されるのでプレビューとして機能します。

複数のウィンドウのそれぞれ違った倍率で表示したり
グリッドを表示する・しないもので分けられるなど
通常のプレビューより便利かなーと思います。

Re: タイトルなし - ぴぽ - 2013年05月08日 09:29:39 [編集]

そんさん

コメントありがとうございます。

「新規ウィンドウ」、前に別のバージョンで使ってみて、なにか不都合があった気がしてたんですが、CS6で試してみたら、バッチリ理想通りのものでした。さっそく導入していきます。
教えていただいてありがとうございます!

非公開にする :

トラックバック

URL :

プロフィール

ぴぽ

管理人:ぴぽ
フリーのグラフィックデザイナーという傍ら、「ゲームを作りたいなぁ♪」と奮闘中です!

TwitterYoutubeチャンネルtwitchチャンネル
Fantia-ぴぽやフレンズCi-en ぴぽやフレンズ

▼運営サイト
・ぴぽや倉庫
 公開した素材のまとめ

・ぴぽやリンク
 素材配布サイトリンク集
・はじめてのウディタ
 ウディタお勉強wiki

ご感想・ご連絡


カテゴリ
最新コメント
リンク

リンクして頂ける場合はこちらのバナー画像をお使いください。
※バナー画像なしでも構いません。

RSS
広告
おすすめ有料素材
同人誌、同人ゲーム、同人ソフトのダウンロードショップ - DLsite.com

タイルセット
ねくらファンタジーマップチップ素材集
ねくらレトロフューチャーマップチップ素材集
普通シティ 現代日本都市タイルセット
ファミコン風RPG基本マップ素材セット

背景イラスト
みにくる背景CG素材集『ファンタジー編』part01
みにくる背景CG素材集『ファンタジー編』part02
みにくる背景CG素材集『ファンタジー編』part03
砂漠の戦闘背景 サファイアソフト素材 Vol2
雪の戦闘背景 サファイアソフト素材 Vol1

エネミーイラスト
イラスト素材集-baroque-
イラスト素材集-異界のアリス-
RPG制作に使えるデフォルメ素材集~モンスター娘編~ Vol.3

キャラチップ
ぴぽやキャラチップ素材集 乗り物10種
どうぶつキャラクターチップセット3

キャラ立ち絵
中世ファンタジーRPG風2Dキャラクターパック【キャラクター画像素材】
立ち絵素材男女
【立ち絵素材】Aさんのバイト服
【立ち絵素材】現代人まとめ (女子生徒・男子生徒・一般女性・一般男性・少女)

エフェクトアニメ
物理攻撃エフェクト素材集1 71点収録
ぴぽやゲームエフェクト素材集01-斬撃- &02-属性斬撃- セット

アイコン
イラストアイコン素材集Vol.1
ゲーム製作用アイコン集#01
ぴぽや感情&状態アイコンアニメ素材集
ファンタジーゲーム向けアイコン素材1

ゲーム制作ソフト
SMILE GAME BUILDER
SRPG Studio
ティラノビルダー PRO