Scooter - Dropbox社製のデザインフレームワーク
企業でWebサービスを作る際に、決まったデザインフレームワークがあると全体的に統一感が出て、かつデザインに対する悩みが少なくなるのが利点です。その結果、開発がスムーズに進むことでしょう。 今回はその一つ、Scooterを紹介します。作成したのはDropbox社になります。
Scooterの使い方
ScooterはSCSSで作られているので変数やMixinなどが定義されています。実際のデザインについて紹介します。まずはグリッド。
写真と説明。
リスト。
右寄せ。
アラート。
ボタン。
吹き出し付き。
フローティングカード。
フォーム。
アイコン。
こんな感じで文字だけのアイコンも表現できます。
モーダル。
ツールチップ。
ラベル。アイコン付きなのが良い感じ。
塗りつぶしたラベル。
タブ。
カレンダー。
Scooterはデザインはもちろんのこと、カラーリングにもDropboxっぽさが溢れています。ScooterをベースにすることでDropboxを使っているアプリの良さが出るかも知れません。また、Scooterをベースにして自社のデザインベースを作っても良いでしょう。
ScooterはHTML5/CSS3製、MIT Licenseのオープンソース・ソフトウェアです。