最近昼間の暖房が少し暑いくらいなので、油断して薄着で出かけてみたら夜寒くて死にそうになった seki です。 今回は、先日Fireworksの拡張機能を色々復習＆整理をしていた時にたまたま見つけた拡張機能「Transform Panel」というのを入れてみたので、機能のご紹介をします。Fireworksで要素のサイズや細かい座標をプロパティで直接入力する人には、痒い所に手が届く良さを感じられるかと。 詳細は以下より。 ダウンロード http://www.senocular.com/fireworks/extensions/?entry=572 こちらからダウンロードしてください。 「Transform Panel」で出来ること まずは基本となる便利な機能を一つ一つ見ていきましょう。 実際のパネルがこちら。 簡単に言うと画像やテキストの変形を補佐してくれる拡張機能です。 1.小数点単位を表示
ややうさんくさい感じのするタイトルですが、ホントの話なんです。 海外のサイトを見ていてたまたま見つけて試してみたところ「このプラグインを使えばデザイナー自身、そしてコーダーのお互いが幸せになれるっ!」と思ったので全力でご紹介したいと思います。 SPECCTRについてごく簡単に説明すると… フォント名やオブジェクトのサイズ、間隔、色などをボタン一つで建築の設計図のようにデザインの仕様を書き出せる というものです。 これまで、デザインからコーディングに取りかかる際に、ボタンのサイズやレイアウト間隔を正確に調べたりするには元データをいちいち開いたりしなければならず、地味ながら非常に手間のかかる作業が必要で、それらを一覧にできる良い方法が無いのが実情でした。 また、デザイナーからコーダーにデータを渡して、いざあがって来た時のレイアウトをみると、ところどころ変わっている部分があったりして、相互の無駄
Fireworksで使えるテクスチャファイル300種類を無料で配布しています。商用利用も可能です。ライセンス Fireworks texture galleryで配布してるテクスチャ画像（png形式）は、以下のルールを守ってダウンロードをしてください。 商用利用も問題ありません。Webサイトだけではなく、印刷物などに利用していただいても構いません。 Fireworksなどの画像加工ソフトで加工していただいても構いません。 著作権は放棄してません。許可なく素材として再配布することは禁止してます。 更新履歴 2009年5月21日 Fireworks texture galleryをリリースしました。 「水平線」「垂直線」「円」「斜線」「星」「和風」「チェック」「花」「ハート」「ダイヤモンド」「モザイク」「雪」からなる12のカテゴリ、300種類のテクスチャを公開しました。
さて、前回に続き、今回は WebデザイナーのためのAdobe CS6検証会 から Fireworks CS6 の情報まとめです。 Fireworks CS6 は、6月から私と一緒に Webデザインスクール の講師をされる @YumiSora さんから、詳細を詳しくまとめた資料をメールしていただけたのでそれを基に書いています。 Fireworks CS6の進化したところ CSSプロパティパネル 選択しているオブジェクトのCSSのコピペができるようになりました。 CSS プロパティパネルは、「ウィンドウ＞CSS プロパティ」より表示できます。 CSS3などの慣れないものや特殊なプロパティなど、ある程度ここからコピペして、 手動で改変やGoogle検索で調査のきっかけにするなどのワークフローに使えそうです。 線の位置を内側や中央にした場合、線幅を考慮した分、形そのものの width と heig
こんにちは。やっと八百屋さんの夏野菜が安くなってきてホッとしている seki です。 今回もFireworksのストロークとテクスチャについて書いていきます。 勿論皆さん、「もふもふ」した質感、好きですよね？(←押し売り) 季節的に大分遅い気もしますが、動物イラストやロゴ・アイコン・見出し背景などを、 可愛く演出してくれるFireworksで出来る個人的に大好きな質感！「もふもふ」スタイルを、手軽に再現する方法をご紹介します！ 「もふもふ」スタイルを設定する タイトル画像にあるような、こんな感じのウサギの毛みたいな質感です！ アイコンや背景を始め、ロゴ文字や、イラスト、アニメーションで動かしても可愛い。 また、写真と組み合わせても全くうるさくなく、使い勝手が良いのがお気に入りです。 女性向け・子供向けな、イラストの多いほんわかしたWEBサイトには持ってこいですね！ 設定は以下を参考に。 塗
先日友達が家に置いて行った「キャサリン」というゲームを、睡眠時間を生贄に2日でクリアした seki です。かなり久々にゲームしましたが、なかなか楽しめました。おススメです。 さてさて。今回は前回に引き続き、みんな大好き(※主に私) Fireworks の講座です。 今回は、「マル得」「合格」「請求書在中」「履歴書在中」「確認済」「支払済」などなど、ビジネス現場などでもよく目にする事が多い、シャチハタ（印鑑）っぽい文字を、 Fireworks で手軽に再現する方法をご紹介します。 例といたしまして。笑えるくらい今更ですが、今年入学した学生さんを祝って！ 「合格」印を作りましょう。 まずは普通に楕円形ツールを選択。 今回は解り易い様に大きめに作るので、180×180px の円を描きます。 塗りは「透明」、ストロークの太さは「14」色は「赤」。 種類は「エッジが硬い線（丸）」、位置は「中央」。
『GRAVITY DAZE』というゲームが気になっているminamiです。VITA買うか・・・！ さて、日頃Fireworksをメインに使っていく上でものすごく重宝している『Guides』という拡張機能があります。 ものすごく重宝しているんですが、一点残念な所があったのでそこを補うコマンドを作ってみました。（FireworksのバージョンはCS5.1です。） Guidesは超便利 もはや度々いろいろなところで紹介されている有名な拡張なので、Fireworks使いは必須な『Guides』ですが、一応ご紹介します。 Guides 配付ページ 『Guides』はその名の通り、ガイドを使いやすくしてくれる機能です。個人的には、「selection」のタブが、選択したオブジェクトに対して上下左右どこにでもガイドを引ける！さらにオフセットまで指定できる！ということで愛用しております。 しかし、この『G
こんにちは、イメージ担当の長谷川です。 「品質を上げれば速度が落ちるし、速度を上げれば品質が…」 デザイナーにとってはこの品質と速度が非常に悩ましいですよね。 今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。 1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」 Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。 【使い方】 インストールするとコマンドに「Smart Resize」が追加されます。 サイズ調整をしたいデザインを選択して コマンド＞ Smart Resize ＞ Attach を選択します。 後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的
精神科病院監修・設計による 理想の電子カルテ 精神科病院に必要な機能を網羅 ワンストップでのサポートサービス 既存の医事会計システムとの接続にも対応 ※ ※ 別途ご相談 国のガイドラインと グローバル標準規格の融合 厚労省等のガイドラインに準拠したクラウドを採用 グローバル標準データ規格 HL7 FHIR を採用 今後の遠隔診療や地域医療連携を見据えた、拡張性の高いシステム設計
一定期間更新がないため広告を表示しています
アイコン、ボタン、リボンをはじめ、フォーム、スライダー、ツールチップ、メニューなどウェブデザインでよく使用されるようなエレメントをFireworks用のファイルで配布しているサイトを紹介します。 Webportio Graphical resource of Adobe Fireworks [ad#ad-2] 素材の利用にあたってはウェブサイト・ソフトウェアなど、個人でも商用でも無料で使用できます。また、利用の際にはバックリンクの必要もありません。 お願いとして、このサイトを何らかの形で広めてくれると嬉しい、とのことです。 素材はウェブデザインによく利用するエレメントも数多くあり、下記にいくつか紹介します。
大量の画像を書き出す場面に遭遇して( ꒪⌓꒪)ってなるのはWEB屋の宿命のようなものですが そんな書き出しを一瞬でもはやくやっつけたい。 むしろやりたくない。なにもかも機械に任せたい。 機械がやってくれてる間にはとサブレ食いながら優雅にFaceBookをたしなみたい。 そんなめんどくさ効率を追求するために調べたまとめです。 なにかお役に立つものがみつかればうれしいです。 書き出しをとにかく速くしたい スライスチップ作成パレット スライスチップ作成パネル-CS4用 | Dearps スライスがFireworksみたいになるエクステンション。ほんとうに助かってます。 ワンクリックでスライスができるのでガイドつくってちまちまやるより数倍速いです。 Flash Helper Scripts Flash Helper Scripts：JavaScriptで「Flash＋Photoshop」連携をパワ
Fireworks 拡張アレコレ追加メモ Fireworks用にいろんなサイトで配布されているスタイルやパターンなどなど、いろんな素敵なものを追加するためのメモです。自分で作ったものを登録しておく方法の説明は今回は省略してます。 各素材等はmxp形式で配布されているものも多いので、その場合はExtension Managerでインストールしてください。下記はそうでない場合についてのお話です。 また、私の使用しているバージョンはCS4(Win用)なので、それに基づいてのメモとなります。バージョンやOS違いの場合は自分の環境に置き換えて確認してください。 スタイルを追加する スタイルパネルのオプションメニューで「スタイルライブラリを読み込み」を選択、スタイルライブラリの名前と場所を選択します。 「スタイルを読み込む」と「スタイルライブラリを読み込み」の違いは、前者の場合は現在のドキュメントに対
Fireworks コレ、5分で作ります。その１ ※このエントリはFireworks CS4を元に書いています。 Fireworks の日本語チュートリアル少ないなーという話を先日Twitterでしていたので、なんか作ってみます。あまり超大作のチュートリアルは手順を書く気力が途中でなくなりそうだったので、今日は5分くらいでコレ作る方法を書きます。 今回の完成形 見出しの背景画像によくありそうなこういう画像をパパっと作ります。 今回は素材集等、Fireworks の機能以外のものは使いません。 土台を用意 まずは一番下の土台を作ります。よくあるアクア風のやつにしますね。矩形で適当なサイズで長方形作って、塗りを線形のグラデーションに。４色決めてスライダーを調節。外側には1pxの線も加えます。 ここでのサンプルのサイズはW 470 * H 40 としました。 こういう見出し用の背景画像でよく左側
桜散ってしまいました、横浜シーブレインの toyama です。このあと梅雨と夏と残暑が待ち受けているかと思うとぐぬぬぬ… Fireworks のシンボル化が大好きです。あらゆる修正が一括で行えるなんてステキすぎる機能です。最近はこれシンボル化する必要ないだろ、と思ってもとりあえずシンボル化している有様です。だって何かあるといけないし！ 地味に便利なのが、罫線をシンボル化しておくことです。 テーブルなどをデザインする際に罫線をシンボル化しておくと、太さや色を一発で修正できて楽です。 今日はシンボル化した罫線にしかできない、簡単な表組みを作る方法を紹介！ 1.まずは罫線をシンボル化 矩形ツールの[四角]を使って高さ 1px の線を描きます。線を描くときにもラインツールを使わず矩形を使うのは、矩形の方がいろいろ便利だからです。 2.罫線を複製 シンボル化した罫線をコピペして 2 つにします。こい
こんばんは。きんくまです。 Fireworksで角丸矩形を作ったあと、それを拡大縮小するときの話です。 縦横比を固定のままだと問題ないんですが、固定じゃない場合、角丸がくずれちゃいます。 それを、直そうというコマンドを作りました。 やっていることは、くずれた矩形を削除してから、新しい矩形を作って、前の属性をコピーする。 というそれだけです。ヒストリパネルからいくつかコピったらすぐできました。 ■使い方 1.下のソースをコピーして、「replaceRoundRect.jsf」などの名前で保存。 拡張子が「.jsf」であれば何でもOK 2.Fireworks上で対象となる角丸矩形を選択 3.コマンド→スクリプトの実行から、さきほどのファイルを選べばOK ちなみに毎回やるのがめんどいので、CS3の場合 C:Program Files\Adobe\Adobe Fireworks CS3\Confi
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
