週刊Webテク通信

2019年2月第3週号 1位は,Web Design 3.0の定義や目指すところ,気になるネタは,Spotifyが黒字転換,Anchorなどポッドキャスト企業2社買収

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

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

1. Web Design 3.0: When Your Web Design Really Matters - Nicepage.com Documentationhttps://nicepage.com/doc/article/20348/web-design-3-0-when-your-web-design-really-matters

ウェブデザインの歴史を振り返り,現状の問題点を明確にしたうえで,Web Design 3.0の定義や目指すところを解説しています。結局のところはウェブデザインツール「Nicepage」の宣伝のための記事ですが,なかなか興味深い内容でした。

Web Design 3.0の定義としては,以下の3つを挙げています。

  1. 自由な配置
  2. 要素の重なり
  3. Bootstrapのようなグリッドの制限をなくす

印刷物と同様の,創造性があり自由度の高いレイアウトを実現するのがWeb Design 3.0の目指すところのようで,そのためには新たなツールが必要という話の流れになっていました。

図1 Web Design 3.0の定義や目指すところを解説

図1 Web Design 3.0の定義や目指すところを解説

2. Mobile Icon Design for Faster Visual Searchhttps://uxmovement.com/mobile/mobile-icon-design-for-faster-visual-search/

モバイルアイコンのデザインについて,認識しやすさという観点からヒントを紹介しています。

  1. アイコンを詳細まで描き込むほど,視覚的なノイズが多くなり認識しにくくなる
  2. アイコンを背景図形に配置したとき,背景に対するアイコンの比率が低いと見にくくなる
  3. 暗い背景に明るい色のアイコンの方が大きく見えて認識しやすい
  4. 青,緑,赤がアイコンに好まれる色で,紫,オレンジ,黄色は好まれない色

青,緑,赤は光の三原色なのではっきり見えて親しみやすく,紫,オレンジ,黄色は色あせて見えるので好まれないのではないかとのことです。また,アイコンの持つ意味は,色の好みには特に影響を与えなかったそうです。

図2 モバイルアイコンのデザインのヒント

図2 モバイルアイコンのデザインのヒント

3. Can't Unseehttps://cantunsee.space/

2つの画像から,正しいUIデザインを選んでいくクイズを提供しています。結構むずかしくて夢中になってしまいます。

一見2つとも同じに見える画像もありますが,文字やアイコンの濃さや大きさがちょっとだけ違ったりしています。読みやすいもの,バランスの良いものを選ぶとだいたい正解します。

回答したあとは2つの画像のどこが違うのかがテキストで表示され,Shiftキーを押すか「Compare」ボタンを押すと切り替えながら比較できます。

図3 UIデザインのクイズサイト

図3 UIデザインのクイズサイト

4. Logo Design Cost: A look at the logo design priceshttps://www.designyourway.net/blog/graphic-design/logo-design-cost/

ロゴデザインにいくらかかるのかについて,だいたいの価格帯とその値段でどこまでできるかを解説しています。日本とは違う要素も多いと思いますが,金額的には1ドルを100円で換算したくらいで納得いく数字だと思います。

ツールやテンプレートで作る方法や,クラウドソーシングを利用する提案,フリーランスデザイナーの探し方まで紹介していて,なかなか読み応えのある記事です。

図4 ロゴデザインにかかるコストについて

図4 ロゴデザインにかかるコストについて

5. 10 Free Instagram Story Templateshttps://speckyboy.com/free-instagram-story-templates/

Instagramのストーリー用テンプレートを配布しているページをまとめています。

ストーリー用だけでなく,投稿用の正方形のテンプレートも混ざっており,無料のものも有料のものもあります。

ストーリーサイズのスマホ縦型用画像をレイアウトするヒントにもなりそうです。

図5 Instagramのストーリー用テンプレートいろいろ

図5 Instagramのストーリー用テンプレートいろいろ

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

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

Tokimeki Unfollow ✨https://tokimeki-unfollow.glitch.me/

「Tokimeki Unfollow」は,Twitterで自分がフォローしているアカウントを整理するためのサービスです。Twitterアカウントと連動させて,フォローしているアカウントのフォローを外すかどうかを順番に処理していきます。

Tokimekiは「ときめき」のことで,Netflixの番組が始まり米国で再ブレイク中の近藤麻理恵の「KonMari片付けメソッド」でフォロワーも整理しましょうということです。あらためて一人ずつのツイートを見て,ときめくかどうかで判断するんですね。

見ていく順番は,フォローしたのが新しい順,古い順,ランダムの3種類から選べます。アンフォロー/リストに追加/キープ(そのままフォローし続ける)はキーボードで操作もでき,快適に「KonMariメソッド」を実践できそうです。ちなみに,作者は近藤麻理恵とは全く無関係の人のようです。

図6 Twitterでフォローしているアカウントを整理するサービス

図6 Twitterでフォローしているアカウントを整理するサービス

今週の気になるWebネタ

Spotifyが黒字転換,Anchorなどポッドキャスト企業2社買収 - ITmedia NEWShttp://www.itmedia.co.jp/news/articles/1902/07/news060.html

音楽ストリーミングサービスSpotifyがポッドキャスト関連企業のGimletとAnchorを買収しました。将来的には,Spotify利用の20%以上が音楽以外のコンテンツとなる予測を立てているそうです。

AnchorはiOS,Androidデバイスでポッドキャストの収録から配信まで簡単にできるサービスで,Apple,Google,Spotifyでの配信にも無料で対応しています。Anchorのサイト/アプリで聴くこともできます。

著作権の包括契約をしているんだと思いますが,Apple MusicやSpotifyの曲を30秒だけ使える機能があります。今のところ再生できるのはAnchor上でだけという制限があるんですが,Spotify傘下になったことでSpotify上でも曲が再生できるようになるでしょう。1曲フルで使えるようになり,音楽番組を誰でも配信できるようになるかもしれませんね。

著者プロフィール

芦之由(あしのよし)

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

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

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

コメント

コメントの記入