週刊Webテク通信

2014年11月第3週号 1位は,2015年に向けての7つの重要なWebデザインのトレンド,気になるネタは,Facebookが「ありがとう」を伝えよう動画企画を開始

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

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

1. 7 Crucial Web Design Trends For 2015 | Sponsoredhttp://webdesignledger.com/sponsored/7-crucial-web-design-trends-for-2015

2015年を迎えるにあたっての,7つの重要なWebデザインのトレンドについて解説した記事です。

  1. タイポグラフィに柔軟性を
  2. Webコーディングの衰退
  3. 進化したレスポンシブデザイン
  4. フラットデザインがピクセルの世界を制覇する
  5. 画像は大きいほどいい
  6. スクロールによるアニメーション,視差効果,ちょっとしたインタラクション
  7. Webグラフィックスの夜明け

1は,どんなプラットフォーム上でも読みやすく表示されるテキストにすべきということで,レスポンシブなテキストをということですね。

7は,インフォグラフィックスをWeb向けに進化させた,インタラクティブな要素が加わったグラフィックス要素が主流になっていくだろうとのこと。この,Webグラフィックスの今後の動向には,個人的にも注目したいと思います。

図1 2015年に向けてのWebデザインのトレンド

図1 2015年に向けてのWebデザインのトレンド

2. Current Design Trends for Digital Shops and E-commerce Websites - DesignM.aghttp://designm.ag/web-designs/trends-for-digital-shops-ecommerce-websites/

ECサイトの最近のデザイントレンドを解説しています。

  • 市場性のあるホームページ
  • 固定ヘッダ
  • 切り替わるコンテンツ(スライダーなど)
  • なめらかで美しいタイポグラフィ

また,実際のサイトのデザインギャラリーも載っており,最近の海外ECサイトのデザインのトレンドが分かります。

図2 ECサイトの最近のデザイントレンド

図2 ECサイトの最近のデザイントレンド

3. 知っておくと便利!あのサイトでさりげなく使われていたCSS小技集 | コムテブログhttp://commte.net/blog/archives/4861

CSSの新しい要素などを使ったテクニック集をまとめています。

CSSを使いこなすことで,実はけっこう簡単に実装できるという小技が多数紹介されていました。

図3 さりげなく使いたいCSSテクニック集

図3 さりげなく使いたいCSSテクニック集

4. Lychee ― Self-hosted photo-management done righthttp://lychee.electerious.com/

自分のサーバーにインストールして,写真ギャラリーを作れるツールです。自分の管理するサーバー上でFlickrのような感じで画像を管理することができ便利そうです。

写真をソーシャルメディアでシェアすることもできますし,公開ギャラリーとしても使えるようです。

図4 写真ギャラリーを作れるツール

図4 写真ギャラリーを作れるツール

5. 30 Inspiring Dark Web Designshttp://sixrevisions.com/web_design/30-inspiring-dark-web-designs/

モノクロ写真など,暗い色をベースとしたWebデザインのギャラリーです。

モノクロ写真の一部がカラーという表現や,モノクロの中に一色だけ差し色を使った表現は,定番ではありますがやはり目を引きます。

図5 暗い色をベースとしたWebデザインのギャラリー

図5 暗い色をベースとしたWebデザインのギャラリー

そのほか,最近の記事の中から,気になるニュース記事を3つ紹介します。

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

7 Helpful Tools To Identify Font | SmashingApps.comhttp://www.smashingapps.com/2014/11/12/7-helpful-tools-to-identify-font.html

今回は,フォントを識別するためのWebサービスをまとめた記事を紹介します。フォントを探す際に役に立つツールが7つ掲載されていました。

大きく以下の2つのパターンに分かれています。

  • 画像をアップロードするか画像のURLを指定することで,何のフォントかを調べてくれる
  • いくつかの質問に答えていくことでフォントを絞り込む

Webサービスとはちょっと違いますが,フォントの画像を投稿すると誰かがフォント名を答えてくれる(かもしれない)という人力のアプローチも面白いですね。

ここで紹介されているFlickrのグループがそうですし,この記事では「What The Font」サービスが紹介されているMyFontsにも「WhatTheFont Forum」というフォーラムコーナーがあって,多くの質問と答えのやり取りが行われています。

図6 フォントを識別するためのWebサービス7選

図6 フォントを識別するためのWebサービス7選

今週の気になるWebネタ

「ありがとう」を伝えようhttps://www.facebook.com/thanks

「ありがとう」を伝える動画を友達に送るという企画をFacebookが始めています。友達を選ぶと,二人に関係する写真やコメントが表示され,そこから選んだ素材を元に動画が作成されます。

Facebookでは以前から過去の写真を元に自動で動画が作れる企画はいくつかありましたが,今回のはかなり照れくさい感じの動画ができます。⁠あなたと友達になって良かった」⁠あなたは素晴らしい人です」みたいなメッセージが英語で表示され,日本人の感覚ではストレート過ぎると感じられるでしょう。

最近はテレビCMを始めたFacebookですが,あの「ともだち」を連発したCMが押しつけがましいと不評のようです。この,⁠ありがとう」を伝えよう動画も,⁠ともだち」連呼CMと同様の押しつけがましさを感じる人が多そうですね。

著者プロフィール

芦之由(あしのよし)

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

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

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

コメント

コメントの記入