WEBCRE8.jpウェブクリ8.jpwebデザイナーによる、デザインとwebを楽しむ情報ブログRSSABOUT使う。WEBCRE8.jpが試してみたwebサービス、アプリ等をレビューするカテゴリです。jQueryで作るスマートフォンサイトUI図鑑」がアスキー・メディアワークスから刊行されました。この本のみどころをさらっと解説します。この本は、近年特に重要さを増してきているスマートフォンサイトの制作において特にニーズのある、スマートフォンサイトやアプリケーションでのUIパターンを実例とビジュアル、コードなどで多角的に解説したものです。書籍のタイトルにある図鑑という言葉通り、眺めるだけでも面白い本です。目次で様々なUIの見た目が一覧できる本の目次が、そのまま紹介されているUIの一覧表になっています。目的のものをビジュアルから探すことができるので、通読しなくても必要なときにパラパラっと確認できるのが良さそうですね。その名称がイラストに描かれた画面のどこを指しているのか色をつけてわかるようにしてあったりするとなお良いなーと思いました。紹介されているUIパーツは以下のような項目に分かれています。ヴィジュアライズフォームこれらの項目のなかで更にアコーディオンメニュー、トグルボタン、トピックパスなどのよくあるUIパーツに名前を与えて分類、紹介しています。デファクトな名前が定まってないもの、あえてそうやって呼ぶことは少なそうなものもありますが...網羅しておかないとアレですし、実際どう呼ぶかって統一しておけばとりあえず仕事の役には立つでしょうしね。各UIパーツごとに、冒頭で名称と役割や見た目を解説します。使われる名称がいくつもあるようなものはタイトルの下に他の呼び名が書かれていますが、これが地味に良いなと思いました。人に説明するときや同じもの似ついて話しているとき、プルダウンメニュー?ドロップダウンメニュー?と言葉が混ざるときもあると思うのですが、こういうもので認識を統一しおくと良さそうですよね。いう意味では実装者やデザイナーだけでなく、ディレクターさんなんかも目を通しておくと良さそうです。各項目内ではさらに実際にそのUIを採用しているサイトのスクリーンショットやイラストを用いて、そのパターンがどんな場合に有用なのか、どのように実装するかを解説しています。カラーの写真とHTML、CSS、JSのコードサンプルCSS3、jQueryを使ったシンプルな実装のやり方とその応用例なども紹介されていますが、このコードサンプルは本を購入して得られるコードを使ってWebからダウンロードもできます。この際、本書のPDF版もダウンロードできます★おわりにこの本は株式会社まぼろしが監修しており、執筆陣もまぼろしの社員の方たちで書かれた本です。KOJIKA17のこじかちん(@kojika17)も参加していて、最近本書きまくっててすげえなあと思っている次第ですwさらっと読めるわりに、そのままで使えるコードも解説してあるので、実用的でもあると思います。2,923Amazon.co.jpで詳細を見る今回はアスキーの担当者様より本書をいただきました。この場を借りてお礼申し上げます。WEBCRE8.jpでは献本を受け付けています。お問い合わせはmail@webcre8.jpまでご連絡をいただければと思います。tweethatenafacebook_likewebcre8はTwitterを使っています。Webサイト制作フローをアップデートする本ゴールデンウィークにどうぞ。ゴールデンウィークにどうぞ。