auの新ブランド『iida』第一弾モデル『G9』
写真で解説する「G9」 (1/2) - ITmedia +D モバイル（別窓）
iidaの第一弾はソニー・エリクソンによるG9です。
デザインはA1403KとA5405SAで知られている岩崎一郎氏が担当。
ボディ外周にチタンフレームがあしらわれており、3色でそれぞれ質感が違うというのが特徴です。
キーは「スラントキー」と呼ばれる傾斜のかかった配置となっており、押しやすい仕様となっているようです。
ソニエリ端末おなじみのフォトビューアーを搭載しているようですが、どうやらタイムライン表示には対応していない模様。
発売は4月17日前後を予定されています。
写真と動画で見る、ケータイモバイルプロジェクター「Mobile pico projector」 - ITmedia +D モバイル（別窓）
また、G9を購入すると「Mobile pico projector」が安価で購入できます。
このプロジェクタは携帯に接続し、画面を最大63インチに拡大することができます。
バッテリーを内臓しており、約2時間ほど利用できるようです。
G9以外の対応機種に関しましては上の記事のほうをご覧ください。
iidaの第一弾はソニー・エリクソンによるG9です。
デザインはA1403KとA5405SAで知られている岩崎一郎氏が担当。
ボディ外周にチタンフレームがあしらわれており、3色でそれぞれ質感が違うというのが特徴です。
キーは「スラントキー」と呼ばれる傾斜のかかった配置となっており、押しやすい仕様となっているようです。
ソニエリ端末おなじみのフォトビューアーを搭載しているようですが、どうやらタイムライン表示には対応していない模様。
発売は4月17日前後を予定されています。
写真と動画で見る、ケータイモバイルプロジェクター「Mobile pico projector」 - ITmedia +D モバイル（別窓）
また、G9を購入すると「Mobile pico projector」が安価で購入できます。
このプロジェクタは携帯に接続し、画面を最大63インチに拡大することができます。
バッテリーを内臓しており、約2時間ほど利用できるようです。
G9以外の対応機種に関しましては上の記事のほうをご覧ください。
わずかな工夫でサイトデザインにアクセントを加える方法
Web Design Trends: Designing Out Of The Box - Freelance Web Design Belfast Northern Ireland - Lee Munroe（別窓）
ちょっとした工夫で見出しなどのボックスにアクセントを加える方法の紹介です。
上の画像で言えば、「FEATURED ARTIST」と書かれたボックスがこれにあたります。
まずはじめのステップとして、背景を透過した以下のような画像を用意します。
次に基準となるボックスに対してposition:relativeを指定します。
あとは上のロゴに対してposition:absoluteを指定し、外にはみ出させたい分、位置の指定をすれば完了です。
上の画像で言えばはみ出させたい部分のサイズが15pxなので、left:-15pxを指定します。
決して難しいテクニックではありませんので、自分のサイトがどこか物足りないと感じている方はぜひお試しください。
ちょっとした工夫で見出しなどのボックスにアクセントを加える方法の紹介です。
上の画像で言えば、「FEATURED ARTIST」と書かれたボックスがこれにあたります。
まずはじめのステップとして、背景を透過した以下のような画像を用意します。
次に基準となるボックスに対してposition:relativeを指定します。
あとは上のロゴに対してposition:absoluteを指定し、外にはみ出させたい分、位置の指定をすれば完了です。
上の画像で言えばはみ出させたい部分のサイズが15pxなので、left:-15pxを指定します。
決して難しいテクニックではありませんので、自分のサイトがどこか物足りないと感じている方はぜひお試しください。
効果的なカミングスーンページ25選
25 Examples of Cool Coming Soon Page Designs - Part II | Dzine Blog（別窓）
クールなComingSoonページが25個紹介されています。
その中からいくつか紹介。
FavMovie! Coming...（別窓）
こちらは非常にスタンダードです。
オープンの情報を配信するためにメールアドレスの入力が促されています。
DesignSvn - Subversion for Designers（別窓）
こちらはメールアドレスの入力に加えて、Twitterのフォローが促されています。
最近はこのようなサイト・企業が増えてきましたね。
Upstate Design Collective, A New Design "Club"（別窓）
最後はTwitterのログが表示されているものです。
活動が目に見えるのが嬉しいです。
サイト・企業とユーザーを繋げるものとして、Twitterがメジャーなツールになってきたように思います。
日本で言えばPixivやPiXAもTwitterを用いてユーザーとコミュニケーションをとっています。
Twitterの採用はコンテンツの質の向上に繋がると思うので、今後採用するサイト・企業が増えればいいなーと個人的に思っています。
あわせて以下の記事もどうぞ。
27 Cool Coming Soon Pages | Dzine Blog（別窓）
クールなComingSoonページが25個紹介されています。
その中からいくつか紹介。
FavMovie! Coming...（別窓）
こちらは非常にスタンダードです。
オープンの情報を配信するためにメールアドレスの入力が促されています。
DesignSvn - Subversion for Designers（別窓）
こちらはメールアドレスの入力に加えて、Twitterのフォローが促されています。
最近はこのようなサイト・企業が増えてきましたね。
Upstate Design Collective, A New Design "Club"（別窓）
最後はTwitterのログが表示されているものです。
活動が目に見えるのが嬉しいです。
サイト・企業とユーザーを繋げるものとして、Twitterがメジャーなツールになってきたように思います。
日本で言えばPixivやPiXAもTwitterを用いてユーザーとコミュニケーションをとっています。
Twitterの採用はコンテンツの質の向上に繋がると思うので、今後採用するサイト・企業が増えればいいなーと個人的に思っています。
あわせて以下の記事もどうぞ。
27 Cool Coming Soon Pages | Dzine Blog（別窓）
jQueryによるCSSスイッチャー
A Simple jQuery Stylesheet Switcher（別窓）
キャッシュ機能も備えたjQueryによるCSSスイッチャーです。
コードは非常にシンプル。まずはHTMLのコードです。
rel属性に読み込みたいCSSを指定します。
次にJSのコード。
あとはjqueryとjquery.cookieを読み込めば完了です。
複数のCSSを用意してユーザーに自由に切り替えてほしい方、文字サイズの変更を実装したい方など、簡単に実装できるのでためしに利用してみてはいかがでしょうか。
キャッシュ機能も備えたjQueryによるCSSスイッチャーです。
コードは非常にシンプル。まずはHTMLのコードです。
<ul id="nav">
<li><a href="#" rel="/path/to/style1.css">Default CSS</a></li>
<li><a href="#" rel="/path/to/style2.css">Larger Text</a></li>
<li><a href="#" rel="/path/to/style3.css">Something Different</a></li>
</ul>
rel属性に読み込みたいCSSを指定します。
次にJSのコード。
if($.cookie("css")) {
$("link").attr("href",$.cookie("css"));
}
$(document).ready(function() {
$("#nav li a").click(function() {
$("link").attr("href",$(this).attr('rel'));
$.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'});
return false;
});
});
あとはjqueryとjquery.cookieを読み込めば完了です。
複数のCSSを用意してユーザーに自由に切り替えてほしい方、文字サイズの変更を実装したい方など、簡単に実装できるのでためしに利用してみてはいかがでしょうか。
auのコンセプトモデルが発表！鍵盤がそのまま端末になったモデルも
鍵盤や弦もケータイに au「iida」コンセプトモデル - ITmedia News（別窓）
auが新デザインブランド「iida」（イーダ）と、そのコンセプトモデルを発表しました。
まずはau design projectから引き継がれた、ヤマハデザイン研究所による「ガッキ ト ケータイシリーズ」。
6種類のコンセプトモデルが発表されており、具体的には大胆に鍵盤をそのまま端末にしたもの、弦付きのものなどがあります。
iPhoneとは真逆のアプローチ：アナログのアプローチで感性に訴える――「ガッキ ト ケータイ」が目指す新たな世界 (1/2) - ITmedia +D モバイル（別窓）
次にソーラーパネル搭載モデル。
こちらも同じくau design projectから引き継がれたもので、デザイナー集団の「参/MINE」と坪井浩尚さんによるコンセプトモデルが発表されています。
CEATEC JAPAN 2008：ケータイを太陽にかざして見れば――auのソーラーパネル搭載コンセプトモデル - ITmedia +D モバイル（別窓）
次に「PLY」。
これは「カドケシ」のデザインで知られる神原秀夫さんによるコンセプトモデルです。
機能ごとのタブが魅力です。
au design projectのコンセプトモデル：ケータイが積み重ねた歴史を“層”で表現――「カドケシ」デザイナーが作った「PLY」とは - ITmedia +D モバイル（別窓）
このほかにもスタイリッシュな液晶シート、ユニークな充電コードなどが発表されています。
「iida」シリーズ：ケータイの充電器にも個性を――観葉植物のようなデザインの「AC Adapter MIDORI」 - ITmedia +D モバイル（別窓）
auはどこか迷走ともとれるような独自の路線をいってますね。
しかしPLYはなかなか期待できそう。
最近auの良い話を聞かないので、ぜひ頑張ってほしいところです。
auが新デザインブランド「iida」（イーダ）と、そのコンセプトモデルを発表しました。
まずはau design projectから引き継がれた、ヤマハデザイン研究所による「ガッキ ト ケータイシリーズ」。
6種類のコンセプトモデルが発表されており、具体的には大胆に鍵盤をそのまま端末にしたもの、弦付きのものなどがあります。
iPhoneとは真逆のアプローチ：アナログのアプローチで感性に訴える――「ガッキ ト ケータイ」が目指す新たな世界 (1/2) - ITmedia +D モバイル（別窓）
次にソーラーパネル搭載モデル。
こちらも同じくau design projectから引き継がれたもので、デザイナー集団の「参/MINE」と坪井浩尚さんによるコンセプトモデルが発表されています。
CEATEC JAPAN 2008：ケータイを太陽にかざして見れば――auのソーラーパネル搭載コンセプトモデル - ITmedia +D モバイル（別窓）
次に「PLY」。
これは「カドケシ」のデザインで知られる神原秀夫さんによるコンセプトモデルです。
機能ごとのタブが魅力です。
au design projectのコンセプトモデル：ケータイが積み重ねた歴史を“層”で表現――「カドケシ」デザイナーが作った「PLY」とは - ITmedia +D モバイル（別窓）
このほかにもスタイリッシュな液晶シート、ユニークな充電コードなどが発表されています。
「iida」シリーズ：ケータイの充電器にも個性を――観葉植物のようなデザインの「AC Adapter MIDORI」 - ITmedia +D モバイル（別窓）
auはどこか迷走ともとれるような独自の路線をいってますね。
しかしPLYはなかなか期待できそう。
最近auの良い話を聞かないので、ぜひ頑張ってほしいところです。
目的のアイコンを簡単に検索！『Iconfinder』
Iconfinder - Icon search made easy （別窓）
Iconfinderはあなたの欲しいアイコンが見つかるアイコン検索エンジンです。
結構前からあるサービスっぽいですが、自分は知らなかったのでついでに紹介。
こちらは「rss」で検索した結果。
アイコンのサイズでの絞り込み、背景色の変更などが可能です。
こちらは検索結果の各項目の右上にある「INFO」ボタンにカーソルを合わせた状態。
ライセンスがすぐに確認できて便利！
Iconfinderはあなたの欲しいアイコンが見つかるアイコン検索エンジンです。
結構前からあるサービスっぽいですが、自分は知らなかったのでついでに紹介。
こちらは「rss」で検索した結果。
アイコンのサイズでの絞り込み、背景色の変更などが可能です。
こちらは検索結果の各項目の右上にある「INFO」ボタンにカーソルを合わせた状態。
ライセンスがすぐに確認できて便利！
ｊQueryによるベストメニュー10選
10 Best jQuery Menu Plugins | AjaxLine （別窓）
メニューのためのjQueryプラグインが10個紹介されています。
その中からいくつか紹介。
jdsharp.us » jdMenu Hierarchical Menu Plugin for jQuery （別窓）
こちらは非常にシンプル。
リストをドロップダウンメニューにしてくれます。
Superfish - Suckerfish on 'roids （別窓）
こちらは縦表示や、バー形式の表示などが可能です。
jQuery iPod-style Drilldown Menu | Filament Group, Inc., Boston, MA （別窓）
最後はipod風。
パンくずリストの表示もあり、なかなかよさげ。
最後に紹介されてませんが、これまたipod風のメニューを紹介。
jQuery Menu: Dropdown, iPod Drilldown, and Flyout styles with ARIA Support and ThemeRoller Ready | Filament Group, Inc., Boston, MA （別窓）
上のipod風メニューの改良版だと思います。
メニューのためのjQueryプラグインが10個紹介されています。
その中からいくつか紹介。
jdsharp.us » jdMenu Hierarchical Menu Plugin for jQuery （別窓）
こちらは非常にシンプル。
リストをドロップダウンメニューにしてくれます。
Superfish - Suckerfish on 'roids （別窓）
こちらは縦表示や、バー形式の表示などが可能です。
jQuery iPod-style Drilldown Menu | Filament Group, Inc., Boston, MA （別窓）
最後はipod風。
パンくずリストの表示もあり、なかなかよさげ。
最後に紹介されてませんが、これまたipod風のメニューを紹介。
jQuery Menu: Dropdown, iPod Drilldown, and Flyout styles with ARIA Support and ThemeRoller Ready | Filament Group, Inc., Boston, MA （別窓）
上のipod風メニューの改良版だと思います。
CanvasはFlashを殺すか
Is Canvas the End of Flash? | The Stairwell （別窓）
CanvasはHTML5で策定された仕様で、JavaScriptベースで図形の描画が可能です。
これまでWebディベロッパはアニメーションやオーディオを使用した高度なWebサイトを作る際にFlashを利用してきましたが、Canvasはこれを脅かすかもしれません。
上のサイトではいくつかCanvasを利用したWebサイトが紹介されています。
Firefox3.1で見るのが推奨されています。
Nihilogic: Play JavaScript Super Mario Kart Online （別窓）
こちらはタイトル通りマリオカートがプレイできます。侮れない。
www.benjoffe.com | Canvascape （別窓）
こちらは上のページでは紹介されていませんがFPS風のデモ。
HTML5がメジャーになってモダンブラウザで正式にサポートされる頃、Canvasがどうなっているか楽しみですね。
Flashに取って代わるとは今のところまだ思えませんが、今後に期待です。
CanvasはHTML5で策定された仕様で、JavaScriptベースで図形の描画が可能です。
これまでWebディベロッパはアニメーションやオーディオを使用した高度なWebサイトを作る際にFlashを利用してきましたが、Canvasはこれを脅かすかもしれません。
上のサイトではいくつかCanvasを利用したWebサイトが紹介されています。
Firefox3.1で見るのが推奨されています。
Nihilogic: Play JavaScript Super Mario Kart Online （別窓）
こちらはタイトル通りマリオカートがプレイできます。侮れない。
www.benjoffe.com | Canvascape （別窓）
こちらは上のページでは紹介されていませんがFPS風のデモ。
HTML5がメジャーになってモダンブラウザで正式にサポートされる頃、Canvasがどうなっているか楽しみですね。
Flashに取って代わるとは今のところまだ思えませんが、今後に期待です。
様々な見せ方が出来るjQueryによるイメージギャラリー
jQuery GalleryView - by Jack Anderson（別窓）
様々な見せ方が出来るイメージギャラリーの紹介です。
デモは以下から。
jQuery GalleryView - by Jack Anderson（別窓）
jQuery GalleryView - by Jack Anderson（別窓）
DarkThemeとLightThemeの二つのテーマが用意されており、その切り替えも簡単に出来ます。
さらにイージングやトランジションのスピードなどオプションが豊富に用意されているため、自由度の高い見せ方が実現できます。
様々な見せ方が出来るイメージギャラリーの紹介です。
デモは以下から。
jQuery GalleryView - by Jack Anderson（別窓）
jQuery GalleryView - by Jack Anderson（別窓）
DarkThemeとLightThemeの二つのテーマが用意されており、その切り替えも簡単に出来ます。
さらにイージングやトランジションのスピードなどオプションが豊富に用意されているため、自由度の高い見せ方が実現できます。
リッチUIとそのチュートリアル集
10 Creative & Rich UI & How to Create Them | Noupe （別窓）
こちらではリッチなUIが使われたサイト10点と、そのUIを実装するための方法が紹介されています。
たとえば以下のサイトで言えば、日付が書かれたカードを移動する際のUI実装方法の例が紹介されているといった感じです。
Alex Buga - Webdesign Superstar （別窓）
10点のサイトを閲覧して気になったUIがあれば、その実装方法を見て実際にためしてみてはいかがでしょうか。
jQuery限定になってしまうが、以下のサイトもおすすめです。あわせてどうぞ。
Use jQuery （別窓）
こちらではリッチなUIが使われたサイト10点と、そのUIを実装するための方法が紹介されています。
たとえば以下のサイトで言えば、日付が書かれたカードを移動する際のUI実装方法の例が紹介されているといった感じです。
Alex Buga - Webdesign Superstar （別窓）
10点のサイトを閲覧して気になったUIがあれば、その実装方法を見て実際にためしてみてはいかがでしょうか。
jQuery限定になってしまうが、以下のサイトもおすすめです。あわせてどうぞ。
Use jQuery （別窓）