今年気になったハイクオリティなデザインUIキット − 2014 - NxWorld今年（2014年）で見かけて気になったものやダウンロードしたデザインUIキットのまとめです。 そのままデザイン素材として使用するだけでなく、パーツやカラーの組み合わせ方を参考にしたり、どのようなレイヤースタイルで作られているかなど制作時のヒントに繋がる場合もあると思います。 紹介しているUIキットを使用する際は、ライセンス等は各自で再度確認してください。
WebアプリケーションにリッチUIをもたらす高機能JavaScriptライブラリ「Wijmo」（ウィジモ）
はじめに 一般にアプリケーション開発環境や実行環境において、標準で備える基本的な機能よりも高度な機能を備えるソフトウェア部品（コンポーネント）が有料で提供される場合があります。開発者はこれらのコンポーネントを活用することで、より少ない工数で品質の高いアプリケーションを作成することができます。グレープシティは.NETやJavaなどの環境に向けてこのようなコンポーネントを提供しています。 今回紹介する「Wijmo（ウィジモ）」は、同社がHTML/JavaScript環境に向けて提供しているJavaScriptライブラリです。JavaScriptライブラリとして広く活用されているjQueryやjQuery UI、jQuery Mobileをベースにして、WebサイトやWebアプリケーションで活用できる高機能で多様なUI部品を利用できます。 本記事ではこのWijmoについて、まず機能やライセンス形
いざというときに便利そうな、ちょっと変わった珍しいアイコンセット - NxWorld
汎用性が高いUIアイコンなどと比べると使う場面は少ないものの、いざ使いたいときに便利そうなものやあまり見かけないタイプだと個人的に思ったアイコンセットのまとめで、過去に紹介してきたものをひとまとめにしました。 既に公開・配布終了しているものも一部あるのですが、ファイルダウンロード自体はできなくともデザイン的にはそのまま参考になることもあるので、そういったものはキャプチャが小さめではありますがリンク設定のみ解除する形で紹介します。 紹介しているアイコンを使用する際は、ライセンス等は各自で再度確認してください。 リンクが未設定で配布形式も記載されていないものは公開・配布終了しているものです。
Android Interaction Design Patterns |
Add a pattern! Missing a pattern? We invite you to add your patterns. Read more This is androidpatterns.com, a set of interaction patterns that can help you design Android apps. An interaction pattern is a short hand summary of a design solution that has proven to work more than once. Please be inspired: use them as a guide, not as a law.
VoiceOver解説iOS7用-1基本
VoiceOver（ボイスオーバー）は画面を見なくても操作を可能にする機能です。 すべての iPad と iPhone と iPod touch で利用可能です※ VoiceOver は（1）画面の自動読み上げ と（2）通常とは違うジェスチャー の二つで画面を見ない操作を実現しています。 VoiceOver をオンにするとボタンなどUI要素を一度に一つ選択します。 選択したUI要素がある場合UI要素を囲む「カーソル」を表示します。 選択状態がかわった時に新しいUI要素を読み上げます。 ※iPhone3GS以降のすべてのiPhone と iPod touch で利用可能です オンにすると操作が変わってしまうVoiceOverにはちょっとした誤解もあるようです。 ちなみに Mac OS X ではどのMacでもVoiceOverが利用可能です。（10.7から日本語対応） 画面が消えるのはバグ？
青森で話したＵＸの大事なコト : could
UX講演 青森で話したＵＸの大事なコト 「UX実現には何をしなければいけないの？」と考える方もいると思います。デザインそのものにも言えますが、UX もある特定の作業と結びつけることは出来ませんし、そう解釈することでビジョンを共有するというもっと大事なことが抜けてしまう可能性があります。 先週7月17日、青森のほうで UX をテーマにした講演をしました。青森は CSS Nite AOMORI 2007 以来、毎年来青しているので「訪れる」というよりかは「戻ってきた」というイメージがしますね。2008年前はWebマーケティング、そして2009年はコンテンツ戦略について話をしました。来青経験はあるものの、ほとんどのセミナーが講演のみでしたが、今回はセミナーとワークショップをワンセットにしたイベントでした。 UX は概念的な説明になりがちですが、講演で解説した道筋を、続くワークショップで具体的に体
iPhone向け最適化Webサイトを構築するjQueryライブラリ·jQuery iPhone UI MOONGIFT
jQuery iPhone UIはHTML/JavaScript製のオープンソース・ソフトウェア。iPhone用のWebサイトを構築するニーズが増えてきている。既に幾つかテンプレートもリリースされており、それらを使えば最適化されたインタフェースのサイトが作りやすくなる。 アイコンリスト そうしたライブラリを使う時に重要なのが、どれくらいの機能に対応しているかだ。単純なリストはもちろん、プロフィールページ、画像付きリスト、フォームなど多数のニーズがある。その一つ、JavaScriptを使ったパターンに適合できそうなのがjQuery iPhone UIだ。 jQuery iPhone UIの特徴は名前の通りjQueryを使っていることだろう。同種のライブラリとしてjQTouchがあるが、あちらはがちがちに固まっている雰囲気があるがjQuery iPhone UIは切り離して使えそうだ。HTML
CSS3だけでWebサイトのUIをMacPro的なメタル調にしてみた
百聞は一見にしかず。デモこのエントリーはIEだと面白くないですよ! 文字サイズを大きくしたり小さくしたり、キャレットで文字列を選択してみたりして、これが画像でないか確めてみましょう。一切画像ファイルは使ってないよ! <2010/05/28 13:00追記> Chromeだとwindow.onloadイベント処理が動作してないようなのでハンドラをonmouseoverに変更。マウスポインタを重ねるとloading...部分が動作するはず I ♥ Internetloading... Profile Blog Twitter Bookmark 趣旨見せてもらおうか、W3Cの新しいCSSの性能とやらを 先に結論無理にすべてCSS3だけで表現を完結させようとすればするほど一昔前のブラウザ別ハックみたいな事しなきゃいけなくなりますよ。 ちなみにBloggerにデモ用に直にHTML記述してみたんだけど
大辞林.app のような UI のサンプル「FlipCardNavigationView」を公開しました。 - 24/7 twenty-four seven
kishikawakatsumi/FlipCardNavigationView · GitHub 西東京 iPhoneDev 勉強会にて、「PhotoFlipCardView」について、「画像の代わりに普通のビューを使うことはできないか」という指摘がありましたので、作ってみました。 このような画面が作れます。 やはり使い方はほぼ、UITableViewと同様です。 thumbnailView = [[FlipCardView alloc] initWithFrame:contentView.frame]; thumbnailView.delegate = self; thumbnailView.dataSource = self; [contentView addSubview:thumbnailView]; [thumbnailView release]; 実装すべきデリゲートメソッドは
jQueryを使ったWYSIWYGなエディタ·elRTE MOONGIFT
elRTEはJavaScript製/jQueryプラグインなオープンソース・ソフトウェア。Webベースでコンテンツを作成したり、編集する際に取り得る手法は幾つかある。例えば一定の記法に沿って書くことでHTMLにコンバートして表示するもの。もう一つはWYSIWYGなエディタを用意してその場で編集するというものだ。 jQuery UIを使っている WYSIWYGエディタであればリテラシーが高くないユーザであっても、リッチなコンテンツの編集が可能になる。CKEditorをはじめとして幾つか有名なソフトウェアはあるが、ここで紹介したいのはelRTEになる。 elRTEはテキストエリアの上にツールバーを表示するタイプのWYSIWYGエディタで、jQuery UIを使って作られているのが特徴になる。jQueryを使っているので、カスタマイズが容易に行えそうなのが魅力だ。ベースのままでは提供されない機能
WEBアプリケーション作成に使われる４３のコントロールパターン:phpspot開発日誌
43 Essential Controls for Web Applications | UX Booth WEBアプリケーション作成に使われる４３のコントロールパターンがまとまっています。 ４３のパターンが網羅されているので、部分的に、どういうインタフェースが良いか？という点について迷った際にエントリを眺めるだけで参考になる部分がありそうです。 オートサジェスト カルーセル カレンダー、スケジュール グラフ、チャート コンボボックス スライダ ４３と言わずもっとありそうな気もしますが、ある程度のパターンを知っておき、適材適所のUIを考えてユーザビリティを上げるのに役立てることが出来そうですね。 それぞれのUIにも沢山のインタフェースがあると思いますが、その場合は「パーツごとのデザインが盛り沢山で参考にできるPattern Tap」で紹介したPatternTapなどを更に参考に出来そうです
エンジニアにもわかる「ユーザーインターフェース設計」
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに 島津悠樹と申します。Yahoo! JAPANのソーシャルメディア系サービスの開発・ユーザーインターフェース（以下UI）設計を担当しています。私からは「エンジニアにもわかる『ユーザーインターフェース設計』」と題し、エンジニアのみなさまに考え方のヒントとなるようなネタをお届けします。 エンジニアの方々にとって、UI設計は、おもしろそう、けれど、どこかとっつきにくい......、そんな印象を持っておられるのではないかと思います。 私も以前はそう思っていました。ですが、とっつきにくさを理由にUI設計をやらないのはもったいない、という思いで試行錯誤した結果、なんとか、UI設計のお仕事をいろいろ担当させていただくことができるようにな
穴埋め式のユーザー登録画面 | SIMPLE*SIMPLE
ちょっと素敵。穴埋めの試験に答えるようにユーザー登録ができます。 ↑ 「ユーザー名はこれで、パスワードはこれ、ちなみに私の名前は・・」なんて具合です。 実際に動作している様子は以下からどうぞ。 » Sign up on Huffduffer
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザイン仕様書(ガイド) の書き方(初歩用)
TechCrunch
IDEA * IDEA