FLASH / オリジナルツール / 行列ビジュアル作成 'DRAW MATRIX'

デザインリソース作りツール第三弾です。

行列ビジュアル作成 "DRAW MATRIX"とは

20行×20列のシェイプ(ドットやタイプ)を配置してあり、 コントローラで、XY位置や、スケール、回転、ランダムなど、設定し、 ビジュアルを作成していきます。
DRAW MATRIX (FireFox以外で見たほうが動作が軽いです)
ほんまは、50行×50列くらいの量でやりたかったのですが、 えら重いので、20におさまりました。

用途

コントローラをいじって、ビジュアルを作成し、ええ感じになったら、スクリンショットをとって、 デザインアプリ(fireworksとか)で使用するイメージです。 実際には、以下のように、トランジションっぽいデザインのときに使うイメージです。
あと、A色からB色へのグラデーションがあったとき、 かわりに、トランジションでA色からB色に変更させたほうが、キラキラした感じになります。

PI_NumberControllerLiteを使ってます

前回のエントリーで紹介した、高機能スライダー(コントローラと呼んでます)のLite版を使用してます。 Flash / オリジナルコンポーネント「PI_NumberController Lite」追加

コントローラ解説

そのほか

使用制限はありません

商用・非商用にかかわらず、デザイン業務でじゃんじゃんつかってください。

生成された画像例

キャプチャしたままの画像を、トリミングして掲載します。
2008/05/26_01
2008/05/26_02
2008/05/26_03
2008/05/26_04
2008/05/26_05
2008/05/26_06
2008/05/26_07
2008/05/26_08
2008/05/26_09
2008/05/26_10
2008/05/26_11
2008/05/26_12
2008/05/26_13
2008/05/26_14
2008/05/26_15
2008/05/26_16
2008/05/26_17
2008/05/26_18
2008/05/26_19
2008/05/26_20

素材集をつくってみました

以下のフォーマットで用意しました。 AIについては、ビットマップデータをライブとレースかけてつくりました。
  • PNG (adobe fireworks)
  • PSD (adobe photoshop)
  • AI (adobe illustrator)
案外、ライブトレースかけたデータのほうが、マイルドな感じになっていいです。

ファイルのダウンロード

PNG、PSD、AIとまとめて一式で配置しました(6MB)。
使用制限はありません
商用・非商用にかかわらず、デザイン業務でじゃんじゃんつかってください。

エントリー一覧

ソーシャル

About This Site

HTML、CSS、Javascript、デザイン、3D、モバイルアプリ、CMSなど、ウェブ制作関連の話題を扱うブログです。Fireworksのオリジナル拡張機能の配布や、デザインリソースの配布、オリジナルツールの公開も行っています。

About Me


大阪在住フリーのウェブデザイナーの、ピクセルイメージ田中です。長年、ウェブサイト構築のお手伝いを行っており、デザインやプログラムを中心に、Flash全盛期につちかったモーショングラフィクスのセンスを生かした動画作成や、サイト構築に便利なCMSの開発も行っています。

JS CMS -- DBレス・簡単導入・無料のWebサイト構築用オープンソースCMS
ピクセルイメージ | JS CMSの導入、カスタマイズの依頼は...