【スマートフォン向け開発】ユーザビリティチェックリストを作ってみた
最近はスマートフォン系の開発から離れてしまっているので、感覚が鈍らないうちに（備忘録も兼ねて）スマートフォン向け開発（主にネイティブアプリ開発）におけるユーザビリティチェックリストを作ってみました。 ちなみに、このチェックリストは以下が前提となっていますのでご了承ください。 ・独自性を生み出すようなものではない ⇒現在のスマートフォンアプリのメインストリームの中で、アプリの印象をより洗練されたものにするためのポイントです。 ・案件の内容に関わらず意識すべきポイント ⇒ある程度汎用性の高いチェックリストになっているとは思います。 それでは、全てベーシックな内容ではありますが、その中でも特に基本的なものから説明していきます。 ※僕がiPhoneユーザーということもありiPhoneの画面イメージばかりが並んでいますが、全てAndroidでも使えるチェック項目です。 小さくし過ぎない、詰め込み過ぎ
立体感のあるUIが手軽に利用できるフリーUIキットまとめ「New Creative UI Kit Free Download」
TOP > Design > 立体感のあるUIが手軽に利用できるフリーUIキットまとめ「New Creative UI Kit Free Download」 webサイトやスマートフォン特有のUIデザインは、視認性とクリエイティブ性の両方が求められるクオリティのパーツ制作が必要不可欠となってきます。そこで今回は、立体感のあるUIを手軽に利用できるフリーUIキットをまとめた「New Creative UI Kit Free Download」を紹介したいと思います。 Simple UI Kit – Icon Deposit カラートーンの異なるUIキットが、いくつも紹介されています。中でも気になったものいくつかピックアップしましたので、下記よりご覧ください。 詳しくは以下 ■Vector UI Bundle – Icon Deposit シンプルなカラーリングのUIキットです。落ち着
Webサイトの制作スピードを、より向上させる目的で作られたスターターキット・99lime
結構参考になったので備忘録がてら ご紹介。Webサイトの制作スピードを より向上させるために、汎用的なUI を集めて、マークアップも綺麗な状態 で済むように設計されたスターター キット、というかフレームワークです。 制作スピードを向上させる目的で作られたHTML5フレームワークです。レイアウトだけでなく、汎用的なUIも備わっていて、class名1つ付けるだけでタブやスライドショーを実装出来るようになっています。 そういった仕様にする事で、シンプルで綺麗で可読性の高いソースを保てるように設計されていたりと、結構参考になるスターターキットですよ。フレームワークは自作してるので良い部分を組み込んでみようかなと思いました。 タブやドロップダウン、スライドショーなどを備えているだけでなく、class名1つで実装出来るようになっているので、綺麗なソースを保持する事が出来るようになっています。 いろいろ
高品質な UI や Web のデザインが短時間で作れるおススメの Fireworks 拡張機能 4つ
こんにちは、イメージ担当の長谷川です。 「品質を上げれば速度が落ちるし、速度を上げれば品質が…」 デザイナーにとってはこの品質と速度が非常に悩ましいですよね。 今回は UI や Web デザインのモックアップなどを、品質を保ったままサクっとデザインするときに役立つ Fireworks の拡張機能をご紹介します。 1. 作ったデザインを崩さずにまとめて縮小できる「Smart Resize」 Web ページのデザインデータを使ってスマートフォン用など異なったサイズのデザインを作りたいときなどに最適です。 【使い方】 インストールするとコマンドに「Smart Resize」が追加されます。 サイズ調整をしたいデザインを選択して コマンド＞ Smart Resize ＞ Attach を選択します。 後は黄色のコントロールポイントでサイズを調整するだけでテキストの改行などデザインを保ったまま自動的
iPhoneやAndroid向けのUIパターンギャラリー・Mobile Design Pattern Gallery
カテゴリがしっかり分けられていて 凄く見やすかったのでご紹介。iPhone やAndroid向けのUIパターンギャラリー です。アプリデベロッパーさんや アプリデザイナー、モバイル向けの デザインの参考にいかがでしょう。 パターンギャラリーはもうすでにいくつもありますけど、ここは特にちゃんと分けてくれているので見やすい印象でした。 左サイドに大まかなカテゴリーがあります。それぞれには更に細かいパターンに分けられています。たとえば、ナビゲーションならリストタイプ、メガメニュー、カルーセル真紀など。 こちらは検索のカテゴリ。検索ボックスや、オートコンプリート、ソート機能付きなどなど。 インビテーション・・・サイトツアーみたいなやつです。こういうのあんまり紹介されてませんよね。 パターンはその場でLightbox風に表示するのでページ推移も必要ありません。 みたいな感じのパターンギャラリーです。
jQueryベースの画像スライダー３０まとめ:phpspot開発日誌
Roundup of 30 jQuery Image Gallery/Slider Tutorials & Plugins | Lava360 jQueryベースの画像スライダー３０まとめエントリのご紹介。 画像スライダーといっても、実に様々なデザインがありますが、３０個もあれば自分の目的に合ったものが見つかりやすそうですね。 全体的にクオリティは高いようです。 昔では想像もできなかったことが実現できていることに色々と感動しますね。 関連エントリ JavaScript製の画像スライダー・ギャラリーいろいろ 画像スライダーに関することならお任せ！なjQueryプラグイン「Slider Kit」 軽量でいい感じの画像スライダー実装jQueryプラグイン「Choco-Slider」 画像切り替えがユニークな画像スライダー実装jQueryプラグイン「Coin Slider」
『iOSヒューマンインターフェイスガイドライン』はUI解説書の枠を越えている ：国内・海外情報から見える『企業のWEB活用法』：ITmedia オルタナティブ・ブログ
中小企業がITを活用して売り上げにつなげるにはどうしたらいいか？WEBマーケティングとWEB戦略コンサル実績350社50業種以上の実績とノウハウで、海外の最先端情報を中心に、噛み砕いてご紹介。 作成者：中山陽平 iOS、実質的にはiPhoneのアプリケーションを作る際に参照してくださいと言う事で配布されている「iOSヒューマンインターフェイスガイドライン（以下iOS_HIG）」 弊社のシステムを真剣にスマートフォン対応にするために読み始めたのですが、この内容が、ただのインターフェイスのガイドラインだけではなく、さらに踏み込んだ内容になっていて驚きました。 Appleのサードパーティアプリに対する姿勢、サードパーティアプリケーションがiPhoneの大きな魅力であるという認識が、このガイドラインからはにじみ出ています。 App開発者以外もぜひ見ておくべき これはぜひ、WEBに関わる方は見て頂き
40 Beautifully-Designed Navigation Menus | Vandelay Design Blog
These earth tone color palettes are perfect for a wide variety of nature-inspired designs. Use the provided hex codes to save time choosing colors.
Free PSD Web UI Element | Web Elements | Photoshop | blognews | AlexWolkov | Life & Live
Free PSD Web UI Element 41 Button, web elements, APIs PSD | Кнопки, веб элементы, программные интерфейсы PSD. Часть 41. 270 векторных иконок 270 векторных иконок для загрузки в .SVG | <noindex><a href="http://aristath.github.com/elusive-iconfont/" target="_blank" rel="nofollow" >Elusive Icons</a></noindex> Иконки на HTML/CSS Иконки на HTML/CSS | <noindex><a href="http://one-div.com/" target="_blan
iPhone用サイトを作成する際に便利なjQueryプラグイン「iPhone UI」:phpspot開発日誌
iPhone UI iPhone用サイトを作成する際に便利なjQueryプラグイン「iPhone UI」。 iPhoneアプリケーションのようなUIパーツが揃っており、PCのブラウザで見ると、iPhone枠が次のように表示され、iPhoneで見ると枠なしでそのまま動作するというものです。 PCで見ても、iPhoneで見ても同じように見れるサイトを作る際に役立ちそうです。 まだバグがそれなりにあるっぽいですが、面白い仕組みですね。 関連エントリ iPhoneのON/OFFスイッチっぽいcheckbox、radioボタン実装jQueryプラグイン「LightSwitch」 iPhoneかiPodかiPadかを調べるPHPとJSのソースコード例 iPhoneにインスタントメッセージをPHPからpushme.to経由で送るサンプル
Simple AJAX Commenting System
This time, we are making a Simple AJAX Commenting System. It will feature a gravatar integration and demonstrate how to achieve effective communication between jQuery and PHP/MySQL with the help of JSON. Note: This tutorial is quite old and doesn't work in PHP7 and above. We are keeping it online only as a reference. Step 1 - XHTML First, lets take a look at the markup of the comments. This code i
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
今時のシンプルでモダンなデザインが簡単に作れる、フリーのUIデザインPSD素材
ウェブデザインのセンスを磨こう、素敵なUIデザインのまとめ
ボタンとかフォームとかナビゲーションとかUIエレメント系PSDファイル80
IDEA * IDEA
Xcode/Interface BuilderでUI設計＋イベント処理
Engadget | Technology News & Reviews