Web Designing

ウェブデザイニング | Web Designing | 情報戦略でビジネスを加速させる 毎月18日発売

cover

2012年5月号

定価 1,470円

  • サンプルデータのダウンロードには、当月号の目次に掲載しているIDとパスワードが必要です。
  • サンプルデータに関する詳しい注意点については、このページの下部に記載している「サンプルデータについて」をご覧ください。

特集・特別企画

特集1:素敵な素敵なスマートフォン向けサイト

−スマホで“見たくなる”クリエイティブなWebページのショーケース−

本特集で紹介するスマートフォン向けサイトは、どれもがアイデアとクリエイティビティに満ちあふれています。どのサイトも単なる情報を効率的に伝えるWebページではなく、ユーザビリティの高さやインタラクションによる「体験」を積極的に取り入れ、驚きや楽しさとともに情報を与えてくれます。表示サイズ、通信/閲覧環境など、PCサイトに比べて制約の多いスマートフォン向けサイトですが、ちょっとしたアイデアとわずかなテクニックで、クリエイティブで素敵な素敵なサイトになります。

  • 01_機能を特化したアプリ風スマホサイト「ANA SKY VIEWER」
  • 02_モバイルで実現するパララックス「Air Jordan 2012」
  • 03_上下2分割したコンテンツスライダー「Airwalk」
  • 04_デバイスの傾きでページ遷移「14Four」
  • 05_“ドラッグ”で遷移するグローバルナビ「SEVNTHSIN」
  • 06_再生の途切れないプレーヤ「Wasabeat」
  • 07_1ソースに集約したアイデア「LightSkiing: EasySkiing, LightWeight」
  • 08_1画面にフィットさせたコンテンツ表示「Inzeit」
  • 09_使い勝手にフォーカスした構造「Airbnb」
  • 10_レスポンシブ対応の実験的サイト「nclud」
  • 11_世界観にマッチした3Dナビゲーション「グッジョブ、私!」
  • 12_サイトのロードを速くする工夫「CarnationGroup」
  • 13_カスタマイズできる機能的なサイト「Harvard University」
  • 14_細かい心配りのツールサイト「mixi」
  • 15_縦長ページを飽きずに見させる「ウイダー in ゼリー Smart Food Smart Life」
  • 16_デザインと縦スクロールの調和「adidas × JFA 結束の一本線」
  • 17_アナログ感を大切にしたサイト「g.u. 銀のイスに座れ!」
  • 【コラム】スマホサイト制作に役立つWebサイト集

previewpreview

掲載サイトリンク集

特集2:デベロッパーツール徹底活用リファレンス

−ブラウザの多機能な開発者向けツールをWeb制作に生かそう!−

現在の主要なWebブラウザには、表示されているページを解析できるWebデベロッパー(開発者)向けのツールが用意されています。これらは、Webサイトの構造を把握したり、動作状況を確認したりと、Web制作には欠かせないものとなっているにもかかわらず、その多機能さゆえに、使いこなせていない人が多いのではないでしょうか。そこでこの特集では、これらのWebデベロッパーツールの実践的な使い方を徹底的に解説していきます。

  • 【Introduction】
    • ニーズが高まるWebデベロッパーツール
  • 【Developer Tools on Web Brwser】
    • 主要なブラウザのデベロッパーツール
    • 01_Firefox
    • 02_Internet Explorer
    • 03_ Safari/Google Chrome
  • 【Practice】
    • HTML_HTMLのチェックと修正
    • CSS_スタイルシートのチェックと修正
    • JavaScript_見えないものを可視化する
  • 【Column】
    • 組み合わせて使いたいツール
    • スマートフォン対応を支援するAdobe Shadow

previewpreview

掲載サイトリンク集

【Special】なぜ中村勇吾はFRAMED*を作ったのか

−デジタルアートの新プラットフォームに大注目!−

絵画やオブジェを部屋に飾るのと同じような感覚で、デジタルアートで空間を彩ることができるインテリアデバイス「FRAMED*」。リリースがアナウンスされてから約1年。オリジナルのハードウェアとコンテンツマーケットプレイスとを融合した、まったく新しいタイプのデジタルアートプラットフォームがついに動き出しました。FRAMEDを企画し、また自らも一人のクリエイターとして、作品を発表している中村勇吾氏に話を聞いてみました。

preview

FRAMED*

コラボプロジェクト「チョコバナナ」

−山本博(ロバート)×中村洋基(PARTY)「負け犬書道」座談会−

前号でお伝えした、ロバート・山本博さんとPARTY・中村洋基さんのコラボによるサービス「負け犬博の負け犬書道」が、3月下旬に正式公開されました。今回は、公開から10日経った3月末の深夜、お二人のほかに制作チームがPARTYオフィスに集合。今回はその座談会の模様をお届けします。

preview

負け犬博の負け犬書道
チョコバナナ

肖像 -Web Craftman's Portrait-

-馬場鑑平/ユーザー参加型コンテンツの挑戦は10年で成層圏に届いた-

言わずと知れたクリエイティブプロダクション「バスキュール」のテクニカル/クリエイティブディレクターである馬場鑑平氏。10年前にバスキュールに参加し、時代に先駆けていち早くFlashを使ったマルチユーザーコンテンツに挑み、以来、ありとあらゆる広告コミュニケーションへの挑戦を続けています。昨年はとうとう宇宙とユーザーをつなげてしまった馬場氏に、その制作哲学をうかがいました。

preview

バスキュール

WF Inside Story

−GoogleマップのUIを徹底的に利用したUUのブランドサイト−

ユニクロとUNDERCOVERという意外なコラボレーションから生まれたファッションブランド「UU」が、3月16日にデビューしました。店頭で行列ができるなど話題を集めていますが、そのWebサイトも新鮮です。GoogleマップのAPIを用いて馴染みのUIを利用したものですが、ただ拡大するだけではなく予想外の表示に切り替わり、どんどんブランド世界の奥深くに入っていきます。クリエイティブディレクションを手がけたPARTYの清水幹太氏をはじめ、制作スタッフの面々に話をうかがいました。

preview

UU uniqlo undercover

ツクルヒト

−(株)由紀精密(精密切削加工メーカー)/コマは回り、町工場は踊る−

この2月に「全日本製造業コマ大戦」というイベントが行われたことをご存じでしょうか。腕に覚えのある製造業者が、「直径20ミリ以下」という制限の中で創意工夫を凝らしてつくりあげたコマで対戦するというイベント。「土俵の外に出るか、先に止まってしまったら負け」という単純明快なルールのもと、接戦を制し、見事チャンピオンの座を勝ち取ったのが、今回紹介する切削加工を本業とする(株)由紀精密です。

preview

(株)由紀精密
BRANCH

【短期集中連載】Jump into Metro!

Windows PhoneでMetro UIの世界に飛び込む
第三回:ネイティブアプリケーションでWindows Phoneアプリを開発する

今回はWindows Phoneの潜在能力を最大限に引き出すことができる、ネイティブアプリケーションの開発について言及します。ツールとして「Microsoft Expression Blend」を使いながら解説します。誌面で紹介しているサンプルファイルも用意しています。

preview

プロジェクトテンプレートのダウンロード

【FocusOn】テクノロジー×クリエイティブの新しいカタチ「FabCafe」オープン

−“FAB”スピリットとは?−

“FAB”という言葉を聞いたことがありますか? 「fabrication(ものづくり)」と「fabulous(愉快な、素晴らしい)」という意味が込められた、世界中に広がりつつある“ものづくり”の新しいムーブメントのこと。渋谷に誕生した「FabCafe」は、そのFABスピリットを楽しく、おいしく、わかりやすく伝えるための、ちょっと変わったカフェ&クリエイティブスペース。トータルプロデュースを手がける、トリプルセブン・インタラクティブの福田敏也氏にFABの面白さについて聞きました。

preview

FabCafe

エキソニモの「ウェブにふれる」Vol.7

引き続き、「デフォルト」をテーマに誌面を作りました……。前号はPowerPointでしたが、今回はiOS!

preview

http://exonemo.com/wf/

まんがAC部活動日誌

第十二回「シャワーリング」

クリエイターであれば、クライアントや代理店から10や20のボツを喰らったことはあるでしょう。今すぐにでも替えのアイデアの出さなきゃならない状況に追い詰められた時、どうすればいいのか。今回は、そんな絶望的な場面での乗り越え方をAC部が教えてくれます。

preview

AC部

連載企画

Web Designing Lab.

CSSLab._CSS3で入力フォームのカスタマイズに挑戦する
Text:秋葉秀樹

サンプルデータ「IDEA1」を見る
サンプルデータ「IDEA2」を見る
サンプルデータをダウンロードする

jQueryLab._Twitter BootstrapのjQueryプラグインを活用する
Text:徳田和規谷拓樹

サンプルデータ「モーダルウインドウ」を見る
サンプルデータ「ドロップダウンメニュー」を見る
サンプルデータ「ScrollSpy」を見る
サンプルデータ「タブインターフェイス」を見る
サンプルデータをダウンロードする

SmartphoneLab._jQuery Mobileでフォームを拡張する
Text:Coding Factory

サンプルデータを見る
サンプルデータをダウンロードする

FlashLab._スクロールバーを手軽に実装する
Text:池田泰延

preview

サンプルデータを見る
サンプルデータをダウンロードする

Server Quick Reference

サーバOSとしてWindows Serverを選択するときのポイント
Text:井上聡

Windows Server 2008

movement

練る+彫るアートユニットNerholの個展開催、USBメモリを壁に埋め込むアーティストAram Barthollのアート本、Dior伝説のバッグを素材に豪華アーティストたちの競演 ほか

Worldwide Creator's Archive

Superfamous/出発点は機能性と美しさへの追求

Superfamous

WD Website Front

TRENCH TRIP - UNITED ARROWS、Mercedes-Benz the new A-Class 2012、BEAMS Women's IREKAE KISEKAE、PARTY、高橋優 寄せ書きライブ、TAG REACTION ほか

WD Website Front

今月の掲載サイトリンク集へ

one's view

「ぎじゅつはさいこうのおもちゃだ」
Text:清水幹太
ドッ ドッ ドリドリ ドドドド ドリランド

「インターネット“隙間”カルチャー」
Text:林智彦(nuuo
YouTube Reply Girl

「さよならデスクトップ」
Text:谷口暁彦
DESKTOP VIEWS

「新しいソーシャルゲームプラットフォーム」
Text:浦野大輔
Zynga.com

モノサシに目印

棋譜アニメ
Text & Visual:長谷川踏太(tomato)

preview

Hop, Step, JavaScript! ~プログラムの基礎をイチから学習~

−式の値で結果を分ける「条件分岐」−

サンプルコードをダウンロードする

Social Seeds

「GFACE」に見るSNS とゲームの融合で生まれる新しい可能性
Text:野澤智朝(ニテンイチリュウ

GFACE

この仕事のカタチ

Web業界を幸せに生き抜くたった一つのコツ
Text:小泉森弥

橘塾

クライアントにどういった手段を勧めるべきか
Text:橘守

モバイルコンテンツ最前線

ファイナルファンタジー ブリゲイド:人気RPGも挑戦するモバイルの全方位戦略

preview

FINAL FANTASY BRIGADE

News Crawler

電通「2011年日本の広告費」まとめ、「JWDA WEB デザインアワード」結果発表、スマートフォン最適化診断レポート ほか

WD Reviews

Anime Creator Pro 8、Intuos5 touch

ハギハラ総研

本当は難しいレストランの点数評価
Text:萩原雅之

その他

全国Web制作会社リスト
モニター&プレゼント
WD Square
Back Numbers

サンプルデータについて

  • サンプルデータのダウンロードには、当月号の目次に掲載しているIDとパスワードが必要です。
  • 各サンプルデータの著作権は、各データの作者に帰属します。
  • サンプルデータをご利用の際の利用条件や連絡先などについては、圧縮データに同梱しているテキスト「readme.txt」をご覧ください。
  • 各サンプルデータの内容に関しては間違いのないように十分注意しておりますが、もしこれらのデータを利用することによってトラブルや損失・損害が発生しても、各データの作者および(株)マイナビは一切責任を負いませんのでご了承ください。