<画像：>

先日から提供が開始されたAdobe Creative CloudのCCｼﾘｰｽﾞ｡
とりあえず色々ｲﾝｽﾄｰﾙしてみました｡

まだそんなにｶﾞｯﾂﾘと使い込んではいないのですが､Photoshop CCでぐっときた機能をご紹介｡

角丸の矩形のﾘｻｲｽﾞが便利に

<画像：>

今までのﾊﾞｰｼﾞｮﾝでは､角丸の矩形を自由変形すると角丸が崩れてしまいました｡

<画像：>

分かりやすいようにちょっと大げさに拡大

なので､いちいちﾊﾟｽを選択してぐぐｰって伸ばしていたんですが､地味に面倒｡command＋T(WindowsならCtrl+T)でぱぱっとﾘｻｲｽﾞできないの不便...

<画像：>

それがCCでは､自由変形し放題!Cmd+Tでぐいぐいﾘｻｲｽﾞしても問題なし｡

<画像：>

どんなに矩形のｻｲｽﾞを変更しても角丸の半径は維持されます｡
角丸の半径を後から変更するのもなんのその｡

あと､ここの数値をみれば｢ここのborder-radiusは○pxねｰ｣ってな感じですぐ分かる｡

<画像：>

この機能は､CCで作ったpsdﾌｧｲﾙじゃないと使えないみたいです｡
CS6で作成したPSDをCCで開くと｢ﾗｲﾌﾞｼｪｲﾌﾟの属性｣が表示されませんでした｡

ﾚｲﾔｰ(もしくはﾌｫﾙﾀﾞ)を右ｸﾘｯｸでCSSをｺﾋﾟｰ

<画像：>

今までもﾌﾟﾗｸﾞｲﾝを使えばCSSを出力することができましたが､CCからはﾌﾟﾗｸﾞｲﾝなしでできるようになったようです｡

<画像：>

｢CSSをｺﾋﾟｰ｣を選択後､ﾍﾟｰｽﾄするとこんな感じで表示されます｡
ﾚｲﾔｰ名､ﾌｫﾙﾀﾞ名がｸﾗｽ名になってます｡

全部そのまま使えるかっていうとあれですが､色々な値がずらｰって表示されるのは便利｡
とりあえずｺﾋﾟﾍﾟだけしておいて､諸々の値を見つつsassでだｰっと書いていく感じで作業をすすめてみたい｡

ただ､1点だけおしいとところが｡
色の部分がなぜrgbaじゃなくてrgbなのか...｡
ﾚｲﾔｰｽﾀｲﾙで不透明度を100%以外に設定していても､出力されるCSSには反映されないみたいです｡
設定する画面も見当たらないので､ここはどうしようもなさそう...(表示させる方法があったら教えて下さい)

CS6で作成されたPSDをCCで読み込んでも､CSSの出力は問題なくできるようです｡