先日弾丸グアム社員旅行から無事に帰国してきたばかりの山田です。 2011年4月3日（日）に参加してきた関西のWEBクリエイターが結集した素晴らしいチャリティイベント「Untitled!!!!!!!!」で紹介されていたとっても作業効率化を図れそうな目からうろこのFireworksの機能拡張について書きたいと思います。 色々気になる拡張パネルの中で特に気になったものを以下にまとめてみました。 これを知ってると知らないとではずいぶん作業効率に差がでそうですね。 Placeholder 数値入りアタリ画像を作成できる拡張パネル Objfect グループ化したオブジェクトをグループしたまま中の１つを選択できる拡張パネル SequenceNumSlice スライスやオブジェクトをクリックするたびに連番をふる拡張パネル Guide Panel 画面サイズのガイドを自動的に作ってくれる拡張パネル Geom

Fireworksで使えるテクスチャファイル300種類を無料で配布しています。商用利用も可能です。ライセンス Fireworks texture galleryで配布してるテクスチャ画像（png形式）は、以下のルールを守ってダウンロードをしてください。 商用利用も問題ありません。Webサイトだけではなく、印刷物などに利用していただいても構いません。 Fireworksなどの画像加工ソフトで加工していただいても構いません。 著作権は放棄してません。許可なく素材として再配布することは禁止してます。 更新履歴 2009年5月21日 Fireworks texture galleryをリリースしました。 「水平線」「垂直線」「円」「斜線」「星」「和風」「チェック」「花」「ハート」「ダイヤモンド」「モザイク」「雪」からなる12のカテゴリ、300種類のテクスチャを公開しました。

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用のファイルで配布しているサイトを紹介します。 Webportio Graphical resource of Adobe Fireworks [ad#ad-2] 素材の利用にあたってはウェブサイト・ソフトウェアなど、個人でも商用でも無料で使用できます。また、利用の際にはバックリンクの必要もありません。 お願いとして、このサイトを何らかの形で広めてくれると嬉しい、とのことです。 素材はウェブデザインによく利用するエレメントも数多くあり、下記にいくつか紹介します。

CSS3 Flying Menu デモページ [ad#ad-2] CSS3 Flying Menuのデモ デモでは他にも、ふんわりと浮かびつつ、ハイライトされるものもあります。 デモページ CSS3 Flying Menuの実装 HTML:ふんわりと浮かぶタイプ 各アイテム（アイコンとテキスト）をリスト要素で実装します。 <ul id="fly-menu"> <li><a href="http://www.webstuffshare.com"><img src="images/heart.png" alt="webstuffshare">Webstuffshare Home</a></li> <li><a href="http://feeds.feedburner.com/webstuffsharecom"><img src="images/rss.png" alt="rss"> Subs

Twitter, Facebook, Google+1などのボタンの一括管理、各メディアを省スペースに配置するパネル、ソーシャルメディアを活用するWordPressのプラグインを紹介します。

商用利用も無料、Responsive Web Designに対応したWordPressのテーマファイルを紹介します。 ボタン、タブ、パネルなどのページでよく使用するエレメントをはじめ、さまざまなカラムも簡単にショートコードで利用できます。 デモページを幅600pxで表示 Skeletonの主な特徴 Formalizeを使用して各ブラウザ間のエレメントの相違に対応。 Skeletonを使用してMedia Queriesを使った可変カラムに対応。 Option Frameworkを使用してテーマオプションのカスタマイズが可能。 bbPressのフォーラムスキンをインクルード。 見出しや本文などバランスの取れたタイポグラフィ。 デモ：Typography and Elements スマートフォン用のマルチレベルのメニューをサポート。 テーマオプションパネルからフォントや背景画像を設定可能。 タブ

ミニサイズのピクセルフォントがダウンロードできるサイトを紹介します。 Fonts | p.yusukekamiyamane 個人・商用無料利用可。 Free Fonts by Cal Henderso

Webデザインは、紙の上のデザインと違うところも多いと思います。でも同じデザインですから、歴史ある DTP デザインから学ぶことはいっぱいあります。デザインの基礎の基礎、レイアウトについて、デザインするときに気をつけたい基礎の部分の注意書きです。 毎日インターネットを見ていると、素敵なデザインの Webサイトに出会います。ときにはひと目惚れしちゃうようなこともあります。そんなデザインにあったとき、どうして素敵なのかなーと考えるのも勉強のうち。そう思って素敵なデザインはストックしておいて、自分なりにそのデザインが素敵な理由を考えてたりします。 デザインの理由 どうしてそういうデザインをしたのか … デザインには理由があります。気まぐれに色を選んだり、要素を配置したりしないからです。なので自分のデザインの理由、どうしてそういう風にしたのかということを、口で説明できないとダメだと言われます。もち

私が仕事で Web制作をする時に、よく利用させてもらっている jQuery のプラグインをまとめてみました。ライセンスは MIT、GPL のものばかりです。デザイン、レイアウト的に汎用性のあるものになっています。また、IE 特有のバグ（透過PNGの黒ずみなど）対策についても少し触れてみました。 Webサイトを作る時に、何かとお世話になっている jQuery のプラグイン。HTML と CSS だけでは表現できないことも、Javascript を使うことでいろいろできるようになりますよね！インターネットを見ていると、本当にたくさんの jQuery のプラグインが公開されています。feed を読んでいても、1日一個くらいは新しい jQuery のプラグインに出会います。どれを使ったらいいか迷うくらい … 。 今回は、そんな数ある jQuery のプラグインの中から、 私がクライアントワーク（仕

[HTML5] VideoJS – HTML5ベースの動画プレーヤー Pocket Tweet HTML5ベースの動画プレーヤー。Youtubeなど特定のウェブサービスを利用せず、サイト内に動画ファイルを格納したい時に使えそうです。モダンブラウザは全てサポート対象となっており、IE6〜8についても限定的ながらサポートされているようです。デバイスについてはiOSとAndroidが対象となっており、PCとスマートフォン双方の環境でだいたい見れるって感じです。サポートされているビデオフォーマットもh.264、Ogg、web-mと代表的なものは抑えられています。またWordpressプラグインやjQueryプラグインの形でも配布されている点がなかなかナイスです。その上オープンソースなので、今後お世話になりそうな感じ。 VideoJS

[CSS3] Tabs with Round Out Borders – 角と付け根を丸くしたタブ表現 Pocket Tweet CSS3の角丸指定を使って、角と付け根を丸くしたタブ表現。どうやって画像を使わずにコードだけで描画するかが説明されてます。角のところはいいとして、付け根を丸くする流れがなかなか興味深い。ソースコードも公開されているので導入も簡単そうです。こうしたTips記事なかなか読んでて楽しいです。 Tabs with Round Out Borders

About our web design school Our Web Design School was created in 2015 to help people learn new professions and companies find competent specialists. The school program is aimed at studying modern web design technologies. About the profession A web designer is someone who designs the user interfaces of applications, web services, and websites. User interfaces are all the things you see on your comp

[Web Design] 45+ Free Online Tools To Create Charts, Diagrams And Flowcharts – チャートやグラフを描画するためのオンラインツール Pocket Tweet チャートやグラフなどを描画するためのオンラインツールまとめ。45ものツールが紹介されてます。記事の内容は主にチャート制作とグラフ描画に分かれていて（見せ方としては分かれてませんが）、チャートではサイトの遷移図を書くのに便利そうなツールが、グラフでは一般的な棒グラフや折れ線グラフを描画するためのツールが紹介されてます。こういうの手で描くのメンドいっすからね。サクっと便利なオンラインツールとかオヌヌメです。 45+ Free Online Tools To Create Charts, Diagrams And Flowcharts