初めてPhotoshopでWeb制作する前にやっておくといい設定8(CS6/CC含む) | Design Color
はじめに 先日ちょうどAdobe Creative Cloudを申し込みました。 Photoshopをまっさらな環境にする必要があるため、今回はまさに新品状態のCS6/CCの画面で解説をします！ もくじ 定規などの単位はpxで統一 「自動選択」で図形からレイヤーを選択する 「バウンティングボックス」を表示して選択や変形をしやすくする 「ピクセルにスナップ（エッジを整列）」で端がぼやけるのを解消 レイヤーコピー時に「〜のコピー」とつけないようにする スライス書き出し時に「images」フォルダを作成しないようにする 【CS6/CCの場合】カラーテーマをグレーにする 【CS6/CCの場合】切り抜きツールを「クラシックモード」にする 起動画面。か、かっこいい…！ CS6/CCはUIが黒いのですね。ちょっと慣れない。 従来のグレーにする方法も後ほどお伝えしますので、どうぞおつきあいください！ 1.
【Fireworks】トリミングした画像をたくさん書き出したいときに思い出してください | バシャログ。
こんにちは、シーブレインの toyama です。梅雨入りです。 サムネイル用の画像など、一定の大きさにそろえた画像を大量に書き出さないといけないときが、長い人生に一度や二度はあると思います。 私にも以前そんな瞬間があったのですが、その頃にこの技知ってればー！という技を今更知ったのでここに記しておくことにします。 1.書き出したいサムネイルのサイズにキャンバスサイズを設定します。 2.サムネイル化したい画像をざくざく読み込んで、適当に（いい意味で）画像を配置します。 3.「コマンド」→「ドキュメント」→「レイヤーに配分」。すると、適当に読み込んだ画像が一枚づつレイヤーに格納されます。 4.画像を書き出すための「最適化」を設定したあと、「書き出し」ます。 5.書き出しのダイヤログが出てきます。「書き出し」のプルダウンメニューから「レイヤーをファイルに変換」を選択します。3.で画像をレイヤーに分
【Fireworks】ちぎった紙っぽいパーツをサクッと作る | バシャログ。
Adobe の Creative Suite 5.5 が発表になりましたね。 Dreamweaver の進化っぷりが凄まじいですが、影に隠れて Fireworks も実は 5.1 にマイナーバージョンアップしています。 参考：Fireworks CS5.1 in Creative Suite CS5.5 バグ FIX がメイン（それだけでも有難い！）ですが、書き出し時の色の最適化が改善されていたり、ファイル保存時に最後に保存した場所がデフォルトで開くようになっていたりするようです！ 嬉しい…！ 今回は、Fireworks でちぎった紙っぽいパーツを簡単に作る方法をご紹介します。 Step1 とりあえず、カンバスに背景を敷きます。（サンプルは Fireworks の塗りの「パターン」にある「青い布」をそのまんま） Step2 白い矩形を置きます。 Step3 ストローク（破線ダブル、外側、1
RedLine Magazine : Fireworks 拡張アレコレ追加メモ
Fireworks 拡張アレコレ追加メモ Fireworks用にいろんなサイトで配布されているスタイルやパターンなどなど、いろんな素敵なものを追加するためのメモです。自分で作ったものを登録しておく方法の説明は今回は省略してます。 各素材等はmxp形式で配布されているものも多いので、その場合はExtension Managerでインストールしてください。下記はそうでない場合についてのお話です。 また、私の使用しているバージョンはCS4(Win用)なので、それに基づいてのメモとなります。バージョンやOS違いの場合は自分の環境に置き換えて確認してください。 スタイルを追加する スタイルパネルのオプションメニューで「スタイルライブラリを読み込み」を選択、スタイルライブラリの名前と場所を選択します。 「スタイルを読み込む」と「スタイルライブラリを読み込み」の違いは、前者の場合は現在のドキュメントに対
【Fireworks 】地味に便利なリッチシンボルと共有ライブラリ | バシャログ。
サイトのプロトタイプをデザインするときに、ちょくちょく登場するのがフォームまわりのパーツたちです。ラジオボタン、チェックボックス、セレクトボックス、テキストボックスなどを配置して、初期値にはこんなテキストが入ってて、だけどこっちの初期値はこうで、幅は広めに、だけどこっちは狭めに、とパターンが複数登場したりするとどんどん面倒に。 そこでリッチシンボル化ですよ。 リッチシンボルとは、簡単に言うと、プロパティを編集できるシンボル機能です。 ここではセレクトボックスを例に説明してみます。 1.まずはシンボル化 シンボル化については以前記事を書かせていただいているのでそちらも参考にしていただきつつ、セレクトボックスをシンボル化します。 Fireworks CS3 のシンボル新機能に「9 スライス」というのがあります。9 スライスガイドをこんな感じに設定します。シンボル化できたら、崩れず拡大縮小ができ
YUKI HARUYAMA Portfolio Site | 春山 有由希
春山 有由希 / ハルヤマ ユウキ UX / UI Design HTML / CSS Graphic Design Photography Designer & Front-end developer 福岡でプログラマとして就職後、Web制作会社に転職し、デザイナーになりました。 ECサイト、テレビ局や番組サイトのデザイン、執筆や講師業などで経験を積んだのち上京し、株式会社Fablicで フリマアプリ フリル（現ラクマ）のUI/UXデザインを担当。 その後、楽天株式会社でデザインチームマネージャを担当したのち、 フリーランスのデザイナーを経て、現在は株式会社スマートバンクでデザイナーをしています。 MORE PROFILE
RedLine Magazine : Fireworks コレ、5分で作ります。その２
Fireworks コレ、5分で作ります。その２ ※このエントリはFireworks CS4を元に書いています。 前回はペンツールでパスを書いてなんやかんやしたんですが、今回はFireworksを始めたら一番最初にコレを覚えであろう長方形ツールをメインで使ってコレを５分くらいで仕上げる方法です。 デザイナさんも、デザイナさんじゃない方も、Fireworks をほとんど使った事ないわーという方にも、一度5分だけでも時間を使ってもらえたらなーという主旨も含めて書いてます。実際にやってみてもらって、「うはｗｗ Fireworks ってこんなに簡単な手順でよく見かけるこういうモノ作れたんだ」とか思ってもらえると嬉しいです。 今回の完成形 今回も前回同様、見出し画像の背景に使えそうな画像を作ります。 今回も素材集等、Fireworks の機能以外のものは使いません。 土台を用意 今回は２色のグラデー
【Fireworks】GIFで支給されたロゴを簡単に白抜きに加工する方法 | バシャログ。
例えば Web サイトのリニューアル案件では「ロゴのデータはありません。現サイトで使っている gif 画像を使ってください」というケースがよくあります。 「ロゴを白抜きにしたデザインパターンを作りたいんだけど…」という場合には、ロゴをトレース→パス化して使い勝手の良い素材を用意するのがベストな方法ではありますが、トレースする時間が取れない時は以下の方法がお手軽でオススメです。 使用した画像加工ソフトは Fireworks です。 ↑支給された（というか Web サイトからコピーした）ロゴの例。透明化もされていないし、切り抜くのも面倒。 STEP 1 ロゴ画像をグレースケールで保存します。 STEP 2 グレースケール化したロゴ画像を背景の上に配置。 STEP 3 ロゴ画像を選択して「フィルタ」→「カラー調整」→「カラーの塗り」を設定。 カラーは何色でも良いですが、ブレンドモードは「反転」に
RedLine Magazine : Photoshop用ブラシをFireworksで。
Photoshop用ブラシをFireworksで。 いろんなサイトでPhotoshopの素敵なフリーのブラシ素材が配付されてて、そんな配付サイトの紹介エントリを目撃するたびに「これFireworksでそのまま使えたらいいのになぁ」なんて思います。まぁそのままブラシとしてFireworks上で使うことはできないのですが、Photoshopの素敵ブラシを使用する機会は多いのでFireworks使いの自分がどう付き合ってるのかっていうエントリです。 とりあえず前提として、Fireworks上でそのままブラシとして使うことはできない（多分）ということで、感覚的にはスタンプ画像みたいな感じで使ってます。とにもかくにも、まずはどうにかして使いたいブラシをFireworks上に移植にする事からですよね。Fireworks用にスタンプ画像的なものを用意するいくつかの方法から。 Photoshopからそのま
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
