最近のWebデザインで採用されているページレイアウトやUIの新常識がチェックできる素材のまとめ
最近のWebのUIはフラットデザイン・Material Designが着実に進化し、シンプルでコンテンツにフォーカスされたデザインが定着してきました。テキストは読みやすく、写真はより大きく使用されています。レイアウトは縦長型やカード型の人気が高く、デスクトップでもスマホでもスクロールを前提にしたデザインが主流となっています。 最近のWebデザインで採用されているページレイアウトやUIの新常識がチェックできる素材やプレビューを紹介します。 Boring Cards UI Kit PSD、個人・商用利用無料。 Bootstrap 4でも新しいコンポーネントとして注目されているカードを使用したUIキット。黄金比をベースにしたデザインはさまざまなサイズ・カラーで展開することができます。
Webページやスマホアプリの洗練された新しいUIをチェック！ BootstrapのテーマやAI, PSD素材のまとめ
Material Designを取り入れたBootstrapのテーマ、小さいGUIに魅力がたくさん詰まっているApple Watch、Appleのこれからの主力となるiOS 8のUI、進化して使いやすくなったフラットスタイルのコンポーネント、ユーザーに操作の楽しさと使いやすさを与えるさまざまなアニメーションなど、新しいUIを体験できる素材を紹介します。 新しいモノって見るだけでも、ワクワクしますよね。 Material Design for Bootstrap Material Design for Bootstrap -GitHub Googleが提唱する新しいUX「Material Design」をモチーフにしたBootstrap 3用のテーマ。 ナビゲーション、パネル、スライダー、ボタン、テーブル、フォーム、アイコン、タイポグラフィなど、さまざまなUIエレメントが揃っています。
Bootflat - フラットUIで格好いいBootstrapテーマ！ MOONGIFT
創造意欲がかき立てられますよ！ Boostrap臭を嫌って導入に踏み切れないという方は多いですが、それもあって多彩なテーマが開発されています。それらと入れ替えると、イメージががらっと変わって見えるはずです。 今回は最近流行のフラットUIを取り入れたBootflatを紹介します。フラット＝角張っているというイメージも壊してくれる素敵なテーマです。 Bootflatのスクリーンショット 今回はスクリーンショット多めで紹介します。 基本カラー。パステル系ではっきりとしていますね。 まずはボタンとボタングループ。 ボタン＋ドロップダウン、ラベル、バッジ、ツールチップなど。 ドロップダウンはもちろん階層対応です。 フォーム。 フォームの横にドロップダウンを付けることもできます。何かと応用できそうですね。 アラート。 タブ。4辺全てに対応しています。 ナビゲーションバー。 パン屑、通知、プログレスバー
テーブルに検索、ソート、ページ分け機能をつけて便利にしてくれる「Dable」:phpspot開発日誌
Dable テーブルに検索、ソート、ページ分け機能をつけて便利にしてくれる「Dable」 依存ライブラリがゼロなのも使いやすく、Bootstrapなサイトでも使えるスタイルが入ってます。 以下がBootstrapなサイトでも使えるスタイル。 残念ながらレスポンシブには非対応。 ライブラリを配布する場合は、Bootstrapでも使えてレスポンシブだとライブラリの価値が上がりますね。 関連エントリ BootstrapベースのフラットUI実装フレームワーク「Furatto」 Bootstrapのselectをカッコよくできる「Bootstrap-select」 BootstrapをベースとしたフリーのUIKit「Flat UI」 Twitter BootStrap に追加できる５つのコンポーネントパック「FuelUX」 BootStrapのフォーム入力をもっと便利にするための「Bootstrap
FlatなUIが美しいJSレスなUIライブラリ「TopCoat」:phpspot開発日誌
TopCoat FlatなUIが美しいJSレスなUIライブラリ「TopCoat」。 デスクトップ、モバイル対応でレスポンシブ、CSSで作られたUIライブラリです。 Bootstrapよりフラットなデザインが特徴でしょうか。Bootstrapのライバルとなるような物が出てきて、それぞれよい面を取り入れていってほしいですね 関連エントリ フラットで綺麗なUIライブラリFlatUIのモバイルテーマ「FlatUI」 30以上のリッチコンポーネントが詰まったHTML5のUIライブラリ「Zebra」 Bootstrapに追加で使えるjQueryベースのUIライブラリ「w2ui」 jQuery UI をタッチイベントに対応させるライブラリ「jQuery UI Touch Punch」 BootstrapをベースとしたフリーのUIKit「Flat UI」
BootstrapのUIをWindows8のModern UI Style風に·BootMetro MOONGIFT
BootMetroはBootstrapをベースにWindows8のModern UI Style風にしたソフトウェアです。 ついにWindows8が発売になりました。機能的なことはもちろん、注目を集めているのはModern UI Style（旧Metro UI）でしょう。そんなUIをWeb上でBoostrapをベースに作られたのがBootMetroです。 デモサイトです。確かにWindows8 UI風です。 設定は右側に表示される仕組みです。 テーマを変更できます。 メニューは左側。 グリッド表示。 正方形のタイル表示。 テーブル。 Bootstrapの各種JavaScriptライブラリにも対応しています。 タブ表示。 追加機能は下に表示されます。 アイコンは多数用意されています。 BootMetroはBootstrapの機能性、汎用性の高さとModern UI Styleのシンプルな表示
BootstrapのUIがドラッグアンドドロップだけで組める！最速でウェブのユーザーインターフェースが構築できるエディタ「Jetstrap」 - Chrome Life
先日、Twitter Bootstrapが2.1.1にアップデートされました。 Bootstrapが2.1になって大幅に機能も追加され、ウェブサイトを構築する上で必要なUIがほとんど揃っている感じがします。 最近では、スタートアップ系のWebサービスを作る人にとっては、Bootstrapが必要不可欠な存在になりつつあります。 とはいっても、Bootstrapに慣れていない人が、実際にページを作っていくにはコンポーネントのタグ構造やClass名を意識して作らないといけないので、少し難しい部分もあります。 Bootstrapのサイトを見ればマークアップのサンプルがあるので、それを見ながら作れば良いのですが1つ1つ確認しながら行うのも手間です。 そこで今回ご紹介するのが、BootstrapのUIをドラッグアンドドロップだけで簡単に組めるエディタ「Jetstrap」です。 jetstrap - B
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Bootstrapのように多数のコンポーネントが詰まったUIツールキット「Titon Toolkit」:phpspot開発日誌
【Photoshop入門】Webデザインをはじめよう！第1回 デザイン前に覚えておきたい環境設定とレイヤー機能 - Adobe Blog
IDEA * IDEA
Twitter BootstrapをベースとしたフラットなデザインのUIキット・Flat UI