綺麗なUIのサイトがサクサク組めるTwitter Bootstrapを使ったjQuery UIテーマ「jQuery UI Bootstrap」:phpspot開発日誌
綺麗なUIのサイトがサクサク組めるTwitter Bootstrapを使ったjQuery UIテーマ「jQuery UI Bootstrap」 2012年01月10日- jQuery UI Bootstrap 綺麗なUIのサイトがサクサク組めるTwitter Bootstrapを使ったjQuery UIテーマ「jQuery UI Bootstrap」 Twitter Bootstrapでデザインがあまり出来ずともTwitter風の綺麗なUIが作れる事で話題を集めましたが、jQuery UIにTwitter BootstrapのCSSでをあてはめた物が出たようです。 Twitter Bootstrapのメリットを享受しつつjQuery UIも使えてしまいます。 サンプルでは１ページにjQuery UIのウィジェットが配置されているのですが、１ページにあることで、削ったり切り貼りすることでデザ
jQueryでページ送りのインタフェースが簡単に作れる「jqPagination」:phpspot開発日誌
jqPagination, a jQuery pagination plugin (obviously) jQueryでページ送りのインタフェースが簡単に作れる「jqPagination」。 次のようなインタフェースのページ送りのインタフェースを簡単に実現できます。 クリック時にコールバックを指定して何ページ目がリクエストされたかを知ることが出来るので、指定ページにJSで飛ばすだけという流れです 実装は次のように決められたマークアップをコードして、コールバックを指定しつつ初期化するだけです。 デザイン等はCSSで調整できそうです。 標準のデザイン的にはスマホなどで使えそうなものになってますね 関連エントリ 面倒なページ分けを簡単実装できる10のスクリプト集
JavaScriptでシンセとか作るとき用のGUIライブラリ作った - aike’s blog
ブラウザ(JavaScript)で動くシンセ的なアプリを作ろうと思うとGUIコントロールの便利なライブラリがなくてけっこう困ります。jQuery UIはわりと良いんだけど肝心のノブとかスイッチとかがなかったりするし。そんなわけでウェブ楽器のGUI作成に便利なjQuery UIっぽいJavaScriptライブラリを作成しました。 こんな感じでGUIコントロールを生成できます。 // 背景パネルの表示 $('<img />').panel({ id: 'panel', image: 'images/panel.jpg', left: 20, top: 20 }).appendTo('#draw'); // ノブの表示 $('<img />').knob({ id: 'knob01', image: 'images/knob.png', left: 100, top: 80, width: 85
[CSS]hr要素をおしゃれにスタイリングする8つのテクニック
デモページ CSS3を使った8つのテクニック デモページの8つの実装方法を個別に見てみましょう。 HTML HTMLは全デモ共通で、hr要素にclass名を付与するだけのシンプルな実装です。 <hr class="style-one"> [ad#ad-2] CSS スタイルシートは各デモのキャプチャとともにご紹介。 繊細なグラデーションを使ったデザインです。 hr.style-one { border: 0; height: 1px; background: #333; background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); background-image: -moz-linear-gradient(left, #ccc, #333, #ccc); background-image: -ms-linear-gr
“Sandy Bridge”な「MacBook Air」を新旧比較（前編）
もう1つ目を引く変更点はキーボードにある。2010年発売のMacBook Airは、かつての高級路線から一転してエントリーモデル並みの価格になり、同時にキーボードバックライトなども省かれていたが、今回は全モデルでこれが復活した。周囲の明るさに応じて、自動的にキートップの文字が光るので、照明を落とした寝室などでもきちんとタイピングできる。ベッドでうつぶせになりながらノートPCを使う筆者のような人間には地味にうれしい機能だ。 キーボードは、11／13インチともに主要キーを19ミリピッチ、キートップのサイズを15ミリ正方でそろえたアイソレーションタイプを採用する。最上段のファンクションキーだけ11インチモデルと13インチモデルで異なり、前者は縦のサイズが5ミリ、後者は9ミリになる。11インチモデルのファンクションキーは一見するとかなり細いが、きちんとキーの間隔があるため、押し間違うことは少ないだ
左手で使うブラウザ用のキーボードショートカット 右手のマウスorトラックパッドをもっと便利にする | ごりゅご.com
HDDの空き容量を消費しない「スマートシンク」が利用可能になり値上がりしたDropbox Proプランをお得に購入！ トラックパッドの3本指操作をドラッグに割り当てるとすっげー快適だよ、って記事が、想像以上の反響をいただけて、もの凄く嬉しい気分になっております。 さて、そんな中3本指をドラッグに使ったら、進む戻るはどうしたらいいのか。どんな風に使ってんだおまえは、みたいな意見も頂けました。 そこは、左手でなんとかします。 左手は、キーボードショートカット用に準備しておきます。 なんかわからんけど、大抵のショートカットは左手さえあればなんとかなるのです。 左手ショートカットポジション 左手のショートカットを使うときによく使うのは「コマンドキー」と「コントロールキー」 Windowsなときも、大抵コマンドかオプション、ウインドウズキーがショートカットを使うときによく使うボタンでした。 ちなみに
スマホアプリの「使いやすさ」とは何か、を考えてみた - もとまか日記Ｚ
スマホアプリの使いやすさって、なんだろう？ 実は最近、よく考えてるテーマです。そんな感じのメモ。 「使いやすい」時、どう感じるのか まず、使いやすい！と思った時にどう感じてるのか、を整理してみると、・なんか気持ちイイ！・こりゃ簡単！・また使いたくなってくる！そして、・長く使うようになる・そのうち無意識に使うようになる つまり、使いやすさの重要なポイントとは以下。・簡単・気持ちよい 「簡単」ってなんだろう では、簡単って何でしょう？・見ただけで分かる・迷わない・（他のアプリと）操作が同じ・ボタン、機能の数が少ない・数が多いと選択、判断が入る故、難しい・５個がボーダー かも？・スーパーヒーローも基本は５人。・そういう意味では３個もアリ。・慣れたら５個以上になっても平気。・その頃の「基本の５個」はきっと空気のような存在になってる。・つまりスーパーヒーローでシーズン中盤から追加メンバが入るのは 決
Youtube動画を透過(opacity)できるjQueryプラグイン・YTPLAYER
あまり見かけないタイプのライブラリだった のでメモ。Youtubeの動画を透過させる事 が出来るjQueryプラグインです。インター フェースもクールにされて全画面に配置した りオート再生させたりも可能でIE6や7でも 一応は動作してくれます。 僕はちょっと知らないんですけど、Youtubeって普通は透過出来ない、で合ってますよね？普通に出来るならちょっと恥ずかしい記事ですけどｗ 透過だけでなく、オート&リピート再生、ミュート設定も出来て、見た目もスッキリさせてくれています。以前はYoutube動画を背景にするjQueryプラグインをご紹介しましたが、今回は透過が出来るプラグイン。いろいろ出来るんですね・・ CPUの問題は否めないとして、これはちょっと素敵なので覚えておきたいです。透過のみに関してはIE6や7にも対応していますが、Operaは透過出来ませんでした。バージョンにもよるんですか
JavaScriptでFlashみたいなタイムラインアニメーションを作るToolkit「Mashi」:phpspot開発日誌
Mashi - Javascript Timeline Toolkit JavaScriptでFlashみたいなタイムラインアニメーションを作るToolkit「Mashi」 トップページにアクセスするとわかるのですが文字や画像がいい感じにアニメーションします。 ドキュメントも比較的綺麗にまとまっています オーサリングツール等は存在しないため、使い方にはちょっとコツが必要かもしれませんが、iOS端末用に、よし、Javascriptでやろうっていうような時に使えるかもしれません。メジャーになってくればコードを吐いてくれるオーサリングツールなんかも出来るかもしれませんね。 関連エントリ もうFlashは買わなくていいかもしれないデザイナー向けフリーのFlashアニメーション作成ツール「Giotto」
これは斬新！木のUIで訪問者を驚かせよう、なUIパーツ:phpspot開発日誌
Got Wood? UI Design Elements | MediaLoot これは斬新！木のUIで訪問者を驚かせよう、なUIパーツ。 木のiPhoneケースや木のキーボード等、木とITを絡めるとなぜかインパクト絶大ですが、木のUIキットを発見しました。 これでページデザインをすれば自然の温かみによってリラックスした気分でページを使えるのかも。 基本的なUIパーツはそろっているので頑張ればページに適用できるはず。 レイヤーに綺麗に分かれているのがいいですね。 見ていてなにか作りたくなりました。 関連エントリ かなりクールなPhotoshop用フリーUIキット-PSDファイル50個 モックアップ作成用PhotoshopのUIキット「Soft UI Kit」 ブルーが美しいモダンなＵＩキットPSD 色々と使えそうなフリーのUIエレメントPSD７０種
色々と使えそうなフリーのUIエレメントPSD７０種:phpspot開発日誌
70 Free PSD Web UI Elements For Designers | Free and Useful Online Resources for Designers and Developers 色々と使えそうなフリーのUIエレメントPSD７０種。 とりあえずモックを作ったりするような場合や実際にデザインに応用して使ったりして作業を効率化できそうです。 動画プレイヤーのUI アバターアイコン iTunesのUI。iTunesの重要度は年々あがってきていると思いますが、WEBページ内にイメージを組み込む際などに 名刺っぽいUIにリボンを付けたおしゃれなオブジェクト。アイテムのダウンロード部分なんかに設置でクリック率が上がるのかも windows7のタスクバー。色々あります おなじみ料金表 その他、画面パーツを色々とまとめたUIパーツ集 関連エントリ かなりクールなPhotos
InfoTech.fmfamily.net - WPFでデータを特定フォーマットで表示する
WPFでTextBoxやDataGridなどに表示するデータをある形式で表示させたい場合 どのようにすればよいかについて調べました。 たとえば、何かの金額を表す数値データをアプリケーションが持っていて、 これを表示するときには３桁ごとにカンマを入れたい場合の方法についてです。 次の方法で実現可能です。 １．C#コード側でIValuceConverterインタフェースを実装したクラスを作成 ２．XAML側で、このクラスをStaticResourceとして定義 ３．目的のコントロール(TextBoxなど)のBinding内にConverterプロパティの形で 上記リソースを指定 となります。 手順１の例： // 金額コンバータクラス // パラメータで渡した書式にしたがって数値をコンバートするクラス public class DecimalConverter : IValueConvert
Office TANAKA - Excel VBA Tips[ツールバーでテキストボックスを使う]
↑こんな感じのツールバーです。もちろんテキスト ボックスには自由に文字列を入力・編集できます。 ちなみに、同じようなやり方で、ツールバーにコンボ ボックスを配置することもできます。 興味のある方は「ツールバーでコンボ ボックスを使う」をご覧ください。 また「メニューバーに独自のメニューを追加する」と同じ方法で、ツールバーにメニューを追加することも可能です。 まず新しいツールバーを作ります。VBA を使って自動的に作ることもできますが、これは手作業で作った方が簡単です。ここでは[検索ツールバー]という名前のツールバーを例にして解説します。 【手作業で新しいツールバーを作る】 1. [ツール] - [ユーザー設定]を実行する。 2. [ユーザー設定] ダイアログ ボックスの [ツールバー] タブで [新規作成] ボタンをクリックする。 3. [ツールバー名] ボックスに「検索ツールバー」と入力
第4回 “見た目”を決めるコントロール・テンプレート
第4回 “見た目”を決めるコントロール・テンプレート：連載 WPF／Silverlight UIフレームワーク入門（1/3 ページ） WPF／Silverlightの外観を簡単に変更できるコントロール・テンプレートとは？ さらにUIフレームワークのUI要素の階層をまとめる。連載最終回。 連載目次 前回に引き続きWPF UIフレームワークの“見た目”に関する機能を説明する。連載最終回となる今回は、コントロール・テンプレートを紹介したいと思う。 ■コントロール・テンプレート これまでのWindowsフォームでもそうであったように、WPF UIフレームワークのコントロールの“見た目”は、プロパティ設定により変更できる。例えばButtonコントロールの場合であれば、背景色はBackgroundプロパティ、枠線の色はBorderBrushプロパティで変更可能だ。 しかしながらWindowsフォームの
シニア層のためのWebサイトユーザビリティ
2013年3月23日 ユーザビリティ 以前「笑っていいとも！」の山口智充さんのコーナーを見ていて、ちょっと驚いた事があります。20代～60代の女性の必需品をランキングしたもので、40, 50代女性では5位圏外だった「パソコン」が60代で3位にランクイン。シニア層のインターネット利用率は年々高まってきているのはニュース等で読んでいましたが、これを見てなんだか実感しました。という事で今回はシニア層のWebサイト設計について考えてみたいと思います！ ↑私が10年以上利用している会計ソフト！ 上記「笑っていいとも！」の件で興味を持った私は、シニア層のインターネット利用方法なんぞを調べていたところ、丁度私の母親が「インターネットで買い物がしたい」と言ってきました。彼女は海外に住む私と連絡をとるためにメールやSkype等を使う事ができるので、ある程度インターネットについて理解しているのだと思っていまし
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Path 2.0 Flyout Menu using CSS by Tunghsiao Liu
ごりゅご.com
SketchUp Ruby Code Editor • [as]
CKEditor Ecosystem | CKEditor.com
ビルドのコマンドとプロパティのマクロ