一定期間更新がないため広告を表示しています
一定期間更新がないため広告を表示しています
Fireworksで使えるテクスチャーを配布するサイトが増えてきましたね！私もよくデザインに活用させてもらってますが、水平線や斜線やグリッドなどが主でFireworksに元から入っている木目のようなの質感系テクスチャ（勝手に名づけ）のはなかなか配布されていなかったので自作してみました。 身の回りのものをスキャンしたり、photoshopのフィルターを利用して作成したものですが、よかったらご活用ください（＾＾） Fireworks「質感」テクスチャ15種 ご利用方法 ダウンロードしたいテクスチャ画像の上で右クリック名前をつけて画像を保存でダウンロードしてくださいFireworksテクスチャの利用方法や、質感テクスチャの活用方法については下記のサイトが参考になるかと思います。 fireworksでのテクスチャの使い方 | シンプルパターン研究所 ナチュラル系ブログデザインをFireworks
管理者のTwitterです。更新情報もお伝えしてます facebookページです。是非いいね！を RSSの登録はここからどうぞ ご連絡の際はこちらか"Contact"へどうぞ なんか身近で「ページ」機能を使っている人がもの凄く少なかったので、簡単にまとめてみました。似た機能である「フレーム」機能はよく使われていると思うので、ここでページとフレームの機能の違いについて、おさらいしましょう！ 「フレーム」機能 「フレーム」はタイムラインの概念を持っているため、本来の役目としてはアニメーションを作成する事なのですが、Webページのデザインを行なう場合では、別のキャンバスとして活用することも出来ます。 「フレーム」が変わっても、スライスの設定は全フレームで共通となります。（座標の位置も変わらない）なので、ボタンなどのマウスオーバー・ダウン時の状態を別フレームに入れておくと、書き出す際、フレームごと
こんばんは、最近「ももいろクローバーZ」にハマってしまいましたishidaです。 先月発売された1stアルバムを買うか否か迷ってます。 今週末土曜日に、読売ランドでライブもあるんだよなぁ～。 さてさて、今回はちょろっとFireworksの拡張機能のご紹介です。 拡張機能にもいろいろありますが、 汎用的に使えそうな144種類がセットになった拡張機能です。 mxp形式で配布されているので、 インストールするとFireworksプロパティパネルの［テクスチャ］にドーンと表示されるようになり簡単に使えます。 テクスチャ画像を配布しているサイトはよくありますが、拡張機能として配布しているのは珍しいですね。 配布元サイト Texture Collection 144 - Fireworks Zone
一定期間更新がないため広告を表示しています
Adobe Fireworks is another great software product from the Adobe's Creative Suite family. And even though this software is not as popular as elder brother - Adobe Photoshop - we still believe that it does have a future, and that it is a good tool for designers. You'll be amazed by how versatile its functionality is because you can use it almost for everything that's related to web design this way
Adobe の Creative Suite 5.5 が発表になりましたね。 Dreamweaver の進化っぷりが凄まじいですが、影に隠れて Fireworks も実は 5.1 にマイナーバージョンアップしています。 参考：Fireworks CS5.1 in Creative Suite CS5.5 バグ FIX がメイン（それだけでも有難い！）ですが、書き出し時の色の最適化が改善されていたり、ファイル保存時に最後に保存した場所がデフォルトで開くようになっていたりするようです！ 嬉しい…！ 今回は、Fireworks でちぎった紙っぽいパーツを簡単に作る方法をご紹介します。 Step1 とりあえず、カンバスに背景を敷きます。（サンプルは Fireworks の塗りの「パターン」にある「青い布」をそのまんま） Step2 白い矩形を置きます。 Step3 ストローク（破線ダブル、外側、1
Webサイトのデザインをしているときに 「あ、このグラデーションって、どういう色だったかな？」 「ここのフォントはなんだっけ？」ってことがあります。 そういう時に便利なのがFireworksのスタイル機能です。 スタイル機能って何？って人のために、少し解説したいと思います。 スタイル機能とは、Fireworksに登録されている スタイルパレットのことで、グラデーションスタイルや フォントのスタイルを、選択したオブジェクトに対して 一括で変換してくれる機能のことです。 このスタイル機能を活用することで次のようなメリットが得られます。 デザイン作業の手間が軽減される 同じスタイルを適用する際に、色やグラデーション、 ドロップシャドウなどの値を覚えておく必要がない デザインの表現の幅も広がる スタイル機能の使い方 このように、Fireworksにはいくつかスタイルが 登録されています。 試しに1
さて、今回は前回の「Fireworksで立体的なアイコンを作る方法」よりも もっと簡単にできるアイコンの作り方です。 今回は5分で作れるアイコンのご紹介！！ …の予定でしたが、ブログ記事用に作り直したら7分ちょうどかかりました。 すみません… 操作自体は簡単なので、速い方は5分でできると思います。 ぜひ、5分に挑戦してみてください！ アイコンはこちら、建物アイコンです。 ページ下部で制作動画の紹介や、ベクトルデータのダウンロードも可能です。 会社概要の見出しなどに使ってみてくださいね。 速く作るポイントは2つ パスの変形「歪みツール」を使う フィルター効果「シャドウ（内側）」を2つ重ねて使う たったこれだけです。 1.平面の形を作る パースのあるアイコンですが、 まずは真正面から見た図（平面図）をつくります。 2.歪みツールで立体的にする 平面ができたら、１面全部を選択し「歪みツール」で立
サイトや広告バナーをつくる際に、イメージアイコンを使うことがよくあります。 ただ、配布されているイメージアイコンを使用する場合、 「形を少し変えたい！」 「複数のアイコンを組み合わせて使いたい！」 など、サイトなどの雰囲気に合うよう、手を加えたくなる時があります。 ただ、データの加工が不可だったり、加工するのに時間がかかったり… 時間短縮のために配布素材を使ったのに意味がなかった！なんてこともあります。 そんな時はイメージアイコンを 最初から自分で作る！ というのも1つの方法です。 今回は、Fireworksを使って簡単に立体的なアイコンを作る方法を ご紹介したいと思います。 作業は単純。 パスの合体 パスの切り抜き 拡大縮小 の繰り返しです。 1.形をつくる 楕円を2つ描きます 楕円の上に四角を重ねて合体させます 合体したパスの上にさらに四角を重ねて切り抜き、余分な部分をカットします 合
こんにちは。今年は夏フェスにはいかない!と決めたのに、ラインナップが発表されるとソワソワしているminamiです。 Fireworksネタです。Fireworksには9スライスという便利な機能がありますが、 ちょっと応用してこんな風に使ってみました。 ※作成例はFireworks CS5を使用しています。 9スライスとは、おさらい 9スライスはFireworks CS3から導入された機能で、ベクターシンボルやビットマップシンボルの端の形状を保ったまま、中間だけを伸ばすことができます。 9スライスはシンボルを作成する際に、オプションにチェックを入れることで有効にすることができます。 よく使われると思われるのが、角丸のオブジェクトの拡大縮小です。 上のようなサイトのデザインを作った時、テキストの長さが変わると、角丸の背景部分も伸ばさないといけなくなります。普通に拡大してしまうと角丸の形状が崩れ
フォントのサイズとか何パターンかスタイルとして定義しておくカンプのステートとは別に本デザインのステートを作り、切り替えながら作業する使う色を■で作って端に置いておき、それを1個ずつスタイルでも用意しておく。塗りや線の色を選ぶときも、スポイトツールでそのスタイルをクリックすれば色が適用されるFwで用意されているパターンは癖が強い感じのものが多いけど、フィルタで色相彩度変更すれば結構応用可能なんかオブジェクト作り、整列パネル→間隔→12pxとか選べば、12px間隔で並んでくれるので便利選択範囲をパスに変換機能パス書いてから、パス→ストロークを塗りに変換 ってやればそのあと細かく編集できるパス書いてから、プロパティパネルでストロークを編集とかやると点線とか超細かく作れる星ツールのパスいじるとキモイ形が色々できるグレースケールで作ったボタンをスタイルセットとして登録しておき、使う時にそれ適用して色
アイコン、ボタン、リボンをはじめ、フォーム、スライダー、ツールチップ、メニューなどウェブデザインでよく使用されるようなエレメントをFireworks用のファイルで配布しているサイトを紹介します。 Webportio Graphical resource of Adobe Fireworks [ad#ad-2] 素材の利用にあたってはウェブサイト・ソフトウェアなど、個人でも商用でも無料で使用できます。また、利用の際にはバックリンクの必要もありません。 お願いとして、このサイトを何らかの形で広めてくれると嬉しい、とのことです。 素材はウェブデザインによく利用するエレメントも数多くあり、下記にいくつか紹介します。
夜中のセミがうるさい季節になりました、toyama です。 窓ガラスにカナブンが激突してくる音もうるさいです。一応、横浜市民です。 Fireworks でボタンを作ったりするときに使う、文字のいじり方を簡単にまとめました。 ボタンを書いて、テキストをおいて、これで完成！でも十分ですが、なんかテキストが読みにくいな、と思ったときにやってみると落ち着きます。 こんなボタンがあるとして 淡いブルーのボタンに、白い文字でテキストを配置する、よくあるボタンです。 ちょっと可視性が低いって言われるかなー、という感じなので、テキストに一手間加えます。 1. グロー テキストを選択して、プロパティパネルから[フィルタ]→[シャドウとグロー]→[グロー]を選択します。 ボタンの色よりちょっと濃い目の色を選んで、効果の数値を設定。あまりキツくかけすぎると素人っぽい感じになってしまうので、この辺の数値はプレビュ
一定期間更新がないため広告を表示しています
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く