WEB系だと画像加工にFireworksとPhotoShopを使っている人が多いと思う。 私の周りだと切り出して部品化はFireworksだけど、ブラシどうしても必要で、 それのためにPhotoshopでラフ画像作るなど多い模様。 そんな人のためにFireworksでブラシを使う方法を書いて見る。 のっけから言っとくと、Photoshopのブラシそのままで使うんじゃなくて、 あくまでスタンプというかPNG画像として使う。 まずはABRなブラシを用意。 そのままでは見れないので、abr Viewerを用意。 下記サイトからダウンロード。 http://abrviewer.sourceforge.net/ 現状新しげなRelease_NET20_2.0.rar 58.6 KiB Tue Jun 05 2007 18:17 225,720 をダウンロードして解凍。 abrViewer.NET.e
最近のコメント PHP オブジェクト指向の勉強 └ Red - 2010.01.08 └ hogepage - 2010.01.21 └ Red - 2010.01.22 └ - 2011.11.27 └ houseiii - 2011.11.27 Fireworks トリミング画像を一括書出 CS4編 └ Iper - 2009.06.27 └ Red - 2009.06.27 └ mala - 2011.11.17 └ Red - 2011.11.18 jQueryでボックスを上下左右中央に簡単配置 └ ミラクル - 2009.03.15 └ Red - 2009.03.15 └ entZ - 2011.10.22 └ Red - 2011.10.24 overflow を使用したボックス背景のこと └ - 2007.12.13 └ Red - 2007.12.13 └ - 2007.
管理者のTwitterです。更新情報もお伝えしてます facebookページです。是非いいね！を RSSの登録はここからどうぞ ご連絡の際はこちらか"Contact"へどうぞ Webデザインを行うことで最も大事なことに一つに、配色があります。配色といってもなかなかどの色を使ったらよいのか悩むところですが、Fireworksに最初から付いている「Adobe kuler」というサービスのエクステンションを使えば、豊富な配色テーマを使う事が出来ます。 「kuler」（クーラー）は元々オンライン上にあるサービスです。それをFireworksの一パネルに読み込んで使っちゃうわけです。 kuler では、「kuler」（クーラー）の使い方についてご説明します。非常に簡単です。 「kuler」のエクステンションを表示する まずはkulerのエクステンションのパネルをFireworks上で表示させます。「
こんにちは、イメージ担当の長谷川です。 今回は 1px にこだわったリッチな Web や UI デザインを更に立体的で奥行きのある雰囲気にする『MAX 塗り』を取り入れたグラフィック作成手法をご紹介します。 ところで『MAX 塗り』ってご存知ですか？ガンプラなどが好きな方はピンと来たと思いますが、プラモデルなどに興味がない人は全く分かりませんね。 『MAX 塗り』とはプラモデルに立体感を出すためにエッジから中央に向かってぼかしていく、昔からある「ぼかし塗り」や「グラデーション塗り」の技法です。 この技法で塗装されたプラモデルは単純に塗装したものより格段に迫力や存在感が上がります。プロモデラーの MAX 渡辺さんが良く使うプラモデルの塗装技術として通称『MAX 塗り』と呼ばれています。 Web や UI にこの『MAX 塗り』を取り入れる方法は簡単です。 作ったボタンや背景などのグラフィック
こんにちは！デザイナーの長谷川（ヒロユキ）です。 僕は Fireworks 大好きっ子なのですが、残念ながらフェンリルのデザイナーは殆ど Illustrator や Photoshop でデザインしているので、今日は僕が Fireworks を手放せない理由のひとつであるページ機能を紹介したいと思います。 ●動的なコンテンツや背景などのスライス書き出しがメッチャ楽 Fireworks CS3 で実装されてしばらく使わずにいたページ機能は今では無くてはならない機能です。 こういうデザインの場合、メニューの背景の画像とボタンの画像をそれぞれスライスしたいのですが、レイヤーのみで管理しているとスライスを重ねるしかなく、必要な画像をスライスする時に他のスライスを非表示にして背景レイヤーを消して…などと非常に面倒です。 ここでページ機能が威力を発揮します。 デザインができたら、ページを複製します。複
こんにちは、イメージ担当の長谷川です。 「品質を上げれば速度が落ちるし、速度を上げれば品質が…」 デザイナーにとってはこの品質と速度が非常に悩ましいですよね。 今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。 1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」 Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。 【使い方】 インストールするとコマンドに「Smart Resize」が追加されます。 サイズ調整をしたいデザインを選択して コマンド＞ Smart Resize ＞ Attach を選択します。 後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的
春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル（現ラクマ）のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE
一定期間更新がないため広告を表示しています
2010年9月25日に.coder「すこーし愛して。ながーく愛して。Webパフォーマンス」でプレゼンさせていただきました。 あまりのイケてるプレゼンテーターの中にちょっと申し訳ない感じでしたが、 みなさまアットホームに迎え入れていただき、楽しい1日を過ごすことができました。 私は「みんなで使おう！Fireworks！ 〜Fireworksで画像最適化〜」というお題で プレゼンしたので、簡単にその中身をここでも紹介させていただきたいと思います。 今回はFireworksとPhotoshopの画像の書き出し方を比較してみました。 ちなみに使用したアプリケーションはFireworks CS5 とPhotoshop CS5 です。 PNGの書き出しは実はFireworksのほうが軽量！？ PNGを書き出すときに画像データ以外のチャンクという必要のないデータも書き出されます。 実はそのチャンクデータ
カテゴリーリスト 日々の中で (69) MacやApple (55) 参加したセミナーなど (41) プレゼンテーション (36) 音楽 (25) 映画/テレビドラマ (24) セミナーなどの出演 (22) 読んだ本など (18) お仕事関連 (18) その他 (7) 執筆した本など (5) Web (4) 英語 (3) モブログ (2) 主催したセミナーなど (2) 最近のコメント Snow Leopardでは、QuickTime XとQuickTime 7を共存できる NO NAME 2009年12月10日 20時52分 PDFでプレゼンを行うときには、フルスクリーンモードを使いましょう ryotarox 2009年12月03日 21時25分 コーディング最大の効率化は、入力を減らすことに行き着く 淋しい 2009年11月17日 00時30分 「ウェブアプリケーション画面設計トレーニン
Fireworksでmxml書き出し † Fireworks CS3からmxml形式で書き出すことができるとのことで、試してみました。 これまで、Fireworksで組んだものをまた一からmxmlで組みなおしていましたよ。。 [ウィンドウ]→[共有ライブラリ]にFlexコンポーネントが用意されています。 （表示されない場合は（C）\Program Files\Adobe\Adobe Fireworks CS3\Configuration\Common Libraryにあるpngを一旦開いてみると表示されます） これをドラッグ＆ドロップで配置していきます。 用意されているのは下記の14コンポーネント。 Accorodion Button CheckBox? ComboBox? Cursor NumericStepper? Panel PopUpButton? RadioButton? Scr
6月にFlash CatalystとFlash Builderのパブリックベータ版がリリースされた後、「FXG」という新しい画像ファイルフォーマットについてよく見かけるようになったのではないでしょうか。そのFXGが何なのか、みなさんご存じですか？ FXGは、Flash Catalyst、Flash Builder、Flex 4、Flash Professional、Creative Suiteユーザーにとって重要な存在です。その理由は何でしょうか？ 本記事では、FXGについて詳しく解説していきます。まずは、MXML Graphicsについて解説し、MXML GraphicsからどのようにFXGに繋がるのか、そして新しいFlashプラットフォームでのデザイン・開発の枠組みにおいてどのようにFXGやMXML Graphicsを活用することができるのかを説明します。 MXML Graphics
例えば Web サイトのリニューアル案件では「ロゴのデータはありません。現サイトで使っている gif 画像を使ってください」というケースがよくあります。 「ロゴを白抜きにしたデザインパターンを作りたいんだけど…」という場合には、ロゴをトレース→パス化して使い勝手の良い素材を用意するのがベストな方法ではありますが、トレースする時間が取れない時は以下の方法がお手軽でオススメです。 使用した画像加工ソフトは Fireworks です。 ↑支給された（というか Web サイトからコピーした）ロゴの例。透明化もされていないし、切り抜くのも面倒。 STEP 1 ロゴ画像をグレースケールで保存します。 STEP 2 グレースケール化したロゴ画像を背景の上に配置。 STEP 3 ロゴ画像を選択して「フィルタ」→「カラー調整」→「カラーの塗り」を設定。 カラーは何色でも良いですが、ブレンドモードは「反転」に
About Contact Is A Dating App Designed to be Deleted the Answer to Modern Online Dating?Hinge, an app created for online dating which is designed to be deleted after meaningful connections are made, offers a fresh concept of digital courting. This distinct approach was engineered with the idea that once users build special bonds via this platform, they no longer need it in their lives and can dele
About Contact Is A Dating App Designed to be Deleted the Answer to Modern Online Dating?Hinge, an app created for online dating which is designed to be deleted after meaningful connections are made, offers a fresh concept of digital courting. This distinct approach was engineered with the idea that once users build special bonds via this platform, they no longer need it in their lives and can dele
デザイン部の新免です。 EC studioでは主にFireworksを使用して素材を作っています。 いろいろ作り方を参考にしたいと思い探してみるのですが、 Photoshopでカッコイイ素材を作るチュートリアルは 沢山紹介されていますが、なかなかFireworksを使用した 素材のチュートリアルと言うのが見つかりません。 そこで今回は、メモ的な感じでPhotoshopのチュートリアルを 参考にして、Fireworksで素材をつくってみます。 今回は COSMO-DESIGNS.COM こちらのサイトで紹介していたものを参考にしました。 まずはファイルの「新規作成」から ・幅：400px ・高さ:400px ・解像度：72px/in ・キャンバスカラー：カスタムカラー（#353535）で 新規ファイルを作ります。 楕円ツールを選択し、好きな大きさの円を描きます。 フィルタから「Photosh
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
