本日の GUI チャレンジでは、@AdamArgyleInk が、ユーザー フィードバックを提供するための非インタラクティブで受動的な UI のコンポーネントであるトーストの構築方法についての考えを共有します。[output] 要素、CSS グリッド、アニメーション、アダプティブでアクセス可能なコンポーネントの作成に役立つ FLIP 手法について学びます。
章:
- 0:00 - はじめに
- 0:23 - 概要
- 2:02 - [出力]
- 3:00 - レイアウト
- 4:41 - アニメーション
- 5:50 - JavaScript パート 1
- 6:55 - モーションの軽減
- 7:43 - キーフレーム
- 8:09 - JavaScript パート 2
- 10:48 - F.L.I.P.
- 14:18 - 結び
リソース:
- 関連情報 → https://goo.gle/3GghBfI
- デモを試す → https://goo.gle/3EHsuXG
- 入手する → https://goo.gle/3oykceU
- フリップ → https://goo.gle/3oz8P6D
- Paul Lewis（SuperCharged から）→ https://goo.gle/31IOFy0
その他の GUI チャレンジはこちら → https://goo.gle/GUIchallenges
Google Chrome Developers に登録 → https://goo.gle/ChromeDevs