週刊Webテク通信

2013年7月第5週号 1位は,インフォグラフィックスをつくるべき理由と作成ツール,気になるネタは,Google,テレビのHDMI端子に挿すChromecastを発表

この記事を読むのに必要な時間:およそ 2 分

ネットで見かけたWebテク(Webテクニック・Webテクノロジー)記事から,Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は,2013年7月22日~7月28日の間に見つけた記事のベスト5です。

1. Four Major Reasons to Create Your Own Infographic | iBrandStudiohttp://ibrandstudio.com/articles/infographic-data-visualization-benefits

インフォグラフィックスをつくるべき理由と,作成ツールを紹介した記事です。

インフォグラフィックスの良さは,以下の4つに分けて解説されています。

  1. リンクによる流入を得るためのコンテンツとなる
  2. 図表的で面白いフォーマットで紹介できる
  3. ユーザーに認知される
  4. 新しいクライアントを集める材料となる

1.で説明されている,TwitterやFacebookで拡散されていき,自分のサイトへのトラフィックを生むということが,やはりインフォグラフィックスに期待されることでしょう。

図1 インフォグラフィックスをつくるべき理由と作成ツール

図1 インフォグラフィックスをつくるべき理由と作成ツール

2. Avoiding Design Failures: Skeuomorphism and Flat Designhttp://www.kylejlarson.com/blog/2013/avoiding-design-failures-skeuomorphism-and-flat-design/

スキュアモーフィズムとフラットデザインについて,デザインのミスを回避するという視点からまとめた記事です。

  • スキュアモーフィズムは諸刃の剣である
  • フラットデザインの人気の上昇
  • 失敗しないためにはデザインの原則を用いること

といった項目に分けて解説されています。

例として,iOSのGame Centerアプリの凝ったスキュアモーフィズムデザインは問題ないけれど,メモアプリの過剰な装飾や手書き風フォントは,素早くメモを取りたいという目的には出しゃばりすぎているということが挙げられていました。

図2 スキュアモーフィズムとフラットデザインについて

図2 スキュアモーフィズムとフラットデザインについて

3. 日本ではこれから?!流行のフラットデザイン国内事例17個+α / SQUEEZE - Web Design Studio -#1. A source of backlinkshttp://squeeze.jp/blog/web-design/flat-design-in-japan/

フラットデザインが用いられた国内サイトをあつめたギャラリーです。

最後に別枠でマイクロソフトのページも紹介されていますが,海外サイトのローカライズ以外でもフラットデザインのサイトが増えてきているようですね。

図3 フラットデザインのサイトの国内事例

図3 フラットデザインのサイトの国内事例

4. Web Design Trend Showcase: Big Video Headershttp://line25.com/articles/web-design-trend-showcase-big-video-headers

大きなサイズのビデオが使われたサイトのギャラリーとテクニック紹介です。

背景に動画を使うためのチュートリアルやjQueryプラグインも多数掲載されています。

図4 大きなサイズのビデオが使われたサイトのギャラリー&テクニック

図4 大きなサイズのビデオが使われたサイトのギャラリー&テクニック

5. 25 Awesome Examples of Art-Inspired Websiteshttp://www.webdesignfact.com/2013/07/examples-of-art-inspired-websites.html

アートから刺激を受けたWebデザインのギャラリーです。

絵画風のイラストなど,アート風の要素を取り入れたサイトが多数紹介されていました。

図5 アートから刺激を受けたWebデザインのギャラリー

図5 アートから刺激を受けたWebデザインのギャラリー

そのほか,最近の記事の中から,日本の有名サイトに関するニュースを2つ紹介します。

先週の気になるWebサービス

JavascriptOO.comhttp://www.javascriptoo.com/

JavaScriptのライブラリを探せるサービスです。

Animation,CSS,Mobileといったカテゴリを選んで探すことができ,複数のカテゴリで絞り込んでいくことができます。

絞り込んだライブラリは,新着順,ツイート数の多い順,Githubのウォッチ数の多い順などでソートができ,各ライブラリには詳細ページがあります。

詳細ページではサンプルコードとデモを確認でき,Githubから引っ張ってきていると思われるReadMeを読むこともできます。サンプルは実行結果を見ることができ,コードをいじって確認することも可能です。

図6 JavaScriptライブラリを探せるサービス

図6 JavaScriptライブラリを探せるサービス

今週の気になるWebネタ

Google,テレビのHDMI端子に挿すChromecast を発表。価格は35ドル - Engadget Japanesehttp://japanese.engadget.com/2013/07/24/google-chromecast-hdmi/

テレビにつないでオンラインの動画や音楽を再生するためのスティック型機器「Chromecast」がGoogleから発表されました。

Apple TVのようなものかと思った人も多いと思うのですが,実際はかなり設計思想の違う商品でした。Chromecastはオンラインのコンテンツをテレビに表示するためのもので,スマートフォンやタブレットをリモコンにして,YouTube動画をテレビで再生させるのがメインの使い方のようです。

「リモコン」として使えるのはAndroid,iOS,Windows,Macとマルチプラットフォームなところがいいですね。また,あくまでリモコンなので,再生中に端末側ではストレスなく別の作業ができるところもポイントです。

なお,Chromeブラウザにエクステンションを入れると,標準で対応していないネット動画や,ローカルの動画も再生できるとのこと。その際は,パソコンでエンコードしながらストリーミングされるようです。Chromeブラウザの画面を表示する機能もあるようですし,やっぱり用途によってはApple TVのライバルになるのかもしれません。

著者プロフィール

芦之由(あしのよし)

Webデザインやサイト制作に役立つブログ記事やニュースをほぼデイリーでお届けするメルマガ「デイリーWebテク」発行人。フリーのWebデザイナー兼イラストレーター&ライター。シャープMZ-80Bからのパソコンユーザーで,Macintosh IIciからのMacユーザー。嫌いな言葉は「IEで見ると表示が崩れてるよ」。

デイリーWebテクの購読やバックナンバーについては,以下の紹介サイトをご覧ください。

デイリーWebテク - Webテク関連の話題を毎日配信 -
URLhttp://www.rgs680.com/dwt/

コメント

コメントの記入