週刊Webテク通信

2020年4月第4週号1位は、リモートワークでチームで作業するのに役立つツールいろいろ、気になるネタは、Facebookが友だちや家族への特別の愛と気づかいを表現する新リアクション「care」追加

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

1. 16 Tools for Keeping Your Remote Design Team Together (and on Task) | Webdesigner Depothttps://www.webdesignerdepot.com/2020/04/16-tools-for-keeping-your-remote-design-team-together-and-on-task/

リモートワークでチームで作業するのに役立つツールをまとめた記事です。

以下のカテゴリーに分けて16個のツールを紹介しています。

  • デザイン作業のためのプロジェクト管理とコラボレーション
  • 一般的なプロジェクト管理とコラボレーション
  • 会議ツール、仮想オフィス、コミュニケーションハブ
  • デザインライブラリーとドキュメント整理
  • 共同での校正と編集ツール
  • 個人が平静でいるためのツール
図1 リモートワークでチームで作業するのに役立つツールいろいろ
図1 リモートワークでチームで作業するのに役立つツールいろいろ

2. Listboxes vs. Dropdown Listshttps://www.nngroup.com/articles/listbox-dropdown/

リストボックスとドロップダウンリストを比較した記事です。

リストボックスは、1つしか選べないものと複数選択できるもの、スクロールするものとしないものに分けられます。さらに見た目も、ドロップダウンが展開した状態のようなリスト表示と、チェックボックスとがあります。

ドロップダウンリストは1つしか選択できず、スクロールするものとしないものに分けられます。

それぞれの利点と欠点の紹介と、どういう基準でどちらが使用できるかの表が参考になります。

図2 リストボックスとドロップダウンリストの比較
図2 リストボックスとドロップダウンリストの比較

3. Why editorial illustrations look so similar these days — Quartzhttps://qz.com/quartzy/1728767/why-editorial-illustrations-look-so-similar-these-days/

エディトリアルデザインに使われるイラストが最近どれも似通っている理由を開設した記事です。ベクターベースでフラットな塗り、シンプルな形状、少ない色数のイラストのことで、正式な呼び名はなくフラットイラストレーション、コーポレートメンフィスなどと呼ばれています。

理由としては、3つのTとして、テクノロジー(technology⁠⁠、テイスト(taste⁠⁠、テリブルペイ(terrible pay)が挙げられていました。

コンピューターで描くテクノロジーの要素と、ベクターアートの味わい(taste⁠⁠、そしてイラストレーターへの報酬が減っている(terrible pay)ので効率を追求するようになったのが理由ということです。

図3 エディトリアルデザインのイラストが最近どれも似通っている理由
図3 エディトリアルデザインのイラストが最近どれも似通っている理由

4. Newsletter Signup: 7 Essential Tips for Higher Subscription Rates - noupehttps://www.noupe.com/business-online/newsletter-signup-7-essential-tips-for-higher-subscription-rates.html

ニュースレター(メルマガ)の購読者を増やすためのテクニックをまとめています。

  1. フォームのデザインに注意する
  2. ニュースレターのサインアップメールを送信
  3. 入力フィールドをセグメント化
  4. コールトゥアクションを改善する
  5. 新しい購読者に報酬を与える
  6. ニュースレターに登録するタイミングの微調整
  7. フォームのA / Bテスト
図4 ニュースレターの購読者を増やすためのテクニック
図4 ニュースレターの購読者を増やすためのテクニック

5. Tips to Nailing Big Typography Designshttps://line25.com/articles/big-typography

大きなタイポグラフィを使ったデザインを効果的にするためのヒントを紹介した記事です。

大きなタイポグラフィの基準とその影響、タイポグラフィのトレンドについてまとめています。

図5 大きなタイポグラフィを使ったデザインのヒント
図5 大きなタイポグラフィを使ったデザインのヒント

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

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

Dark CSS theme generator | Night Eyehttps://nighteye.app/dark-css-generator/

ウェブサイトのダークモード用CSSを自動で作ってくれるサービスです。URLを指定するだけでCSSを生成します。見事にダークテーマを作ってくれるので驚きました。

できたCSSは表示するか、コピー、ダウンロードできます。そのCSSを適用した状態を見る機能はありませんが、ブラウザのデベロッパー機能を使えば確認できます。

ほぼ全てのウェブサイトをダークモード表示に変更する、ブラウザ拡張機能「Night Eye」と同じアルゴリズムを使っているそうです。拡張機能は有料ですが、このジェネレーターは無料で使えるのでありがたいですね。

図6 ダークモード用CSSを自動生成するサービス
図6 ダークモード用CSSを自動生成するサービス

おすすめ記事

記事・ニュース一覧