Macのスクリーンショットを撮るためにソフトをお試しで使っては乗り換えて、使っては乗り換えてを繰り返していましたが、ここ2年ぐらいはCleanShotに落ち着きました。 「スクリーンショットを撮る」という基本的な機能はMacの標準のスクリーンショット.app...
こんにちは、イメージ担当の長谷川です。 「品質を上げれば速度が落ちるし、速度を上げれば品質が…」 デザイナーにとってはこの品質と速度が非常に悩ましいですよね。 今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。 1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」 Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。 【使い方】 インストールするとコマンドに「Smart Resize」が追加されます。 サイズ調整をしたいデザインを選択して コマンド> Smart Resize > Attach を選択します。 後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的
Adobe Fireworks は、Webをデザインするときには無くてはならない重要なソフトウェア。 でも、壊れやすいw すぐに内部エラーとか出る! で、調べたら、直す方法が載ってた。 Windows版ならば、すぐに直るから試す価値ありです。 修正方法 Fireworksは終了しておきます。 Windowsでは 「Documents and Settings¥<ユーザー名>¥Application Data¥Adobe¥<Fireworks バージョン番号>」 のフォルダごと削除 Fireworksを再起動! ※もし、コマンドを作成しているときは、CommandPanels、Commands、Common Library などを待避して、再起動後、また作成された同名フォルダに上書きで直ると思います。直らないときは、それが原因です(爆) 内部エラーのせいで、せっかく買ったのにCS5が使えな
みなさんこんにちは、カッシーです。 先日6月8日に26歳になりました。充実した26歳にできるよう頑張っていきます! 今回は手軽に実践できる効率アップTIPSをご紹介したいと思います。 WEB業界のデファクトスタンダードっていうよりは僕が実践しているものがメインです。 こういう効率アップTIPSとかは共有してどんどん仕事の効率を上げれば ・コストダウン(人件費) ・定時に上がってアフターを楽しむ ・費用は下がるし仕事は早くできるしモチベーションは上がるはいいこといっぱい! なんでどんどん情報をシェアしたいですね! もしこんなのものあるよーって方はコメントなりtwitterなりメッセージ頂けると嬉しいです。 目次 ・WEBサイトの新規作成キットを利用する ・拡張機能を利用する ・コード共有・アセット ・よく使う単語は辞書に登録 ・素材や過去のデータは整理しておく ・効率の高いファイルの送受信
アイコン、ボタン、リボンをはじめ、フォーム、スライダー、ツールチップ、メニューなどウェブデザインでよく使用されるようなエレメントをFireworks用のファイルで配布しているサイトを紹介します。 Webportio Graphical resource of Adobe Fireworks [ad#ad-2] 素材の利用にあたってはウェブサイト・ソフトウェアなど、個人でも商用でも無料で使用できます。また、利用の際にはバックリンクの必要もありません。 お願いとして、このサイトを何らかの形で広めてくれると嬉しい、とのことです。 素材はウェブデザインによく利用するエレメントも数多くあり、下記にいくつか紹介します。
Fireworksで複数行のテキスト、複数のテキストオブジェクトのテキストを、1行にまとめてコピーするコマンドを書きましたので覚え書きしておきます。複数のテキストオブジェクトの内容を取得し結合する場合、背面のレイヤーから、前面のレイヤーに向かって結合されます。カーニングなどにより空白が生まれることはありません。 var altText = ""; for(i=fw.selection.length-1;i>=0;i--){ for(j=0;j<fw.selection[i].textRuns.textRuns.length;j++){ altText += fw.selection[i].textRuns.textRuns[j].characters; } } altText = altText.replace(/[\r\n|\n|\r]/g,""); prompt("you can co
本記事では、最近のWeb制作で利用されている「CSSスプライト(CSS Sprites)」という手法と、その実装を便利にしてくれるFireworksの拡張機能「CSS Sprite Extension」について解説します。 Fireworks CS5 体験版 今すぐ購入 CSSスプライト(CSS Sprites)とは CSSスプライトは、複数の画像を1つにまとめてCSSのスタイルで部分的に表示し使い回す手法です。 CSSスプライトの仕組み CSSスプライトはたいてい、今まで独立した1枚画像にしていた部分や画像置換※で表示していた画像と置き換えることができます。 ※ 画像置換:HTMLにテキストだけを記載しておいて、CSSのスタイルで文字を隠し、その代わりに画像を表示しているように見せる手法。画像をHTMLからimg要素で呼び出している時とは違い、CSSでデザインを変更したときに一緒に見
Fireworks ちょいネタ集 ※このエントリはFireworks CS4を元に書いています。 バージョン違いの場合は内容が異なるかもしれません。 大好きなFireworksの「地味だけどコレ知ってると効率いいよ!」という小ネタ集です。このネタが有名な話なのかそうでないのか分からないのですが、私自身最初知らなかったけど、気付いてからは効率上がったぜという話なので、もし知らないユーザーさんがいたら是非活用して欲しいなーと思って書いてます。 整列パネル 間隔に数値を入れて等間隔にする CS4ではスマートガイドがあるので、動かしたいオブジェクトを任意の位置へパパっと正確に移動させることができます。任意のオブジェクトを別のオブジェクトの上下左右のどこかに揃えたいなんて場合はそれで済ませる事も多いですが、等間隔に配置したい時は整列パネルの『間隔』使いますよね。 この『間隔』には2種類の間隔をとる方
以前のエントリーで、Fireworks CS3でのPhotoshopフィルターのバグについて書きましたが、 Photoshopフィルターを駆逐するツールをつくったので、紹介します。 以前のエントリー:Fireworks CS3でPSDファイルを開くときの注意 Photoshopフィルターを駆逐します Fireworksの拡張パネルになります。 PSDを開いたときにできる、「Photoshopライブエフェクト」を、いくつかの方法で駆逐し、クリーンなPNGデータにすることができます。 ■ダウンロード MXPファイルになってますので、ダウンロード後、「PS_FilterManager.mxp」をクリックすれば、 EXTENSION MANAGERが起動し、インストールできます。 設置した後は Fireworksを再起動すれば、[ウィンドウ]メニューに、[pxiel_lab] > [Photosh
Fireworksで使える素材を探している。 そんなあなたにおすすめなのが、『An Explosion of Adobe Fireworks Resources』。Fireworksの素材集決定版です。 ライブラリやパターンやシンボル、スタイルやシェイプなど、かなりたくさんの素材が揃っていますね。 かっこよくて使えそうなのをいくつかご紹介します。 Arrows 矢印がいろいろ入っているライブラリ Kaliber Patterns 種類がたくさんあるパターンファイル iPhone GUI as Rich Symbols for Fireworks iPhone用のGUIシンボル 150 Fireworks Styles (Gradient Effects) グラデーションスタイル150 15 Grunge Colors Styles グランジ系のカラースタイル 131 Ultimate We
Fireworksで使えるテクスチャファイル300種類を無料で配布しています。商用利用も可能です。ライセンス Fireworks texture galleryで配布してるテクスチャ画像(png形式)は、以下のルールを守ってダウンロードをしてください。 商用利用も問題ありません。Webサイトだけではなく、印刷物などに利用していただいても構いません。 Fireworksなどの画像加工ソフトで加工していただいても構いません。 著作権は放棄してません。許可なく素材として再配布することは禁止してます。 更新履歴 2009年5月21日 Fireworks texture galleryをリリースしました。 「水平線」「垂直線」「円」「斜線」「星」「和風」「チェック」「花」「ハート」「ダイヤモンド」「モザイク」「雪」からなる12のカテゴリ、300種類のテクスチャを公開しました。
Fireworks ショートカットコンボ(追記有) あまりにも放置気味なので何か更新しようかな、ということで、よく使うFireworksのショートカットコンボでも。 >>080912:パスパネルについて追記しました。 最前面のオブジェクトでマスクするショートカットコンボ 例えばこんなん。適当な背景の上にオブジェクトを乗せてマスクする時。 テキストにフチ線がついてるのは白背景だと分かりにくいからつけただけ。とりあえず重ねる。 いくよっ! 「Alt+M」→「M」→「G」 (「修正」→「マスク」→「マスクとしてグループ化」) さぁ!みんな声を出して覚えて! (n'∀')η<オルト エム エム ジー! 最前面のオブジェクトでマスクの小ネタ え?こんなの誰でも知ってるって? んじゃ・・・これを合わせて知ってると便利だよ! 最前面のオブジェクトでマスクする時はオブジェクトを半透明にして合わせる位置を確
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く