【ColorMatrix】

com.quasimondo.geom.ColorMatrix v2.1がステキ

Actionscript3

Hydrotweenのcolor(色)tweenにバグがあったおかげで、ColorMatrixを集中的に調べることができた。
普段何気なく使っているグラフィックツールに同じ機能があったり、勉強になった。

また、Mario KlingemannさんのColorMatrixクラスに巡り会えた幸せな旅だった。
Nomadic FunctionsのJavascriptで作られたColorMarix関数は感激もの。
輝度(Luminance)の不思議にも出会うことができたのは大収穫。

com.quasimondo.geom.ColorMatrixを試しに使ってみた。
全部試してはないけど、どうも相当イケテル予感。
com.gskinner.geom.ColorMatrixでドギモを抜かれたけどそれ以上かも・・・
Saturation, Contrast, Brightness, Hue はもちろん Invertも一発、他にもどう使うのかまだ理解できないrotateHueなんて関数も用意されていて、超強力布陣。
グラフィックの勉強をちゃんとしないと使いこなせそうにナイ。

The Flash plugin is required.

5×4のMatrixを生成するのでColorMarixFilterにセットして使いなナ感じ。
引数の値の範囲がよくわからない関数がある、さらに検証。。。
緑のワクがオリジナル。

import com.quasimondo.geom.ColorMatrix;
 
var cm:ColorMatrix = new ColorMatrix();
cm.invert();
target0.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustSaturation(-2);
target1.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustSaturation(2);
target2.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustContrast(-1);
target3.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustContrast(1);
target4.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(128);
target5.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(0,128);
target6.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(0,0,128);
target7.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(90);
target8.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(180);
target9.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(-90);
target10.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(90);
target11.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(180);
target12.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(270);
target13.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.luminance2Alpha();
target14.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.setChannels();
target15.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.setAlpha(0.5);
target16.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.averageRGB2Alpha();
target17.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.invertAlpha();
target18.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(0,1,1);
target19.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(1,0,1);
target20.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(1,1,0);
target21.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(.5,.5,.5);
target22.filters = [new ColorMatrixFilter(cm.matrix)];
Bookmark and Share

Actionscript 3, ColorMatrix ColorMatrixFilterを調べてみた

Actionscript3 Javascript

AS3でのColorMatrixFilter, ColorMatrix、Flash特有の機能ではなくグラフィックに関する基本的要件のひとつらしい。

Mario KlingemannさんのColorMatrix ver.2.1をながめているとapplyColorDeficiencyメソッドのクレジットに
the values of this method are copied from http://www.nofunc.com/Color_Matrix_Library/
とある。

クレジット記載のサイトNomadic FunctionsではJavascriptで作られたColorMatrix,Color Pickerライブラリのデモとソースが公開されている。
Nomadic FunctionsではAS2 Flash8版のMario KlingemannさんのColorMatrixクラスにインスパイアされてこのライブラリを作った、だって。

Mario Klingemann->Nomadic Functions->Mario Klingemann

と、できる人はお互いに触発されてるんだなぁ。

ColorMatrixへapplyColorDeficiencyが2008-04に追加されver.2.1にアップデートされている。
Nomadic FunctionsのColor Blindnessが移植されている。

“Color Blindness”,聞き慣れない言葉で直訳すると「色覚異常」とでもなるのかもしれない?
色彩にハンディキャップのある人たちがどう見えているかをシュミュレートするグラフィック用語として使われているらしい。
Normal
Protanopia
Protanomaly
Deuteranopia
Deuteranomaly
Tritanopia
Tritanomaly
Achromatopsia
Achromatomaly
などの設定があり
'Achromatopsia':[0.299,0.587,0.114,0,0, 0.299,0.587,0.114,0,0, 0.299,0.587,0.114,0,0, 0,0,0,1,0, 0,0,0,0,1]は色彩が無いグレースケールになる。
Color Blindnessでデモが見られる。

またこの設定値をPhotoshopのチャンネルミキサーに設定できるから試してごらんて書いてあったので、やってみた。
チャンネルミキサーには整数しか入力できなかったが結果はデモ通りだった。

Photoshopチャンネルミキサ

Photoshop チャンネルミキサー

チャンネルミキサーなんて使うのは初めてだった。どういう時につかうのだろう。
他にも使ったことのないメニューはいっぱいあるけど・・・
Photoshopのプリセットから画像効果をかけられるはず、どんな時に使う???

Nomadic FunctionsのColor Pickerを見るとRGBとHSVの関係がよくわかる。
ColorMatrixFilterで色を変えることもできるんだとあらためて実感。

有用な情報を提供してくれている両氏に感謝。

情報と情報がリンクしているのが見えてきて、ぼんやりとでもわかってくるとちょっと楽しくなる。

Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(3)

Actionscript3 HydroTween

HydroTweenは色(color)をtweenする時、hexをRGB成分に分解した後ColorMatrixFilterの成分にセットするところで、luminance定数にx2.81している。
作者のdonovanさんの意図が良く分からないが、なにか理由があるのかもしれない?

x2.81をしないとどうなるか試してみる。
この投稿の続きを読む »

Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(2)

Actionscript3 HydroTween

hex(0xRRGGBB)をRGBに分解する。
Quasimondo – Mario KlingemannのColorMatrix 、Grant SkinnerさんのColorMatrixとHydroTweenを参考にした。

hex:uintをRGB成分を持った配列へ変換する関数。

function hexToRGB(rgb:int, returnmode:Boolean=false):Array{
	var r:Number;
	var g:Number;
	var b:Number;
 
	r = (((rgb >> 16 ) & 0xFF) / 0xFF);
	g = (((rgb >> 8 ) & 0xFF) / 0xFF);
	b = ((rgb & 0xFF ) / 0xFF);
 
	if (returnmode) return [r*255,g*255,b*255];
	return [r,g,b];
}


1.hexToRGB(0xff0000); // [1,0,0]
2.hexToRGB(0xff0000,true); // [255,0,0]

この投稿の続きを読む »

Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(1)

Actionscript3 HydroTween

HydroTweenはcolorプロパティ(色)のtweenにColorMatrixFilterを使っている。
hue,saturation,contrast,brightnessなどの変化に使われているアレ。
Grant SkinnerさんのColorMatrixが移植されている。
このmatrix、分かる人には分かるのだろうけど相当難しい。

ColorMatrixFilterを使って任意の色指定ができるのかHydroTweenを参考に調べてみる。
この投稿の続きを読む »

Bookmark and Share

HydroSequence, HydroTweenでColorMatrix(hue,saturation,contrast,brightness)をtween

Actionscript2

HydroSequence, HydroTweenにはhue,saturation,contrast,brightnessをtweenできる。
FlashのColorMatrixFilterを時系列で更新している、コア部分はGrant SkinnerさんのColorMatrixクラスが移植されていた。

Actionscript 2時にリリースされ、自分なりにextendsしたクラスを作ったりもし大変お世話になったクラスの一つ。
AS3ように自分でアップデートしていたが実際にはAS3版もリリースされていたのは、HydroTweenのソースにクレジットが記述されていて気がついた。

AS2:http://www.gskinner.com/blog/archives/2005/09/flash_8_source.html
AS3:http://www.gskinner.com/blog/archives/2007/12/colormatrix_upd.html

AS2で作ったhue,saturation,contrast,brightnessシュミレーター。

The Flash plugin is required.

Bookmark and Share
WP Theme & Icons by N.Design Studio
RSS