Ready-to-use foundational React components, free forever.
Ready-to-use foundational React components, free forever.
Googleが先日発表したAndroid Lで使われる新しいUX「Material Design」で採用されているようなタップすると波紋のように円が広がるエフェクトを実装するテクニックを紹介します。 タップやクリックでよく見かけるのは、押した感じにへこむエフェクトでしたが、この波紋はフラットにあっててなかなかいいエフェクトですね。 Material Design 波紋状のエフェクトのコードは、下記のようになります。 HTML div要素で矩形のボタンを作成します。ラベルはスタイルシートのcontent属性で配置しています。 <div id="button" class="android-btn"></div> <div id="button2" class="android-btn ink"></div> CSS エフェクトのアニメーション、ボタンのサイズや波紋の大きさは、スタイルシートで
グーグルのMaterial Designってどんな意味があるの?2014.06.27 12:00 福田ミホ あらゆる端末に入り込むグーグルの戦略がデザインに。 Google I/Oで、新たなデザイン言語Material Designが発表されました。これはグーグルとしては初のデザイン・マニフェストで、彼らがユーザと端末の対話についてどう考えているかが表れています。どんな考え方なのか、読み解いてみます。 Androidの見え方 まずわかりやすいところからいきましょう。Material Designでは、アプリの外観について一連のルールが設定されました。Androidのグラフィックレイアウトを簡素化・標準化し、たとえばアプリのコンテンツから色を選択するパレットツールを作ったり、グーグルの無料フォントRobotoをよりクリーンにアップデートして幅広い端末で見やすくしたりしました。 さらに意外と大
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く