2次選考

Webデザイン

カテゴリー: ボタン  閲覧数:720 配信日:2017-01-08 22:34


設置候補 … 15


SVGフィルタによる歪んだボタンのエフェクト
・SVGエフェクトはqualityが高い

Bootstrap ボタンのデザイン
・定番のデザイン
・相対評価によりここで落選
・面白みがない
・新しさがない

box-shadow の ボタン hover エフェクト
・現時点の設置候補No.1

アニメーション投票ボタン(pure CSS)
・安定の設置候補

花火のボタン:D
・相対評価によりここで落選
・使い所がちょっとだけ難しいかも

背景カラーが左右に分かれていく / 奥から背景をふわっと表示させる #2 / 要素がパタッと開く / キューブ状にクルッと回転する
・相対評価によりここで落選
・普通の人にはボタンだと、もしかしたら分かり辛いかも
・アニメーションは面白いが、何度も試す際はウザくなるかも

ボタンスタイルとエフェクトのインスピレーション
・qualityは高い

シンプルなアイコンhoverエフェクト

3D swing ボタン
・相対評価によりここで落選
・悪くはないが、決め手に欠ける

Erik Deiner の Twitter Button コンセプト
・相対評価によりここで落選
・悪くはないが、毎回パカパカ開閉するのも面倒な気がする

SVGで画面全体に斜め線や曲線を引く

「斜線」2本描画
・相対評価によりここで落選
・悪くはないが、決め手に欠ける

Email Input Validation 動作 - JS 及び SCSS
・quality高い

Subscribe フォーム #1
・相対評価によりここで落選
・悪くはないが、同じ入力フォームなら、「Email Input Validation 動作 - JS 及び SCSS」の方が良い

Pixie Dust 入力

週間人気ページランキング / 5-13 → 5-19
順位 ページタイトル抜粋 アクセス数
1 RGBの種類 / ビットカラー | RGB(色) 5
1 「属性」「プロパティ」「アトリビュート」の違い | CSS 5
2 鉄道会社毎のカラーコード | カラーコード(色) 4
2 Chromeでmhtml保存を選択できなくなったので、拡張機能「Save Page State」を導入 | Chrome 拡張機能 4
3 Design 0 3
3 ICCプロファイル | カラーマネージメント(色) 3
3 CSS 「id」「class」名 に関する調査履歴 1 | 命名規則(コーディングルール) 3
3 textareaのスクロールバーが横へはみ出す場合は、「box-sizing:border-box;」を指定する | CSS 3
3 金融機関ブランドカラー / コーポレートカラー | カラーコード(色) 3
3 HSV → RGB 計算方式の違い | 色変換(色) 3
3 アイコン | 3系(Bootstrap) 3
3 ドロワーメニューが表示されない理由 | モバイルデザイン(デザイン) 3
4 RGB ⇔ Lab | 色変換(色) 2
4 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 2
4 画像縦横比の問題 | 画像 2
4 画像大きさ | 他サイト調査(HTML) 2
4 「Google Chrome」を再起動するためには「chrome://restart」へアクセスします。 | Google Chrome(ブラウザ) 2
4 Consider using 'dppx' units, as in CSS 'dpi' means dots-per-CSS-inch, not dots-per-physical-inch, so does not correspond to the actual 'dpi' of a screen | Google Chrome(ブラウザ) 2
4 キャラクター無料作成ジェネレーター / FLASH / オンラインサービス | イラスト参考(デザイン) 2
4 作成した素材がどうしても見つからないときは、「png形式」を疑ってみる | 画像 2
2026/5/20 5:05 更新
指定期間人気ページランキング / 2020-5-30 → 2026-5-19
順位 ページタイトル抜粋 アクセス数
1 RGB ⇔ Lab | 色変換(色) 8942
2 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 4628
3 Design 0 4149
4 血の色 / #b30000 / #360800 / #ff0000 | カラーコード(色) 3801
5 RGBの種類 / ビットカラー | RGB(色) 2802
6 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2792
7 「bgcolor」「background-color」「background」の違い | CSS 2106
8 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 2102
9 金融機関ブランドカラー / コーポレートカラー | カラーコード(色) 1988
10 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 1892
11 16進数カラーコード / 2進数 1891
12 「:hover」「z-index」を組み合わせて使用すると、正常動作しないことがある | z-index(CSS) 1721
13 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 1705
14 「属性」「プロパティ」「アトリビュート」の違い | CSS 1663
15 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能(ブラウザ) 1570
16 「Bootstrapデザイン」✕「グラフ」 | 2系(Bootstrap) 1539
17 「東京都」のカラーコード取得は難しい | カラーコード(色) 1452
18 Chrome でキャッシュを効かさない | Google Chrome(ブラウザ) 1399
19 「Chrome拡張機能」開発中に遭遇したエラー | Chrome 拡張機能 1254
20 「西武鉄道株式会社」のブランドカラーは、3色(#3366CC、#66CCFF、#33CC66) | 色 1241
2026/5/20 5:05 更新