ITエンジニア/デザイナ向けにオープンソースを毎日紹介

デザインでシステムの品質が決まるわけではありません。しかし、それでも全くデザインされていないシステムよりも見た目が整っている方が安心して使えるでしょう。それは管理画面でも同様です。

通常、管理画面は利用者が限定的なため、デザインが適当になってしまいます。そんな寂しい管理画面もDevOOPSを使えば一気に見た目が向上するでしょう。

DevOOPSの使い方

こちらがダッシュボードです。
こちらがダッシュボードです。

多数のグラフライブラリに対応しています。
多数のグラフライブラリに対応しています。

Flot Charts。
Flot Charts。

Google Charts。
Google Charts。

Morris Charts。
Morris Charts。

AmCharts。
AmCharts。

Chartist。
Chartist。

CoinDesk realtime。
CoinDesk realtime。

シンプルなテーブル。
シンプルなテーブル。

サムネイルなどもあるデータテーブル。
サムネイルなどもあるデータテーブル。

キーボードナビゲーションも備えたテーブル。
キーボードナビゲーションも備えたテーブル。

グリッド。
グリッド。

フォーム。
フォーム。

見た目に統一感があって見やすいです。
見た目に統一感があって見やすいです。

ファイルアップロードなる機能も。
ファイルアップロードなる機能も。

グリッド。
グリッド。

ボタン。
ボタン。

プログレスバー。
プログレスバー。

jQuery UIとの連携もできます。
jQuery UIとの連携もできます。

アイコン。
アイコン。

こんな感じのテンプレートも用意されています。
こんな感じのテンプレートも用意されています。

フィード風。
フィード風。

メッセージ。
メッセージ。

コンタクト。
コンタクト。

商品一覧。
商品一覧。

請求書風。
請求書風。

地図表示。
地図表示。

地図の拡大版。
地図の拡大版。

シンプルギャラリー。
シンプルギャラリー。

Flickrギャラリー。
Flickrギャラリー。

タイポグラフィ。
タイポグラフィ。

カレンダー。
カレンダー。

DevOOPSには多くのテンプレートが用意されています。これらを組み合わせるだけで格好良い管理画面ができあがりそうです。Bootstrapベースなので、カスタマイズもそれほど難しくはないと思います。

DevOOPSはHTML5/JavaScript製、GPL v3のオープンソース・ソフトウェアです。

devoopsme/devoops

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2