カテゴリー:
CSS
閲覧数:751 配信日:2017-01-05 18:33
設置候補 … 15
SVGフィルタによる歪んだボタンのエフェクト
・エフェクトが希少
Bootstrap ボタンのデザイン
・何の面白みもないが、ボタンだとひと目で分かる
box-shadow の ボタン hover エフェクト
・かなり良い
アニメーション投票ボタン（pure CSS）
・希少エフェクト
・flexコメントアウトすると正常動作しないため、コード理解が必要
花火のボタン：D
・希少エフェクト
・「display:flex;」依存している
背景カラーが左右に分かれていく ／ 奥から背景をふわっと表示させる #2 ／ 要素がパタッと開く ／ キューブ状にクルッと回転する
ボタンスタイルとエフェクトのインスピレーション
シンプルなアイコンhoverエフェクト
3D swing ボタン
Erik Deiner の Twitter Button コンセプト
SVGで画面全体に斜め線や曲線を引く
「斜線」2本描画
Email Input Validation 動作 - JS 及び SCSS
Subscribe フォーム #1
Pixie Dust 入力
次点 … 2
CSSのみの「Material デザイン」アニメーションボタン
・すっきりしていて今風だが、普通の人がボタンと認識するか、若干不安が残る
ステッチ装飾のあるボタン ／ ふわっと浮くボタン
・「2-2.animationを使って常にボタンがふわふわと浮いているように見せる」は、モバイル右下へ配置すると良いかも
何かの際に参考にするかも … 2
Progress ボタン
・ブログレスバーを設置する際に参考にするかも
・ブログレスバーの進捗状況との連動の仕方は不明
Subscribe フォーム #2
落選 … 5
Pure CSS ボタン
・全体的にイマイチ
ボタンhoverエフェクトのコレクション
・使用する場面を想像できない
Squishy Toggle ボタン
・白背景では、(質感があり過ぎて)汚く見える
弾みのあるボタン
・動きは面白いが、実際に使用する場面を想像できない
斜めのストライプ
・実際にボタンを作成してみたが、期待していた程良い感じでもなかった
1次選考結果
選考総数
・24
2次選考進出
・15／24
1次選考敗退
・9／24
選考期間
・8日間
・2017-1-1 ～ 2017-1-8