タグ

UIに関するmikage014のブックマーク (163)

  • モバイルアプリ用UIフレームワークの簡易比較 - Qiita

    今回はモバイルアプリ作成時に使用できるUIフレームワークの違いや特徴を(大雑把に)まとめてみます。※あくまでも個人的な意見です。 対象のフレームワークは以下の4つです。 jQueryMobile:http://jquerymobile.com/ Ionic:http://ionicframework.com/ OnsenUI:http://ja.onsen.io/ Famo.us:https://famo.us/ 上記4つはまず2つに大別できます。 すなわち、jQuryMobile or その他(Ionic, OnsenUI, Famo.us)です。 jQueryMobile or その他のフレームワーク この2つはどちらもスマートデバイス用アプリ向けUIの作成を目的としていますが、主な違いとして jQueryMobileはWebアプリ用のUIの作成を主目的としており、Ionicなどはハイ

    モバイルアプリ用UIフレームワークの簡易比較 - Qiita
    mikage014
    mikage014 2015/06/02
    Ionic / Onsen UI / Famo.us
  • よくわかるマテリアルデザインの設計コンセプト | fladdict

    iPhoneAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた

    よくわかるマテリアルデザインの設計コンセプト | fladdict
  • UIデザイン時の「ユーザーの使いづらい」には2パターンある。350万ダウンロードの家計簿アプリ「Zaim」が教える、UI改善の失敗談。 | アプリマーケティング研究所

    UIデザイン時の「ユーザーの使いづらい」には2パターンある。350万ダウンロードの家計簿アプリ「Zaim」が教える、UI改善の失敗談。 今回は350万ダウンロード突破、家計簿アプリの「Zaim」さんにお話を伺いました。ユーザーが伸びたタイミングや、UI改善の失敗談など。 ※株式会社Zaim 代表取締役 閑歳 孝子さん。 「Zaim」の近況について 「Zaim」のユーザー数は今どのぐらいですか? 閑歳: 2011年7月にリリースして、350万ダウンロードを超えています。OSで言うとiOSの方が多いですが、最近はAndroidも伸びています。今も広告費は使っていません。 今までに、ユーザーが大きく伸びたタイミングはありますか? 閑歳: 去年はダウンロード数がグッと伸びた印象があります。2013年の終わり頃から、スマホをみんなが当につかうようになって、すごく高齢者と若年層が増えました。 データ

    UIデザイン時の「ユーザーの使いづらい」には2パターンある。350万ダウンロードの家計簿アプリ「Zaim」が教える、UI改善の失敗談。 | アプリマーケティング研究所
    mikage014
    mikage014 2015/05/20
  • 田舎暮らしのためのアプリUIを考える - Intelligent Technology's Technical Blog

    こんにちは。中山です。 先日、WIRED.jp に以下のような記事がありました。 この記事で紹介されているアプリUI(ユーザインタフェース)のコンセプトでは、二指、三指、ドラッグの方向など、「画面へのタッチの仕方」を変えることで、「画面を見ることなく」、さまざまな機能を呼び出すことができるようになっています。 ・・・ クレンのコンセプトにおいて、タッチスクリーンの画面は、メニューやボタンで区分けされていない。どこにでもタッチしてよい。すなわち、各種の制御は、タッチの仕方によって行うのだ。 2の指で上方向にドラッグすると、音量を上げられる。 3の指でドラッグすると、オーディオ・ソースの変更が可能だ。4なら車内温度を、5なら空気の流れを制御できる。 ・・・ これ、なんで今まで思いつかなかったのだろう!と思ってしまいました。 私自身、毎日の通勤で、自動車を運転しています。 やはり運転

    田舎暮らしのためのアプリUIを考える - Intelligent Technology's Technical Blog
  • ゲームUIブログ

    Search for: Cancel 異世界グルメ堂 異世界転生×モンスター飯 超次元彼女: 神姫放置の幻想楽園 ビックリマン・ワンダーコレクション 星になれヴェーダの騎士たち テンペスト 機兵とドラゴン サバイバーガールズ パンドラノヴァ 熱戦少女 ウォッチャー・オブ・レルム プリストンテールM デーモンスクワッド 異世界傭兵団のそだて方 ダークオリンポス:闇の女神 ファントム オブ キル -オルタナティブ・イミテーション- 1 of 87123…87次へ »

  • NOW OR NEVER

    人生海外!HR Technology Conference in Las Vegasに行ってきます。

    NOW OR NEVER
    mikage014
    mikage014 2015/02/13
  • naoyaのはてなダイアリー - onsubmit で submit ボタンを disable にしてユーザビリティを良くする

    先の Yahoo! Shopping のアプリケーションで、今度ちょっとやってみようと思ってたことを実装してみた。 http://bloghackers.net/~naoya/ys/app.cgi ボタンを押したときに、そのボタンが disable になります。この方法を使うとボタンが押されて次の処理に入ろうとしているというのが直感的に分かるのと、二重送信防止にもなるということでユーザビリティが改善できます。 仕掛けはすごく簡単で、form の onsubmit ハンドラに、その form に紐づく submit ボタンを disable になるような JavaScript を登録しておくだけ。 function disableSubmit(form) { var elements = form.elements; for (var i = 0; i < elements.length;

    naoyaのはてなダイアリー - onsubmit で submit ボタンを disable にしてユーザビリティを良くする
  • こんなにあった!シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由 | マミオン有限会社-パソコン・数学研修、法人研修

    シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。 シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康品の『皇潤』で有名なエバーライフです。 今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。 1. 各フォームがそこそこ大きく見やすい 2. 必須項目表示がわかりやすい 3. ふりがなが自動的に入力される 4. 住所が自動的に入力される

    mikage014
    mikage014 2014/12/18
  • 今年気になったハイクオリティなデザインUIキット − 2014 - NxWorld

    今年(2014年)で見かけて気になったものやダウンロードしたデザインUIキットのまとめです。 そのままデザイン素材として使用するだけでなく、パーツやカラーの組み合わせ方を参考にしたり、どのようなレイヤースタイルで作られているかなど制作時のヒントに繋がる場合もあると思います。 紹介しているUIキットを使用する際は、ライセンス等は各自で再度確認してください。

    今年気になったハイクオリティなデザインUIキット − 2014 - NxWorld
  • 情報がないことを伝えるUIデザイン | UXデザイン会社Standardのブログ

    Empty Data(またはEmpty Status)」というUIパターンがあります。タイムラインやドロワーなどデザイナーであれば知っているUIパターンの名称に比べると、あまり日では聞き慣れないのかもしれません。Empty Dataは簡単に言うとデータがない時のUIになります(Webでの404に近いですが、少し違います)。では、Empty Dataを知るためにもう少し詳しく紹介していきたいと思います。 参考:モバイルデザインパターン 第2版 ―ユーザーインタフェースのためのパターン集 Empty DataはUIである Empty Dataはただユーザにデータがないことを示すだけではありません。ユーザにデータが存在しないという情報をフィードバックし、どうしたらここに情報が入るかのアクションに繋げる立派なUIです。もしEmpty DataのUIが存在しなかったらユーザはどのように感じるでし

    情報がないことを伝えるUIデザイン | UXデザイン会社Standardのブログ
  • Javascriptを使うのをやめろ:Railsの時代遅れ云々についての結論 - Qiita

    結論: Javascriptの乱用をやめるのが一番。 はじめに書いておきますがしょうもない話です。 結論、開発者としてはどのような方向性でやるべきか、を書いています。 JS多い時代でのフレームワークの根的な問題云々のことは書いてません。 さて、現状、モバイルにおいて、Javascriptでまともに動くものを作ることは難しいです。 Twitterから引き抜いた超優秀なWebエンジニアを多数抱えるMediumですら、未だにモバイルで多数のバグを抱えています。 超優秀なエンジニアを世界一抱えているであろうGoogleのGmailですら、モバイル版のWebはすぐクラッシュします。また、自前スクロールに致命的なバグも抱えています。 正確には「UIが不審な挙動をする」ですが、エンドユーザにとっては同じことで、「バグ」です。 サーバサイドで起こるバグと同じ程度、いやそれ以上に、サービスに影響を与えます

    Javascriptを使うのをやめろ:Railsの時代遅れ云々についての結論 - Qiita
    mikage014
    mikage014 2014/06/30
    「特にクライアントMVCは泥沼へ百歩入ってると個人的に思います」
  • [速報]Googleが新しいUXの体系「Material Design」を発表。あらゆるデバイスとスクリーンに適用。Google I/O 2014

    [速報]Googleが新しいUXの体系「Material Design」を発表。あらゆるデバイスとスクリーンに適用。Google I/O 2014 Googleは6月26日(現地時間25日)、米サンフランシスコでイベント「Google I/O 2014」を開催。次期Androidの「L」とともに、今後Googleがあらゆるデバイスとスクリーンに適用する新しいUXの体系「Material Design」を発表しました。 基調講演では次期Androidの「L」が今日からデベロッパープレビューとして公開されると発表。AndroidのOSにはアルファベット順のコード名が付いており、次期AndroidはLから始まりますが、まだコード名はついていません。 Lでは、Androidのユーザー体験を最初から考え直した新しいUXの体系「Material Design」を採用。基調講演で行われた「Materia

    [速報]Googleが新しいUXの体系「Material Design」を発表。あらゆるデバイスとスクリーンに適用。Google I/O 2014
  • 業務システムに己のすべてを賭ける深さはあるか

    株式会社プラムザ 代表取締役社長。システムコンサルタント。1998年に28歳で起業し、現在も現役のシステムエンジニアコンサルトとして、ものづくりの第一線で活躍しつつ、開発現場のチームとそのリーダーのあり方を研究し続けている。 「俺の全てをぶつけさせてくれる器量はあるか?」 これは井上雄彦先生の名著「バガボンド」で、武者修行を開始したばかりの宮武蔵が吉岡道場の当主清十郎に稽古を申込んだ際にぶつける言葉ですが、こうなってくると業務システムに己の全てをぶつけさせてくれる深みがあるか、知りたくなってきますね。 私は26歳くらいから、20年弱、延々と業務システムの開発を行っているわけですが、実際のところどうなのでしょうか。 最近のお仕事をちょっとご紹介しましょう。 以下に、お客様のご了承を得まして、目下開発中(7月β納品予定)のとある基幹業務システムの画面をご紹介します。 ■すべての基はマスタ

    業務システムに己のすべてを賭ける深さはあるか
  • IK Multimedia、離れた距離から手振りでiPad/iPhoneを操作できるコントローラ ~XYZ 3軸の手の動きを追跡可能

    mikage014
    mikage014 2014/05/08
  • 爆速入力の家計簿アプリ Zeny

    最近こつこつ作っていたZenyがリリースされました。めでたい。 Zeny(ゼニー)は、”大雑把にお金を管理したい”人向けの、爆速入力家計簿アプリです。無料で使える。 毎度の事ながらビジュアルは後回しですが、UIのシンプルさと操作性を追求しております。 家計簿アプリ戦国時代の昨今、なぜZenyを作ったかを書いてみる。 Zenyをダウンロード 家計簿には興味がなかった 実は家計簿をつけることには元々興味がなかったのです。チマチマお金を記録する時間がもったいないなと思ってた。 一ヶ月の書籍代と外費、この二つの金額ぐらいは知りたかったんだけど、記録するのはめんどくさかった。 出来るだけクレカで支払って、たまに明細データを見ればよいだろうと。Moneytree便利だし。 しかし、去年から青色申告することにして、その流れでTaxnoteという確定申告用の仕訳帳アプリを作りました。 Taxnoteで経

    爆速入力の家計簿アプリ Zeny
  • 優れたユーザーインタフェース(UI)を実現するチェックリスト36項目

    【img via tabletop assistant by MattHurst】 優れたユーザーインタフェースとは何か。どのようなデザインを「優れたユーザーインタフェース」と呼ぶのに相応しいのだろうか。 GoodUIというサイトに優れたユーザーインタフェースを実現するために確認しておきたい36項目をイラスト付きで解説していた。とても分かりやすく納得できる内容が多かったので、紹介しておく! 1.マルチカラムではなく、シングルカラム 複数カラムだとユーザーの目線が左右に逸れてしまう可能性があるため。 2.まずはギフトを渡してみる 最初から買うことを促すよりもまずはこちらから何かを与えることによってユーザーに喜ばれる。 3.似た機能や項目は1つにまとめて表示する 似た機能を分散させる必要はない。 4.ユーザーからの反応を載せる 実際に使っている「ユーザーの声」を参考に買い物をする人は少なくない

    優れたユーザーインタフェース(UI)を実現するチェックリスト36項目
  • 高齢者へのiPad導入を阻んだiOSのUI/UXの話

    高齢者へのiPad導入を阻んだiOSのUI/UXの話 先月(2013年11月)、徳島県南部局と美波町が共催する「ITふるさと村」の講座で、iPadを使ったタブレット講座を開催しました。その成功と失敗の体験について書こうと思います。 Facetimeビデオ通話のデモで会場を一気に盛り上げたものの、参加者に実際に体験してもらう段階で「大失敗」。AppleIDの取得とそのためのiCloudメールの登録をしてもらってから、と進めたのですが、30名ほどの参加者のうち時間内にゴール出来たのは、たったの1名。好きなアプリをダウンロードしてもらい、タブレットの楽しさを感じてもらう目標が、そのスタート地点にも立てず(;_;) 企画や運営、インストラクターとしては完全に落第点でした。それを棚に上げると、高齢者とITに関する課題が大量に見えたという点では、ある意味「大成功」だったとも言えるでしょう。 【講座内容

    高齢者へのiPad導入を阻んだiOSのUI/UXの話
  • ユーザーの知識は低いレベルで停滞する

    学習というのはたいへんな作業なので、ユーザーのやりたいことではない。その結果、彼らはユーザーインタフェースの探索をすることもなく、ほとんどの機能について知らないままだ。 User Expertise Stagnates at Low Levels by Jakob Nielsen on September 28, 2013 日語版2013年11月25日公開 コンピュータシステムを長期間利用しているユーザーでも、知っていて使っているのは利用可能なコマンドや機能のほんの一部だけであることは多い。デザインのユーザビリティが優れていれば、ユーザーはシステムを利用しはじめて間もなく、かなり容易に一連の基機能を理解する。しかし、その後、彼らは伸び悩み、それ以上はたいしてスキルが上がらない。システムを頻繁に使っているユーザーですら、年にわずか1つか2つの新しい知識を身につけられるようになるまでには何

    ユーザーの知識は低いレベルで停滞する
  • ユーザーと開発者の「ズレ」:窓屋 - ブロマガ

    「ズレ」がなるべく生じないようにすることはとても大事なことだけど、「ズレ」が生じてしまうのは仕方のないこと。では、その「ズレ」の先にあるものとは?そんなお話。 ここ数日で、一悶着(?)あった。いくつかのツイートを抽出した動画は荒れ、まとめブログやニュース系ブログにも取り上げられ、ツイッターはやたらフォローされるわニコレポはお気に入り通知で埋まるわ、てんやわんや。とりあえず、何が起きたかをわかりやすく(わりと煽らずに)まとめてるTogetterのリンクをひとつだけペタリ。 ニコニコ静画の2013年11月のリニューアルと良いUIの話 自分としては炎上させる意図はなく、包み隠さず率直に物事を言う人だと以前から知っていたので、この機会に運営側に聞いてみたいことや自分の意見の提案など色々と投げながら議論していければなあと思った次第。(今回のリニューアル担当とは違うみたいだけど)色々答えてくれそうとい

    ユーザーと開発者の「ズレ」:窓屋 - ブロマガ
  • UI研究者 増井俊之が語るエンジニアに伝えたいこと | 三年予測 |dodaエンジニア IT

    UI研究者 増井俊之 1959年生まれ。54歳。慶應義塾大学環境情報学部教授。東京大学大学院修士課程卒業後、富士通、シャープ、ソニーコンピュータサイエンス研究所、産業技術総合研究所を経て、2006年から2008年まで米AppleiPhone日本語入力方式の開発に従事。2008年より慶應義塾大学。 慶應義塾大学SFC(湘南藤沢キャンパス)にある増井俊之の研究室は、混沌とした楽しさが感じられる場だった。まず、ドアの開閉の方法からして違う。「NFC対応のスマートフォンをかざして回す」操作で解錠する仕組みが作り込まれている。ドア解錠の機構から伸びるケーブルの先には、ガジェット作りでは定番のマイコンボード「Arduino」がある。ユーザインタフェース研究者である増井の研究成果をドア解錠の機構に組み込んでいるのだ。 研究室の入り口には、研究室メンバーが「ニコニコ学会」で大賞を獲得したときの副賞のだ

    UI研究者 増井俊之が語るエンジニアに伝えたいこと | 三年予測 |dodaエンジニア IT
    mikage014
    mikage014 2013/11/18
    「『Makerムーブメント』のように、面白いハードウェアを考えて実現する余地は無限にある。こういう時代にこそ、面白いと思える所に自分の身を置くこと、新しいモノを作る夢を持ち続けることが大事だ」