タグ

fireworksに関するwozozoのブックマーク (35)

  • Fireworksの今後に関するまとめと、ワークフローの考察 (with tweets) · yhassy · Storify

    Fireworksの今後に関するまとめと、ワークフローの考察Twitterで発信していたものをまとめました。関連する情報も付いています。

    Fireworksの今後に関するまとめと、ワークフローの考察 (with tweets) · yhassy · Storify
  • Fireworks の “ページ機能” でスライスなどの作業効率が 3.5 倍アップ! (フェンリル | デベロッパーズブログ)

    こんにちは!デザイナーの長谷川(ヒロユキ)です。 僕は Fireworks 大好きっ子なのですが、残念ながらフェンリルのデザイナーは殆ど Illustrator や Photoshop でデザインしているので、今日は僕が Fireworks を手放せない理由のひとつであるページ機能を紹介したいと思います。 ●動的なコンテンツや背景などのスライス書き出しがメッチャ楽 Fireworks CS3 で実装されてしばらく使わずにいたページ機能は今では無くてはならない機能です。 こういうデザインの場合、メニューの背景の画像とボタンの画像をそれぞれスライスしたいのですが、レイヤーのみで管理しているとスライスを重ねるしかなく、必要な画像をスライスする時に他のスライスを非表示にして背景レイヤーを消して…などと非常に面倒です。 ここでページ機能が威力を発揮します。 デザインができたら、ページを複製します。複

    Fireworks の “ページ機能” でスライスなどの作業効率が 3.5 倍アップ! (フェンリル | デベロッパーズブログ)
  • Fireworksの微妙な色の調節に、「ブレンダー」が便利です。 | バニデザノート

    Fireworksで、微妙な色の調整をするときに 毎回パレットをぐりぐりするのが面倒で、なにかいい方法はないかと調べたら 「ブレンダー」というパネルがあるようです。 今回はこの「ブレンダー」を紹介いたします。 Fireworksでは、ツールの色ボタンを選択するとwebカラーのパレットが開いて そこからもう少しくわしい「カラー」パネルにすすむことができます。 だいたいはwebカラーのパレットであたりをつけたあと、 この「カラー」パネルの横のバーで 明度を上げ下げすれば「すこしあかるく」「すこし暗く」みたいな 色調整が可能なのですが オレンジ系統の色など、中間色に関しては、 上記のように明度を上げられず、「もっと明るく」ができない場合があります。 こういった場合は直接真ん中の丸いグラデーションのポインタを 黄色側か、白側に動かすのですが、なかなかうまく色がでない。 赤によりすぎたり、黄色になり

    Fireworksの微妙な色の調節に、「ブレンダー」が便利です。 | バニデザノート
  • YUKI HARUYAMA Portfolio Site | 春山 有由希

    デザイナー 春山 有由希のポートフォリオサイトです。

    YUKI HARUYAMA Portfolio Site | 春山 有由希
  • YUKI HARUYAMA Portfolio Site | 春山 有由希

    春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル(現ラクマ)のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE

    YUKI HARUYAMA Portfolio Site | 春山 有由希
  • Fireworksツールバーのショートカットのまとめ | バシャログ。

    帰省したら髪型が家族にものすごく不評だったminamiです。 もともとPhotoshop派だった僕もシーブレインではめっきりFireworksのお世話になっております。Fireworksは元々細かくキーボードショートカットを設定できるのですが、ツールバーのショートカットはデフォルトで割り当てられています。しかも一つのキーしか使いません。意外に使ったことがなかったので全部調べてみました。 ※調べたFireworksのバージョンはCS3です。 表にまとめてみた このようにツールバーにある機能は全てワンタッチで切り替えることができます。複数の機能が割り当てられている部分は、押すたびに機能が切り替わります。 意外と普段使っていなかったので、まとめてみて自分で目から鱗です。全て使いこなせたらかなり作業スピードは上がりそうですね。 まとめてみた結果 作業効率は小さいことの積み重ねで変わるので、使ってい

    Fireworksツールバーのショートカットのまとめ | バシャログ。
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    IDEA * IDEA
  • 【Fireworks】Fireworks の振る舞い 基本的なとこ | バシャログ。

    もう暑いのいいだろ、toyama です。最高気温 37℃ 越えている地域の皆さん、当にお疲れ様です。 普段 Fireworks で作業していると、たまに使う Photoshop や Illustrator のちょっとした動作の違いにストレスを感じます。 違うソフトだから仕方ないんですが、同じ会社から出てるなら揃えろよ!と思ってしまいます。 普段 違うソフトを使っていてちょっと Fireworks を使ってみようかな?と思っている方に、簡単な Fireworks の振る舞いをご紹介したいと思います。 とりあえずよく使う、矩形の拡大縮小についてまとめてみました。 この辺の動きをあらかじめ知っておけば、ストレスも少しは減るかも? 1.サイズ変更 矩形を選択して[修正]→[変形]→[数値を入力して変形]から[サイズ変更]を選択し、縦横比を固定して数値を入力してみます。 元のサイズに対して、中央か

    【Fireworks】Fireworks の振る舞い 基本的なとこ | バシャログ。
  • 【Fireworks】ボタン画像に使うテキストのいじり方 | バシャログ。

    夜中のセミがうるさい季節になりました、toyama です。 窓ガラスにカナブンが激突してくる音もうるさいです。一応、横浜市民です。 Fireworks でボタンを作ったりするときに使う、文字のいじり方を簡単にまとめました。 ボタンを書いて、テキストをおいて、これで完成!でも十分ですが、なんかテキストが読みにくいな、と思ったときにやってみると落ち着きます。 こんなボタンがあるとして 淡いブルーのボタンに、白い文字でテキストを配置する、よくあるボタンです。 ちょっと可視性が低いって言われるかなー、という感じなので、テキストに一手間加えます。 1. グロー テキストを選択して、プロパティパネルから[フィルタ]→[シャドウとグロー]→[グロー]を選択します。 ボタンの色よりちょっと濃い目の色を選んで、効果の数値を設定。あまりキツくかけすぎると素人っぽい感じになってしまうので、この辺の数値はプレビュ

    【Fireworks】ボタン画像に使うテキストのいじり方 | バシャログ。
  • 【Fireworks】圧縮率による JPEG で文字もきれいに書き出す | バシャログ。

    今週の木曜日はやはり早く寝て夜中に起き出すかないか!toyama です。金曜日は結構な割合で寝不足な人が多そうですね。 大きな写真イメージの上にキャッチコピーを書いてサイトの目立つところに表示、というデザインは割と多いパターンですが、画像の書き出し圧縮率は毎度悩ましいです。 写真の書き出しは jpg がセオリーですが、キャッチコピーの文字がひどく劣化してしまうことがあります。かといって gif で書き出すには色数が多くてディザでもちょっと辛いし重い! そんなときは Fireworks さんにおまかせです。さすが web 制作の申し子! 1. こんな感じの画像があるとします。 写真の上にテキストで文字が置かれています。 2. jpg で書き出してみます。普段はこんなに低画質で書き出すことはないですが、分かりやすく圧縮の品質を 50 にしてみます。 背景の画像はともかく、もう文字のまわりがグニ

    【Fireworks】圧縮率による JPEG で文字もきれいに書き出す | バシャログ。
  • beplay类似软件-beplay体育飞翔下载

    菜单

  • Fireworksでfaviconを作成

    Fireworksでfaviconを作成 CSS Nite in Omotesando, Vol.1 「Fireworksビギナーのための120分徹底トレーニング」でFireworksでは拡張機能を利用すればfavicon(ファビコン)を作成できると紹介されていたので早速試してみました。 拡張機能のダウンロードとインストール Favicon - Adobe Fireworks Extensionsより拡張機能(ExportAsFavicon-100.mxp)をダウンロードします。 mxpはAdobe Extension Managerで利用できる拡張子で実行することでAdobe製品に拡張機能をインストールすることができます。 実行後、Adobe Extension Managerが立ち上がり拡張機能インストールの免責が表示されますので承認してインストールを行います。 (注意:Windows

    Fireworksでfaviconを作成
  • DreamweaverでPhotoshopとFireworksと連携する! « ウープスデザインブログ (デザイナーまめこ)

    5.29日に行われたDreamweaverのお祭り、Dreamweaver Town Meeting in Tokyo にてタイトルの内容でお話させていただきました。7分という事で機能の紹介のみになってしまいましたが、どのようにすると便利なのか、さらにフォローしてみたいと思います。 ※動画の公開は一旦ストップさせていただきますです。 「Photoshop , Fireworks から直接コピペができるよ!」という機能 少し乱暴ですが。psdファイルは直接ドリに入れるとそれ以降自動更新機能が使えるようになります。 htmlモックの時 画面遷移や細かい動作を確認したい時はhtmlでモックを作り、画面遷移を見ておくのがベストです。その際にいちいち書き出しすることなくコピペでpsdから貼り付けられるのは時間の短縮に繋ります。 運用時 デザインfix後にpsdを書き出しパーツごとに切り抜いておく事が

  • RedLine Magazine : Fireworks コレ、5分で作ります。その2

    Fireworks コレ、5分で作ります。その2 ※このエントリはFireworks CS4を元に書いています。 前回はペンツールでパスを書いてなんやかんやしたんですが、今回はFireworksを始めたら一番最初にコレを覚えであろう長方形ツールをメインで使ってコレを5分くらいで仕上げる方法です。 デザイナさんも、デザイナさんじゃない方も、Fireworks をほとんど使った事ないわーという方にも、一度5分だけでも時間を使ってもらえたらなーという主旨も含めて書いてます。実際にやってみてもらって、「うはww Fireworks ってこんなに簡単な手順でよく見かけるこういうモノ作れたんだ」とか思ってもらえると嬉しいです。 今回の完成形 今回も前回同様、見出し画像の背景に使えそうな画像を作ります。 今回も素材集等、Fireworks の機能以外のものは使いません。 土台を用意 今回は2色のグラデー

  • Fireworks コレ、5分で作ります。その1 : RedLine Magazine

    Fireworks コレ、5分で作ります。その1 ※このエントリはFireworks CS4を元に書いています。 Fireworks の日語チュートリアル少ないなーという話を先日Twitterでしていたので、なんか作ってみます。あまり超大作のチュートリアルは手順を書く気力が途中でなくなりそうだったので、今日は5分くらいでコレ作る方法を書きます。 今回の完成形 見出しの背景画像によくありそうなこういう画像をパパっと作ります。 今回は素材集等、Fireworks の機能以外のものは使いません。 土台を用意 まずは一番下の土台を作ります。よくあるアクア風のやつにしますね。矩形で適当なサイズで長方形作って、塗りを線形のグラデーションに。4色決めてスライダーを調節。外側には1pxの線も加えます。 ここでのサンプルのサイズはW 470 * H 40 としました。 こういう見出し用の背景画像でよく左側

  • webサービスをデザインするのはFireworksがオススメ。 « ウープスデザインブログ (デザイナーまめこ)

    Fireworksは4の時から使っていますが、おバカなところを残しつつもさらにとってもステキになっていて、良さをもっと知ってもらいたいと思うアプリのNo.1です。まわりの人に聞くとそもそも使ってない人の方が多く、「こんな事ができるんですよー」と話しても「今度使ってみるー」などと流されてばかりで釈然としません。なんでだー! こんな時に便利! たくさんの見出し、ボタン、リンクを付与することもできるのでカンタンに画面遷移も見せることができます。ヘッダー、フッター、メインイメージをPhotoshopで制作した後、Fireworksで統合したものを開き最背面にロックして配置した上で文や操作画面をゴリゴリ作るイメージです。 例えばいくつもある見出しのデザインが変更になった時 Flashのようにシンボル機能があるので元のデザインを変更すれば一瞬で全ページに反映されたりします。これだけでもかなり使いたく

  • RedLine Magazine : Fireworks ちょいネタ集

    Fireworks ちょいネタ集 ※このエントリはFireworks CS4を元に書いています。 バージョン違いの場合は内容が異なるかもしれません。 大好きなFireworksの「地味だけどコレ知ってると効率いいよ!」という小ネタ集です。このネタが有名な話なのかそうでないのか分からないのですが、私自身最初知らなかったけど、気付いてからは効率上がったぜという話なので、もし知らないユーザーさんがいたら是非活用して欲しいなーと思って書いてます。 整列パネル 間隔に数値を入れて等間隔にする CS4ではスマートガイドがあるので、動かしたいオブジェクトを任意の位置へパパっと正確に移動させることができます。任意のオブジェクトを別のオブジェクトの上下左右のどこかに揃えたいなんて場合はそれで済ませる事も多いですが、等間隔に配置したい時は整列パネルの『間隔』使いますよね。 この『間隔』には2種類の間隔をとる方

  • Fireworks CS4を買ったのでチュートリアル資料まとめ - IDEA*IDEA ~ 百式管理人のライフハックブログ

    ドットインストール代表のライフハックブログ

    Fireworks CS4を買ったのでチュートリアル資料まとめ - IDEA*IDEA ~ 百式管理人のライフハックブログ
  • 【Fireworks】GIFで支給されたロゴを簡単に白抜きに加工する方法 | バシャログ。

    例えば Web サイトのリニューアル案件では「ロゴのデータはありません。現サイトで使っている gif 画像を使ってください」というケースがよくあります。 「ロゴを白抜きにしたデザインパターンを作りたいんだけど…」という場合には、ロゴをトレース→パス化して使い勝手の良い素材を用意するのがベストな方法ではありますが、トレースする時間が取れない時は以下の方法がお手軽でオススメです。 使用した画像加工ソフトは Fireworks です。 ↑支給された(というか Web サイトからコピーした)ロゴの例。透明化もされていないし、切り抜くのも面倒。 STEP 1 ロゴ画像をグレースケールで保存します。 STEP 2 グレースケール化したロゴ画像を背景の上に配置。 STEP 3 ロゴ画像を選択して「フィルタ」→「カラー調整」→「カラーの塗り」を設定。 カラーは何色でも良いですが、ブレンドモードは「反転」に

    【Fireworks】GIFで支給されたロゴを簡単に白抜きに加工する方法 | バシャログ。
  • RedLine Magazine : Fireworks トリミング画像を一括書出 CS4編

    Fireworks トリミング画像を一括書出 CS4編 バシャログ。さんのFireworksネタが大好きでいつも拝見して勉強させて頂いてます。先日こんなエントリがあったので、自分でも試してみました。サムネイル用等に複数の画像ファイルをFireworksでトリミングする際、効率よく楽にファイル書き出しする方法のお話。 【Fireworks】トリミングした画像をたくさん書き出したいときに思い出してください | バシャログ。 【Fireworks】トリミングした画像をたくさん書き出したいときに思い出してください2 | バシャログ。 バシャログ。さんではバージョンがCS3っぽいのですが、じぶんは今CS4を利用してるので、そのバージョンでのお話。 新規作成~カンバスサイズの設定~画像の読み込み 上記記事同様、複数の画像ファイルを一気に1つのFWページ内で編集するという前提で、まず「ファイル」>「新規