一定期間更新がないため広告を表示しています
![Fireworksの拡張まとめ(2012年8月版) | Webデザインのタネ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8deaaa39fcc985bb5fabfd532949e78b8f264a66/height=288;version=1;width=512/http%3A%2F%2Fimg-cdn.jg.jugem.jp%2F92c%2F73210%2F20120729_2724135.png)
Als interactie ontwerpers zijn we behoorlijk druk met het uitzoeken hoe we allerlei functionaliteiten en structuren moeten werken in apps. Dit doen we onder andere door draadmodellen van apps op te zetten en deze te beoordelen, te testen en steeds opnieuw aan te passen. We zetten deze wireframes dus liefst zo snel mogelijk in elkaar, zodat we genoeg tijd hebben om na te denken over hoe de puzzelst
Language Navigation Language Navigation
WEBを制作にあたり非常に便利な素材アイコン。使い勝手が良いアイコンは製作時間を大幅に短縮してくれますが、今日紹介するのはシンプルでスマートなベクターアイコンパック「Free Vector Web Icons (91 Icons)」です。 最近のクラウドだったり、マップピンなど比較的新しいサービスに対応したものから、スタンダードなものまで幅広く91ものアイコンがセットになっています。収録されているアイコンは以下のとおりです。 詳しくは以下 シンプルな表現で、WEBに必要そうなアイコンは網羅されており、非常に使い勝手がが良いアイコンセット。しかもありがたいことにベクターデータで配布されており、Fireworksやphotoshopなどの制作ソフトで利用できます。 ベクターデータで配布されていますので、デザインに合わせて加工やカスタマイズができるため、どんなデザインでも汎用的に使えるアイコン素
自己紹介 株式会社EC studio でHTMLコーダーやってます、赤堀巴絵です。 EC studio デザインブログでコーダー向けネタやパフォーマンスアップネタを投稿してます。 Twitterは「tomo_e」でやってるのでよかったらフォローよろしくお願いします! 最近は趣味でイラストを描いたりもしてます。 目次 FireworksとPhotoshopのPNG比較 png8アルファチャンネルでさらに軽量化! FireworksとPhotoshopのJPEG比較 JPEGマスクで見せたい部分をキレイに! まとめ FireworksとPhotoshopのPNG比較 実はPNGで同じ画像を書き出すならFireworksのほうが画像を軽く書き出せます。 チャンクという画像情報以外のその他の情報がPhotoshopのほうが多いからです。 実際、FireworksとPhotoshopのPNG8で書
キノコのガチャポン、数回ガチャったけど、ベニテングダケとサンコタケしか出ない… シイタケが欲しいのに! 今回は、前回に続き、Fireworks のリソースを公開している海外のサイトをピックアップしてご紹介します。 Fireworks Zone Fireworks のことならここだけ見ておけばオッケー、というほど Fireworks の情報が大量に集約されたサイトです。 チュートリアルもあるし、拡張機能もスタイルもライブラリもダウンロードできます。 Webdesign tuts+ Web デザイン系の話題を幅広く取り上げているサイトです。Fireworks の動画チュートリアルがあります。 Fireworks Lab Fireworks で制作されたデザインパーツが公開されています。ちょっと数は少なめかも。 ソースファイルをダウンロードすることができるので、勉強になります。 webporti
12月7日発売予定です^^ 先日twitterなどで発売日が決まったことを告知させていただいたのですが、 何名か予約したよ!なんて声をかけていただいて本当にうれしい限りです;; 結構いい内容に仕上がっていると思うのですが、 また発売日前でなにも詳細が公開されていない状態なので 「予約して買ったけど求めていた内容と違ったーー」 ということがあっては、 予約までして買っていただくのに本っ当に申し訳ないので…。 今日は、ちょっとその本の中身を紹介させてください! Fireworksによる画像パーツのデザイン Part2です。 FIreworksの基本動作が一通りマスターできるように考えました。 基本の操作説明ってなんか退屈な説明になりがちなので、 いろいろ実際に作りながら覚えられるようになっています。 これらのレシピをこなしていくと、 終わる頃には「あー大体こんな感じでパーツ作るんだなー」と わ
机の上が散らかっている人は、頭の中も散らかっている。— 佐藤可士和 談 机の上も絶賛散乱中、典型的ダメなデザイナーの宇都宮頼子です。 今回から始まった【ダメデザイナー救済!】は、基本ズボラな私が、いつかみんなに「こいつデキる・・・!」と言わせたい、そんな思いを胸にコツコツ溜まってきた小技をご紹介していくコーナーです。 twitterのタイムラインで流れてくる「ココとココの頭位置が微妙に違うのは意図的!?」「この端数は何だ??」などなど、コーダー&プログラマさん達の深夜のつぶやきは耳が痛い、耳が痛いよぅ。 今回はFireworksのシンボルをつかって、コーダー&プログラマさんもニッコリ間違いなしのステキな素材作りを学びましょう! ●汎用性の高いブロックを作る よく使うサイズのブロックを作ります。重ねても使えるので最低限でOK こんな感じで汎用性の高そうなサイズのシンボルを作っておきます。(※
こんにちは、イメージ担当の長谷川です。 今回は 1px にこだわったリッチな Web や UI デザインを更に立体的で奥行きのある雰囲気にする『MAX 塗り』を取り入れたグラフィック作成手法をご紹介します。 ところで『MAX 塗り』ってご存知ですか?ガンプラなどが好きな方はピンと来たと思いますが、プラモデルなどに興味がない人は全く分かりませんね。 『MAX 塗り』とはプラモデルに立体感を出すためにエッジから中央に向かってぼかしていく、昔からある「ぼかし塗り」や「グラデーション塗り」の技法です。 この技法で塗装されたプラモデルは単純に塗装したものより格段に迫力や存在感が上がります。プロモデラーの MAX 渡辺さんが良く使うプラモデルの塗装技術として通称『MAX 塗り』と呼ばれています。 Web や UI にこの『MAX 塗り』を取り入れる方法は簡単です。 作ったボタンや背景などのグラフィック
iPhone 4S遣いが身の回りに着々と増えてますが、うらやましくなんかないんだからねっhakoishiです。 今回は、「あれ、今回はデザイン?」と見せかけてやはりコーディングネタ。 スライスって、コーダーが担当することが多いですよね。 けど、デザイナーほどグラフィックソフトに通じてなくて「もっと効率いいやり方があるんじゃないかなあー」なんてもどかしく思うこと、あるんじゃないですか? そこで、突然ですがFireworks。 馴染みのない人も多いかもしれませんが、スライス機能がスッゴイんですよ! 以下、普段Photoshopを使用している人向けに、Fireworksの便利なスライス機能をまとめました。 最初に。 まずは基本動作。 Photoshop同様、スライスツールでドラッグします。 …でも良いのですが、もっと楽な方法があります。 スライスを切りたいオブジェクトを全て選択 ⇒右クリックで「
iPhone GUI Fireworks SymbolsはFireworks向けのiPhoneアプリ風UIのシンボル集。 iPhone GUI Fireworks SymbolsはFireworks用のオープンソース・ソフトウェア。iPhoneアプリはWebサイト以上にデザインが正否を左右する。どれだけ機能的に面白かろうと、デザインがいけてなかったら誰も使ってくれない。またボタンの配置やデザインで評価がはっきり分かれる傾向がある。 主なシンボル そのためデザインには十分に注意する必要がある。個人であればiPhoneモックアップアプリ等を使うが、デザイナーの人であれば使い慣れたツールでモックデザインを考えたいだろう。Fireworks派の人はiPhone GUI Fireworks Symbolsを使ってみよう。 iPhone GUI Fireworks SymbolsはFireworks
Fireworksで使えるテクスチャーを配布するサイトが増えてきましたね!私もよくデザインに活用させてもらってますが、水平線や斜線やグリッドなどが主でFireworksに元から入っている木目のようなの質感系テクスチャ(勝手に名づけ)のはなかなか配布されていなかったので自作してみました。 身の回りのものをスキャンしたり、photoshopのフィルターを利用して作成したものですが、よかったらご活用ください(^^) Fireworks「質感」テクスチャ15種 ご利用方法 ダウンロードしたいテクスチャ画像の上で右クリック名前をつけて画像を保存でダウンロードしてくださいFireworksテクスチャの利用方法や、質感テクスチャの活用方法については下記のサイトが参考になるかと思います。 fireworksでのテクスチャの使い方 | シンプルパターン研究所 ナチュラル系ブログデザインをFireworks
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く