2017年5月第3週号 1位は、テーブルを操作するためのUIパターンいろいろ、気になるネタは、Hulu、リニューアルでURLをhappyon.jpに変更

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

テーブルを操作するためのユーザーインターフェイスのパターンをまとめた記事です。アニメーションGIFで操作を紹介していてわかりやすいです。

テーブル内の情報をフィルタリング、並べ替え、比較などを行うUIの例が網羅されており、クライアントにも開発者にも便利だと思います。

それぞれの実装方法には触れられていませんが、その機能の呼び名はわかるのであとは検索して探せばいいでしょう。

モバイルアプリの5つの基本的なナビゲーションパターンを調べ、それぞれの長所と短所を説明しています。

ワイヤーフレームを作るステップをなくすことを推奨する記事です。

ワイヤーフレームの問題点として以下の3つを紹介しています。

そして、ワイヤーフレームの段階をなくす方法を、6つのステップで解説していました。

複数人でデザイン作業を行う場合に使えるデザインツールとして、FigmaとSketchを比較して紹介しています。

Sketchは、InVisionのCraftプラグインとの組み合わせと、バージョン管理システムのGitLabとの組み合わせで使う場合とを解説していました。

ミニマルなWebデザインのギャラリーです。優れたデザインの15個のサイトを紹介しています。

本当に必要な要素に絞った上で、空白を慎重に利用して明確なタイポグラフィで読みやすく設計したミニマルなデザインは、一見簡単に見えますが本当に重要な要素が何かを判断するのは難しいとのことでした。

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

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

Archetypeは、テキスト周りのCSS設定をプレビューを確認しながら簡単に行えるサービスです。フォント、フォントサイズ、行間などを設定して、CSSを生成できます。

フォントサイズを決める際、h1はいくつでh2はいくつ…と決めていくのではなく、指定した比率でサイズが変化しているテキストの一覧を見て、このサイズをh1にしてこのサイズをh2にして…と当てはめていくところが良いと思いました。

フォントはGoogleフォントから選べて日本語フォントはリストにありません。ダミーのテキストももちろん英語なのですが、これは日本語テキストに打ち変えることも可能でした。

HuluがリニューアルにともないURLを「happyon.jp」に変更したそうで、「⁠なぜ？」「⁠URLがダサい」などの声が上がっています。わたしはHuluからのメールで知ったのですが、ネットニュースで確認するまでフィッシングメールか何かかと疑いました。

URLを変更するという異例の発表に、日本独自の展開を進めて将来的には Huluブランドを手放すのではないかという憶測の記事が出回り、日本版の運営元がウワサを否定するという一幕もありました。

URLが変わることでブックマーク変更や再ログインが必要となり、機会損失につながりかねないとも思えます。でも、月額サービスなので解約するにもログインしないといけませんし、アプリの場合はアップデートすればいいわけなので、それほど問題ではないのかもしれませんね。