2016年7月第1週号 1位は、ChromeのデベロッパーツールでCSSアニメーションを検証する方法、気になるネタは、Kindleが紙に近づく新機能Page Flip導入。指挟んでパラパラを再現

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

Chromeのデベロッパーツールで、CSSアニメーションを検証する方法を解説しています。

アニメーションのインスペクタを表示することでアニメーションをタイムラインで表示でき、再生したり、タイミングをコントロールしてみたりできます。

全体の再生速度をボタンで100%、25%、10%で変えられ、さらにタイムライン表示で開始点、終了点をスライドして変更したり、キーフレームを移動させることが可能です。

アニメーションごとに「アニメーショングループ」が自動で作られるところも便利です。

静的サイトのジェネレーターをまとめた記事です。

WordPressのようにデータベースを元に動的にページを生成するのではなく、データベースを元に静的なページを書き出す仕組みが今一度注目されています。

ページの読み込み速度が速い点と、セキュリティ的な心配がない点が、特に静的サイトジェネレーターを使うメリットと説明されていました。

良いWebフォームを作るためのヒントを4つ紹介しています。

GIFアニメを作るツールを3つまとめた記事です。

iOSアプリ「GIPHY CAPTURE⁠」⁠、フリーのツールで有名な「LICEcap⁠」⁠、そしてPhotoshopが紹介されています。

FAQページのテンプレートを多数紹介しています。

よくあるパターンの開閉するアコーディオンメニューばかりですし、後半の有料テンプレートは似たり寄ったりですが、参考にはなると思います。

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

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

Wunderlistはタスク管理のWebサービスです。かなり有名なサービスなのですが、なぜ今さら取り上げたのかというと、Slackと連携するところが便利だなと思ったからです。

SlackのWunderlistアプリを設定すると、タスクの追加や完了の情報をSlackと連携できるようになります。Slackからタスクを追加することもできますが、便利なのはタスク完了をSlackに通知できることです。

グループワークのやりとりをSlackで行っているケースで、タスク管理はWunderlistで行えば、タスクの追加や完了はSlackに通知されるため、Slackさえ見ていれば情報を見逃さないことになるので便利です。

Kindleに新しいブラウズ機能が追加されたとのことで動画を見てみたのですが、ちょっと予想したものとは違いました。紙の本でページをパラパラめくるのに対抗して、Kindleに登場した新機能Page Flipは、サムネイル表示が素早くスクロールでき、元の場所にもすぐ戻れるというものでした。

なるほど、紙の本のメタファーから離れての、デジタルならではの進化ですね。紙の本と似せることにこだわって、紙のめくれを再現しようとしていたことは、やっぱり間違っていたんだろうなと思いました。スキューモーフィズムからフラットデザインへの大きな流れの一例とも言えるでしょう。

あと、こういったインターフェイスがサクサク動くには、やはり電子ペーパーのKindle端末よりもタブレットやスマートフォンの方が適しているはずです。Kindle端末よりKindleアプリの機能が上になりすぎるのも、Amazonとしては悩ましいことになりそうですね。