CSS3&jQueryで作る スマートフォンサイトUI図鑑 FavoriteLoadingあとで読む

: 事務局

  • Web制作
  • スマホ

CSS3&jQueryで作る スマートフォンサイトUI図鑑

  • あの定番UIの呼び方、 使い方、作り方がわかります
  • 「わかる」「選べる」「作れる」UIパーツ図鑑
  • コピペで使えるサンプルファイル43本を提供

著者:礒田優、久保知己、近藤直人、早川稔、宮田優希
監修:株式会社まぼろし
プロデュース:アスキー・メディアワークス
出版社:株式会社KADOKAWA
発売日:2015/02/23

詳細ページへ移動します[ASCII.jp]



どんな人におすすめですか?

「あの、ひゅーって横から出てくるメニュー」「え?どれ?Amazonみたいなやつ?」「じゃなくて、ほら、指でしゅってうごかせるやつ」「??」。スマートフォンサイトやWebアプリの制作時に「あるある」な光景ではないでしょうか。

本書は、そうした「スマホのUIパーツの名前がわからない」悩みを解決することを狙いの一つにしています。人によってUIの呼び名は異なり、必ずしも絶対的なものはありませんが、制作現場における一つの共通言語として活用されることを願って企画しました。

●ディレクターさん→クライアントやチームメンバーとの打ち合わせに
●デザイナーさん→サイト設計時のプロトタイプとして
●コーダー/フロントエンドエンジニアさん→実装の参考に

Webディレクターさん、デザイナーさんなど、スマートフォンサイトの制作に携わる、すべての方。
スマホサイトの画面設計やデザインの検討のときに、リファレンス的に使ってもらえるように作りました。

「わかる」「選べる」「作れる」UIパーツ図鑑

スマートフォンサイトの制作に欠かせない定番の43パーツを体系化して収録。
大きな誌面で、豊富なビジュアルを使って、UIパーツの構成要素や挙動を解説しました。
さらに、実際にUIが使われているサイトやアプリの事例、HTML/CSS、JQueryで実装するソースコードも紹介しています。

株式会社まぼろしのメンバーが執筆、監修を担当

技術力に定評のあるWeb制作会社「まぼろし」のメンバーが執筆、監修。
実務に根ざした、実用的な何用を目指しました。

商用利用OK!コピペで使えるサンプルファイル43本を提供

実装例のサンプルファイルをダウンロードにて提供。
商用利用可能、改変自由、著作権表示不要なので、すぐに仕事で利用できます。

今回の書籍で、特に届けたいノウハウを一つだけピックアップして具体的に教えてください

本書のオススメの使い方が、サイト制作のプロジェクトメンバーの間での意識の統一です。
たとえばサイト制作の打ち合わせでは、UIパーツの名前や機能がメンバーの間で共有できず、面倒なことがあると思います。そんなときに本書を開いてもらえば、UIの名前をや実際に使っているサイトをその場で調べられます。
どんなUIを選んでどんなサイトを作るか。本書をめくりながら、メンバー間で議論していただければ幸いです。

Chapter 1 メインナビゲーション

01 ナビゲーションバー
02 タブバー
03 リストメニュー
04 アコーディオンメニュー
05 スプリングボード
06 プルダウンメニュー
07 スライドメニュー
08 サークルナビゲーション

Chapter 2 サブナビゲーション

09 セグメンテッドコントロール
10 パンくずリスト
11 ページネーション
12 ドラッグ&ドロップ
13 シェアボタン

Chapter 3 リスト/グリッド

14 グリッドリスト
15 スワイプリスト
16 インフィニットスクロール
17 タイムライン

Chapter 4 ウィジェット

18 タブパネル
19 カルーセルパネル
20 カード
21 モーダルウィンドウ
22 トランスルーセント
23 イメージ検索
24 フォトギャラリー
25 ポップアップムービー
26 マップ
27 横スクロールコンテンツ

Chapter 5 通知

28 ツールチップ
29 コーチマーク
30 アイコンバッジ
31 トースト

Chapter 6 ビジュアライズ

32 インフィニットインジケーター
33 プログレスバー
34 ステップナビゲーション
35 グラフ

Chapter 7 フォーム

36 基本的なフォーム
37 ログインフォーム
38 サーチボックス
39 トグルボタン
40 カスタムボタン
41 カスタムアップロードボタン
42 カスタムセレクトメニュー
43 カウンター付きテキストエリア

著者プロフィール

磯田 優: WEBデザイン系の専門学校を卒業した後、2014年3月から株式会社まぼろしにフロントエンドエンジニアとして入社。

久保 知己: WEBデザイン系の専門学校を卒業した後、2014年3月から株式会社まぼろしにフロントエンドエンジニアとして入社。

出版社:株式会社KADOKAWA AMW BC Web Professional編集部

アスキー・メディアワークスは、KADOKAWAのブランドカンパニーのひとつです。「電撃」「アスキー」「魔法のiらんど」の3つのブランドを軸に、エンターテインメント分野を中心とした事業を展開。出版を基盤に、ウェブ・モバイル、電子書籍、アプリ、映像、音楽、グッズ、ゲーム、イベントなど、メディアを超えてコンテンツをプロデュース

事務局
この記事を書いた人: 事務局

「ムダな情報で頭脳を消耗することなく考える時間を確保する」
ウェブのノウハウだけに限らず、広告やマーケティング全般の知識、時には組織論や時事に至るまで、最先端や未来予測などみなさんにとって本当に必要な情報だけをお届けします。