2014年6月号 vol.155
定価1,530円
- サンプルデータのダウンロードには、本誌の次号予告ページ（160ページ）に掲載しているIDとパスワードが必要です。
- サンプルデータに関する詳しい注意点については、このページの下部に記載している「サンプルデータについて」をご覧ください。
特集･特別企画
特集1：エモーショナルなCSS表現
どきどき、ふわっ、くるくる‥‥。気持ちが伝わる演出をサンプルで学ぶ
CSS3では多くのプロパティが追加され、それまでは不可能だった表現が簡単に実装できるようになりました。アニメーションやテキストエフェクト、フィルタなどを使えば、言葉や表情で伝えるような表現をマルチデバイスに展開できます。本特集では、そんなCSS3の機能を使った「気持ちが伝わる」エモーショナルな表現を集めました。さまざまなサンプルを解説していますが、どれもシンプルで応用が利くものばかり。ちょっとした工夫で、ページを構成する各要素が、楽しく、目を惹くものになることがわかります。自分なりの「気持ちが伝わる」表現をみつけてみませんか？
くるくる＿回転するホバーアクション／キラリと光るメニューボタン
ひみつ＿CSSだけで秘密のメッセージ！
ノスタルジック＿フィルタでレトロ感のある写真に／写真にノイズを加えて、懐かしい雰囲気に
キュート＿CSSだけで描く、ストライプ、チェック、ドット
注目！＿伝えたい言葉にはラインマーカーを引いて／乙女心をくすぐるハートのボタン
ぽんっ＿画像の動きと、はじけるハートで魅せるギャラリー
ふわっ＿文字が浮かび上がるアニメーション／ハートが浮き出るキュートなボタン
すーっ＿ブラウザの外から現れるモーション
Column＿恋に落ちるテキストエディタ「Sublime Text」
ぽよん＿マウスオーバーではずむナビゲーション／ウインドウ幅でアイコンのデザインを変える
ぴたっ＿レスポンシブなグローバルナビゲーション
どきどき＿ドキドキするボタン／キュンと狭くなるアニメーション
マジカル＿文字も画像も簡単に装飾できる、魔法のようなプロパティ
ちらり＿じらすフルスクリーンアコーディオン／マウスオーバーで現れるコンテンツ
ぱたり＿回転するメッセージカード
手書き＿手書き風フォントで親近感を演出／Edge Web Fontのツール連携
さらり＿流れるようなモーションタイポグラフィ
Column＿万能型CSSジェネレータ「Enjoy CSS」
特集2：「機能のデザイン」入門
身近なモノに隠された使いやすさの秘密
わかりやすい地図で、スムーズに目的地へと導く。読みやすい誌面をとおして、話題のニュースをいち早く届ける。かんたん操作の家電で、家事の時間を短縮する。人間がモノをつくり出す時、そこには必ず「目的」が存在します。そして、その目的を実現するために欠かせないのが「デザイン」です。モノに込められた目的をわかりやすく、美しくかたちにすることによって、すぐれた「機能」を与えること。それこそが、デザインの大切な役割です。
本特集では、身のまわりにあるモノを実例に挙げながら、機能をかたちにするための手法や理論を解説していきます。「身のまわりにある」ということはつまり、人びとが違和感なく自然に使っているということ。その使いやすさに対する無意識の安心は、決して偶然の産物ではなく、考え抜かれたデザインによって生まれたものなのです。
- PART1 身近な「機能のデザイン」
- 迷わせない
- ひと目で伝える
- 操作させる
- 海外の制作会社が見る日本のB2Bアプリ市場
- 行動をうながす
- 視線を誘導する
- PART2 話題の「機能のデザイン」
- ほぼ日手帳＿使い手の発想を妨げない、静かなデザイン
- フィットカットカーブ＿刃先をカーブさせることで切れ味を向上
- ふじようちえん＿建物全体が遊具として機能する
【特別企画】カラーミーショップ大賞2014
10年目に開催のアワードで6万店舗の頂点に輝くのは!?
「ネットショップを作るドキドキ、ワクワクをもっと突き詰めよう」と、GMOペパボ（株）が10年前に始めたサービス「カラーミーショップ」。登録店舗数は6万店舗を超え、衣類や家具などの販売だけでなく、野菜、さらには専門家の知識を販売するお店も生まれました。さらなる発展へ向け、今アワードを開催。6万店舗の頂点、あこがれのカリスマECサイトとしてこれからも注目されるであろう受賞サイトには、売上だけではない、また訪れたくなる工夫が散りばめられていました。
チョコバナナ企画会議
「チョコバナナ ベンチャーサミット」開幕！
「Web Designingと吉本のオイシイ出会い」としてはじまった「チョコバナナ企画会議」が、「ベンチャー」をキーワードにした新プロジェクトをスタートします。それに先立ち、こけら落としとして「チョコバナナベンチャーサミット」を開催しました！ 今回は、話題の起業家6名が「働き方」「人材」「コンテンツ」などさまざまな話題を語りあった少しマジメ（！）な「会談」の模様をお届けします。
WF Inside Story
スマホラー劇場＿ホラー番組をより怖くより夢中にさせるスマホとの連携
3月31日深夜に、BS-TBSでオンエアされたテレビ番組「スマホラー劇場」。これは、2人の映画監督が2組のアイドルグループを起用してホラームービーを制作し、そのメイキングと完成した作品を公開するという内容でした。普通のテレビ番組と違っていたのは、専用のスマホアプリを配布し、番組とアプリを連携させることでさらに恐怖感を盛り上げる体験を提供していたこと。なぜ、このような試みを行ったのでしょうか。
肖像 －Web Craftman's Portrait－
ムラカミカイエ（SIMONE INC.）＿「コト」を追究する企業ブランディングの表現思想
Webサイト制作はもちろん、ファッション関連企業のブランディングを得意とするSIMONE INC.を率いるムラカミカイエ。「一つのクライアントには一つの個性がある」という彼の作品には、テンプレートは存在しないといいます。しかし、そこには表現に関する揺るぎない思想があるのです。
ツクルヒト
赤松陽構造（映画タイトルデザイナー）＿文字で彩り、文字で誘う。映像の呼吸を整える技術
「タイトルデザイン」とは、文字どおり、映画の題名をデザインする職能のこと。赤松陽構造さんは、映画タイトルデザインの第一人者。1969年、急逝した父親の仕事を継ぐかたちでその世界に足を踏み入れ、以降、半世紀近くにわたって多種多様なタイトルを手がけ、その数は400点以上にものぼります。映画の内容を「文字で伝える」とは、どういうことなのでしょうか。知る人ぞ知るタイトルデザインの世界をのぞいてみよう。
デザインにできることDialogue
秋山伸×永原康史「精緻なるDIY」
今回のゲストは、2010年にschtüccoを解散し、現在は新潟で活動を続けるデザイナーの秋山伸氏です。秋山氏がデザインした書籍を囲みながら、独自のデザインワークについて話がはずみました。
BiND7 Guide for the creators
後編：BiNDカート機能を使ってECサイトを作ろう
テンプレートをベースにノンプログラムでデザイン性の高いサイトを構築できるのが、Webオーサリングソフトウェア「BiND for WebLiFE*」です。後編では、新バージョン「7」（BiND7）から無料で利用できるようになったカート機能（BiNDカート）を中心に、BiND7を活用したショッピングサイトの制作方法や管理／運用面について解説します。
トリセツWeb化計画 New!
第1回 Web制作業界の新たなマーケット「トリセツ」
さまざまな商品やサービスの使用説明・取扱説明書、いわゆる「トリセツ」に関する国際規格が改定され、電子データで提供することが可能になりました。しかしそこには、これまでのWebにはない、義務や責任が生じてきます。この連載では、そんなトリセツのWeb化について集中的に解説をしていきます。
Monthly Focus
Monthly Focus＿Sublime Text［前編］
「Sublime Text」は、このところWeb制作者を中心に世界的に広まっているテキストエディタです。「Webデザイナーズ白書2013-2014」（2013年12月号第二特集）でも、急速に支持を集めたとわかる結果が出ていました。そこで、今回から2回にわたって、Sublime Textを解説します。前編は概要についてまとめました。
連載企画
Web Designing Lab.
JavaScript Lab.＿ロールオーバーの基本から応用までを学ぼう
Text：小平麻美、木村壮哉（エンタクルグラフィックス）
サンプル01を見る
サンプル02を見る
サンプル03を見る
サンプル04を見る
サンプル05を見る
サンプル06を見る
サンプル07を見る
サンプルデータをダウンロードする
Flash Lab.＿［HTML5オーサリング編］自由度の高いスライドショーを作成しよう
Text：池田泰延
movement
関西のWeb制作会社が集結！「WWW - West Wide Web ウェブプロダクションの今」、河村康輔個展、レアンドロ・エルリッヒの日本初個展、伝統文化とサブカルチャーを融合させた「ニコラ ビュフ」展、進撃の巨人プロジェクションマッピングレポート ほか
Worldwide Creator's Archive
Mirada＿「時代を越える」とは何か
WD Website Front
KEI-KO TOKYO LTD.、Night Walk In Marseille、3D on the Rocks、日清食品グループ、CYBERTHREAT Real-time map、New Balance Japan | Wellness、銀座英國屋 － Official Web Site ほか
【新著者登場】one's view
「化け物」が時代を変える
Text：清水幹太（パーティ）
KILLING KENNEDY
現代の“手早く見渡せる”カタチ
Text：北村 健
Prismatic
フラットデザインのセオリー
Text：川田十夢 New!
未来年表
大胆の強度
Text：菅野 薫
Unnumbered Sparks
ツール・ド・グラフィーク －CD1枚分の挑戦！－
第15回「男女」
Text&collage：河村康輔
ローカルクリエイティブのススメ
場づくりのプロに訊く「場」の持つ可能性
Text：須賀大介
この仕事のカタチ
古くて新しいエクスペリエンス
Text：小泉森弥
News Crawler
賞金総額350万円！「HTML5 Japan Cup 2014」開催、I.C.Eが新規入会団体を広く募集 ほか
モバイルサービス最前線
JR東日本アプリ＿スマホアプリプロジェクトがイノベーションを生み出す
Text：中谷健一（トリムタブジャパン）
デジタルマーケティングのひみつ
ビデオコンテンツで工夫できること
Text：オオタケンジ
博報堂DYグループ・スマートデバイス・ビジネスセンター「全国スマートフォンユーザー1000人定期調査」第9回分析結果報告（2014年4月11日リリース）
ハギハラ総研
国内でも加速するスマートフォンシフト
Text：萩原雅之
エキソニモの「ウェブにふれる」
Vol.32 連載ボーグ・シリーズ EP.12「炎上と冬眠」
まんがAC部活動日誌
第三十七回 「子育てと社会」
その他
全国Web制作会社リスト
モニター&プレゼント
WD Square
Back Numbers
サンプルデータについて
- サンプルデータのダウンロードには、本誌の次号予告ページ（160ページ）に掲載しているIDとパスワードが必要です。
- 各サンプルデータの著作権は、各データの作者に帰属します。
- サンプルデータをご利用の際の利用条件や連絡先などについては、圧縮データに同梱しているテキスト「readme.txt」をご覧ください。
- 各サンプルデータの内容に関しては間違いのないように十分注意しておりますが、もしこれらのデータを利用することによってトラブルや損失・損害が発生しても、各データの作者および（株）マイナビは一切責任を負いませんのでご了承ください。