Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

[ICON] 50+ Top Free Icon Resources and Icon Sets for Web Designers – ウェブデザイナーのためのアイコンセットまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

ウェブの素材として使いやすいアイコンセットが50個紹介されてます。なかなかの数ですね。またページ下部ではアイコン配布サイトもまとめられていて、こっちも便利。Iconfinderあたりは、すでに説明不要のアイコン素材収集サイトですね。ちょっとしたボタン装飾などに使いやすいので、この手の素材は重宝してます。

[WEB DESIGN] Drop-Down Menu: 30+ Useful Scripts To Enhance Header Navigation – ドロップダウンメニューの色々

  • Pocket
  • このエントリーをはてなブックマークに追加

規模の大きいサイトでよく見るドロップダウンメニュー。メインメニューの下にサブメニューがぶら下がるタイプのサイトでは、ナビゲーションとして有効な手段です。この記事ではいろんなサイトのドロップダウンメニューを紹介して、中にはリンク先でソース配布しているものもあります。それぞれCSSのみ、jQueryを使ったもの、mootoolsを使ったものをはじめ、Prototypeなどその他のJSライブラリを使ったものなども紹介されてます。一言にドロップダウンメニューとは言っても、その動きやデザインによって使用感は随分変わるので、サイトに合った手法を探す時にナイスな記事。

[CSS 3] Push Your Web Design Into The Future With CSS3 – CSS 3でできること

  • Pocket
  • このエントリーをはてなブックマークに追加

CSS 3でできるようになる、新しい表現についてまとめた記事。この手の話題に敏感な人ならすでにご存じかとは思いますが、まぁおさらいという事で。角丸DIVの描画、ボーダー部にイメージを適用、DIVボックスやテキストへのドロップシャドウ、RGBにアルファ(A)を足した表現、カスタムフォントの適用などの方法とTipsが紹介されてます。CSS3で表現の幅が広がるのは嬉しい事なんだけど、いつになったら安心して常用できるようになるんでしょうね。きっとまたIEが足を引っ張るんだろうけど。

[JAVASCRIPT] jQuery pageSlide – jQueryを使ったページスライド

  • Pocket
  • このエントリーをはてなブックマークに追加

jQueryを使ったページスライド。いわゆるページ内の任意のDIVのコンテンツをスライドさせる表現ではなく、ページの外から別のDIVがニュっと出てくるもの。初期状態では非表示で、画面外からインタラプトしてくるという意味では、Lightboxのような使い方に近いかもしれません。ログインパネルやコメント欄としてもイイですね。ページ下部の“Click for a pageSlide demo.”をクリックする事でデモを見れます。JSを使ったちょっと変わった表現をしたい時にナイス。

[DESIGN] 75+ Excellent Collection of Tutorials, Inspirations And Resources For Designers To Discover The Best Of The Web In July – 7月アツかったデザインリソース

  • Pocket
  • このエントリーをはてなブックマークに追加

7月にアツかったデザインリソースをまとめた記事。Smashing Appsの毎月やってる月次まとめ記事ですが、結構好きなんですこれ。いつものように特にカテゴリ分けするでもなく、ただアツかったものを雑多に並べただけの紹介記事です。ウェブ、印刷、アートワーク、名刺、JS、テクスチャ、アイコンといった感じに色々紹介されてます。ダラダラと見る分にはちょうどイイ感じにネタ収集ができますね。

[PHOTOSHOP] 40 Really Useful Photoshop Text Effect Tutorials – フォトショップで行うテキストエフェクトのチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

フォトショップで行うテキストエフェクトのチュートリアルがまとめられてます。フォトショップに触れて、わりと最初の方の段階で「おぉっ」ってなるの言うたらこれですよね。最近じゃレイヤースタイルなんていう便利なツールもあるので、スタイルのコピペも簡単になりました。各チュートリアルではPSDファイルの配布がされている事も多いので、他のデザイナーの作例を見て色々勉強できるかと思います。

[VECTOR] 24 useful free vectors – フリーのベクター素材まとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

フリーで配布されているベクターデータの画像素材まとめ記事。動物や人のシルエット、ガジェット、テクスチャ、アイコン、アートワーク、白地図などがあります。地図のベクターデータは、地味だけどわりと実用的だったりするので、デザイナーの人なら自前の素材フォルダ内に持っておいて損はありませんね。

[PHOTOSHOP] How to Sync Photoshop Presets on Multiple Computers – 複数のマシンでフォトショップの設定を共有する方法

  • Pocket
  • このエントリーをはてなブックマークに追加

複数のマシンの間で、いかにフォトショップの設定を共有させるか。これは家でも職場でもフォトショを使う人にとってなかなか頭の痛い話であります。自分の場合は2台のマシンの内どちらがマスターであるかをまず最初に決めて、設定ファイル(Applications/Adobe Photoshop CSX/Presets)をたまに手動でスレイブ側に上書きするという手法をとってます。けどこのTipsはなかなかアツい。プリセットフォルダのエイリアスを作って、それをMobileMeを使って共有させてます。なるほどその手があったか! ウェブストレージであれば、別にMobileMeである必要はないと思うので、他のストレージサービスにも応用できると思います。他のアプリでも設定ファイルの位置さえ分かればイケそうですね。よーし早速やってみよう。