DesignWalkerのタネ » menu

macのDockデザインのまとめサイト『LeopardDocks.com』

admin — Wed, 07 Nov 2007 09:11:50 +0000

先日、発売されたmacの新しいOS Leopard欲しい。。

激しく欲しい。。

残念ながら、現在わたくしが持っているPowerBookG4ちゃんは約４年ほど前に購入した物で、スペック的にLeopardはキツいです。。

こちらのサイトでは、とってもきれいなDockのデザインがたくさんまとめられております。

詳細はこちらからどうぞ?。
『LeopardDocks.com』

これはきれい!水彩画風メニューを作るPhotoshopチュートリアル

admin — Fri, 26 Oct 2007 06:00:37 +0000

水彩絵の具でよごれたノートを切り取ったような加工がとってもきれいですね！

↑このようなメニューを作るPhotoshopチュートリアルがWebDesignerWallさんの『Design Watercolor Effect Menu』という記事で紹介されていました。

手書き風のメニューに、この微妙な汚れ感がたまりませんね。。。

Photoshopファイルもダウンロードできるのでご参考に。

詳細はこちらからどうぞ～。
『Design Watercolor Effect Menu』

Webデザインに欠かせないサンプルがいっぱい『StyleIgnite』

admin — Wed, 24 Oct 2007 04:53:04 +0000

CSSで書かれた、サイトのナビゲーションメニューのサンプルやら、CSSのレイアウト、アイコンなどなど。

とにかく、Webデザインに使える情報満載の『StyleIgnite』

特に、このサイトのStyles Galleryには、かなり沢山のサンプルが紹介されております。。

詳細はこちらからどうぞ～。
『StyleIgnite

ボタンを作るPhotoshopチュートリアルいっぱい

admin — Thu, 18 Oct 2007 05:22:32 +0000

Photoshopを使って、ボタンを作るチュートリアルがど～んと、まとめて39個。

いろいろなタイプのボタンが作れますね。

その中からいくつかピックアップしてご紹介。

1. BlogWatts: A Different Stlye of Web 2.0 Buttons

2. PSCloud: Create a Navigation Bar Like the Current Apple Site

3. PhotoshopStar: Carbon Fibre Navigation Button Tutorial

4. Boonage: Perfect Shine Photoshop Button Tutorial

39種類一通り、マスターすればボタン職人になれるかも！？

まだまだいっぱいボタンチュートリアルがあります。。

詳細はこちらからどうぞ～
『39 Photoshop Button Tutorials You Should Have in Your Arsenal』

JavaScriptで動くアコーディオンスクリプトいろいろ

admin — Thu, 18 Oct 2007 05:02:20 +0000

TUTORIAL BLOGさんの『10 Javascript Accordion Scripts』という記事で

JavaScriptで動くアコーディオンスクリプトを10個、まとめられておりました。

びよ～んびよ～んと動くメニューが簡単に作れますね。。

その中からいくつかピックアップしてご紹介。

1. Deziner Folio – Simple javascript Accordions

2. Moofx

3. Stickman Labs – Accordion v2.0

4. Artviper – Mootools menu

詳細はこちらから
『10 Javascript Accordion Scripts』

71種類のCSSメニュー

admin — Wed, 17 Oct 2007 07:16:50 +0000

ブログなどのデザインで必ず必要になるメニューのデザイン。

CSSで作られたメニューデザインのサンプルをまとめて71種類！

これだけあれば、お気に入りのメニューが見つかりそうですね。。

詳細はこちらからどうぞ～。
『71 CSS menus for free』

CSSのデザインアイデアいろいろ

admin — Tue, 02 Oct 2007 05:13:28 +0000

CSSを使って、角を丸くしたり。

CSSを使って、ドロップシャドウをつけたり。

CSSを使って、グラデーションつけたり。

CSSを使って、マウスオーバーメニューつくったり。

CSSを使って、引用部分のデザインしたり。

CSSを使って、グラフを描いたり。

いろいろあります。

詳細はこちらからどうぞ～
『Lose the Images: How to Get Rounded Corners, Gradients, Drop Shadows and More Using CSS』

CSSメニューのソースコードがダウンロードできる『CSS MENU MAKER』

admin — Wed, 19 Sep 2007 05:47:15 +0000

百式さんでもご紹介されている『CSS MENU MAKER』

横型、縦型のCSSで作られた綺麗なメニューをカスタマイズして、CSSとhtmlのソースコードを表示してくれます。

一覧の中から、お好きなデザインを選びます。ブログなどで使用する場合は、『Download Source Code』のリンクをクリックして、ファイルをダウンロード。

『Customize』のリンクをクリックすると、↓のようなページが表示されて、メニューの数を入力して『submit』リンクをクリックすると、メニューの表示、リンク先が入力できるようになります。

一通りのメニュー項目、リンク先を入力して『submit』リンクをクリックするとHTMLとCSS、画像ファイルがダウンロードできます。

お気に入りのメニューを見つけてお試しください～。

詳細はこちらから
『CSS MENU MAKER』

LavaLampみたいなメニューをjQueryを使って作るチュートリアル

admin — Wed, 19 Sep 2007 05:26:17 +0000

ひとむかし前に流行ったLavaLamp

このLava Lampみたいに、うにょ～ってランダムにっとまではいきませんが・・・

マウスがオーバーしたところのテキストの長さに応じて、背景のサークルが変形してくれるメニューを作るチュートリアルが公開されておりました。。

その名も『Lava Lamp Menu』です。

jQueryを使えば初心者の方でも比較的、簡単に実現できますね。

詳細はこちら
『LavaLamp for jQuery lovers!』