2009年12月8日のブックマーク (6件)

  • ページサイドにアニメーションするMac OS X 風のドック風ナビゲーション作成チュートリアル&サンプル:phpspot開発日誌

    ページサイドにアニメーションするMac OS X 風のドック風ナビゲーション作成チュートリアル&サンプル 2009年12月08日- ページサイドにアニメーションするMac OS X 風のドック風ナビゲーション作成チュートリアル&サンプルが公開されていてソースコードのダウンロードも可能です。 次のようなUIがサイドバーに現れてカーソルを合わせるとニュイっとアニメーションで現れます。ナビゲーションの表示を最小限に抑えたい場合などに使えそうですね。 デザインはCSSで行われているため、もっと自分のサイトにあった形にカスタマイズすることも出来そうです。 以下のエントリを参照してください。 Beautiful Slide Out Navigation: A CSS and jQuery Tutorial | Codrops 関連エントリ ナビゲーションのUIはこれで完璧かもなjQueryプラグイン集

  • この映画のUIをデザインした人の名前と登場作品名を当ててください

    ひとつ、なぞなぞ。 『ボーン・アイデンティティー』と『ミッションインポッシブル 3』と『Mr.&Mrs.スミス』と『トゥモロー・ワールド』と『Agent Cody Banks 2』に共通するものと言えば、型破りで未来的で100%デタラメなソフトのUI。ではその全デザインに参画した人物の名前は? え? 素人にわかるわけない? まあね、ははは。 こたえは、マーク・コールラン(Mark Coleran)さん。TV・映画の劇中に出てくる偽UIを専門に手掛けるビジュアル・デザイナーさんです。業界の方はもちろん正解できましたよね、ふふふ。 架空のスパコンを操作する偽物のダッシュボード。 全世界監視システムのホバリング制御パネル。 こういったものを想像力逞しくデザインする作業は、実用のUIをつくるのとは別物で、それらしく見えさえすればそれでオッケーなんですよね。マシンが無茶苦茶パワフルで、悪者がいかにも

    この映画のUIをデザインした人の名前と登場作品名を当ててください
  • プロユースに耐えれる、高品質なフリーフォントを集めた「50 High-Quality Free Fonts for Professional Design」

    プロユースに耐えれる、高品質なフリーフォントを集めた「50 High-Quality Free Fonts for Professional Design」 デザインの重要な要素の一つであるフォント。同じ意味の言葉でも、そのカタチから受ける印象と言うのは非常に強く、それ故にデザインをする上で、フォント選びは非常に重要となります。今日紹介するのはプロユースに耐えれる、高品質なフリーフォントを集めたエントリー「50 High-Quality Free Fonts for Professional Design」です。 League Gothic キレイ目な書体から、インパクトがあるものもあで幅広く収録されています。今日はその中から気になったものをピックアップして紹介致します。 詳しくは以下 ■Calluna Regular 細身ながらも、少し遊びのある書体。 ■Birra Stout 見出し等

    プロユースに耐えれる、高品質なフリーフォントを集めた「50 High-Quality Free Fonts for Professional Design」
  • いつもと違うよりリアルなドロップダウンシャドウを描画するPhotoshopチュートリアル:phpspot開発日誌

    いつもと違うよりリアルなドロップダウンシャドウを描画するPhotoshopチュートリアル。 Photoshopのレイヤー効果などで描画した影は以下のように、これはこれでよいのですが、面が宙を浮いているようにみえます。 ということで、レイヤー効果をつけた後、レイヤーをラスタライズし、次のように円形選択ツールで4つの辺を削ってみると、すこし硬めの紙を平面に置いたようなよりリアルな感じを出すことができます。 これは微々たる違いではありますが、比較するとこっちのほうがリアルに感じますね。 実際に写真を当てはめてみた図が以下です。 以下のエントリを参照してください。 Better Drop Shadows in Photoshop | Design Reviver 関連エントリ プロレベルのPhotoshopチュートリアル集 ボタン作成のPhotoshopチュートリアル集 飛び出る立体グラフィックを

  • JavaScriptなしでCSSのみで実現するクールなドロップダウンのサンプル:phpspot開発日誌

    JavaScriptなしでCSSのみで実現するクールなドロップダウンのサンプルが公開されています。 次のように、明らかにJavaScript 使ってるんじゃないか?と思うのですが、CSSのみでelement:hoverを使って実現されています。 ソースコードも解説されているのでこのテクニックについて覚えておいてもよさそう。 以下のエントリを参照してください。 Incredible Drop Down Menu Solution With CSS Only | AEXT.NET 関連エントリ jQueryで幅の大きなドロップダウンメニュー作成チュートリアル セクシーなドロップダウンメニュー実装サンプル

    wanchi21
    wanchi21 2009/12/08
  • 商用/個人、利用ライセンス別で探せるアイコン収集サイト「IconFever」

    様々な用とで使えるアイコン。非常に便利なものですが、クオリティの高いものを制作しようと思うと、それなりに時間と手間がかかります。今日紹介するのはクオリティの高いアイコンセットを幅広く収録したアイコン収集サイト「IconFever」です。 こうしたフリーアイコンは非常に利用しやすいのですが、個別にライセンスが定められており、その規約内で利用しなければいけません。「IconFever」の良い所は、一つ一つにキチンとライセンスに着いて明記されており、ライセンス別でまとめて表示できるようになっています。今日は商用利用可能なアイコンセットの中からいくつかピックアップして紹介したいと思います。 詳しくは以下 ■WooFunction シンプルなアイコンセット汎用性が高そうです。Commercial Use, GNU General Public License ■Quartz Icon Set 可愛ら

    商用/個人、利用ライセンス別で探せるアイコン収集サイト「IconFever」