winstrap - Microsoft社公認のBootstrapテーマ
モダンなWebサイトを実現するためにはモダンなデザインフレームワークを使うべきです。そうすることで全体の統一感が生まれ、使い勝手の良いWebサイトが生まれます。継ぎはぎでは統一感を出すのは困難です。 今回はMicrosoft公式のBootstrapテーマ、winstrapを紹介します。最近のMSらしい、モダンなWebデザインが実現します。
winstrapの使い方
スクリーンショット多めで紹介します。まずはカラーリング。確かにそれっぽいですね。
カラーリングも複数パターン用意されています。
グラデーションも細かく設計されています。
枠組みだけ。
黒バックの場合。
タイポグラフィ。
アイコン。
グリッド。かなり細かい印象です。
ボタン。
チェックボックス。ラベル全体をチェックします。
トグルスイッチ。
フォーム。
テキスト入力。
コンボボックス。
ツールチップ。
ダイアログ。
タブ。
ナビゲーションバー。
縦型メニュー。
パンくずリスト。
レーティング。
ラベル。
メディア。
メディアプレイヤー風のデザイン。
テーブル。
ページネーション。
ページャー。
ジャンボトロン。
全体としてはフラットデザインですが、枠線が強調されている分、よりシャープな印象を受けます。Windowsアプリで使ったり、Microsoft系のソフトウェアに関連したサービスではこのデザインが活きそうです。
winstrapはBootstrap用のオープンソース・ソフトウェア(MIT License)です。
winstrap winjs/winstrap: The official Bootstrap theme for Microsoft’s Modern design language