タグ

UIに関するkaraumaのブックマーク (215)

  • 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改善の失敗談。 | アプリマーケティング研究所
    karauma
    karauma 2016/08/16
  • 説得力がグンと上がる!UIデザインの心理学

    オライリーから出ている「ユーザーインターフェースデザインの心理学」から使えそうなものを実例を踏まえピックアップ!これでUIデザイン説明の説得力をあげよう! 情報は一度にすべて見せるのではなく、そのとき必要なものを段階的に開示させた方がよい。 デザイナーが犯しがちな失敗は一度に大量の情報をユーザーに与えてしまうことです。 情報は一度に大量に与えるのではなく、その時点で必要としている情報だけを与えるほうが様々なニーズに対応することができます。 ユーザーの中には大まかな説明でよい人もいれば、詳細を知りたがっている人もいます。 つまりどういう事? 情報は一度に見せるのではなく段階的に見せる 重要なのはクリック回数ではない。クリックのたびに必要な情報が手に入るのであればユーザーは喜んでクリックする 誰がいつ何を必要としているかを理解する。各段階で何を必要としているか的確に把握していないと、この手法は

    説得力がグンと上がる!UIデザインの心理学
  • UIガイドラインから学ぶライティングの基礎

    言葉で決まるアプリの印象 2 年前に発表されて以来、細かな更新が続いている Material Design。最近、UI の動きに関するガイドが大幅に改変されたことで、感覚的なところも共有しやすくなってきました。Android アプリにおける UI デザインの基礎を固める上で、Material Design は非常に参考になりますが、このガイドラインは見た目のことばかり書かれているわけではありません。 Material Design の中には「Writing」と呼ばれる言葉遣いに関する項目があります。ボタンのような操作 UI のラベルはもちろん、エラーメッセージや、挨拶文など、アプリに表示されるテキストすべてに関してガイドラインが制定されています。言葉は大事なインターフェイスですから、きちんと項目をつくって紹介してあるのは素晴らしいことです。 以下、「Writing」項目で紹介されているガイ

    UIガイドラインから学ぶライティングの基礎
    karauma
    karauma 2016/06/01
  • 優れたUXを実現するための人間中心デザインとは?|オンライン動画授業・講座のSchoo(スクー)

    ■優れたUXを実現するためのHCDとは? Webサイトやアプリを介して訪れてくれているユーザーに、サービス自身の魅力はちゃんと伝わっているのでしょうか?そもそも、ちゃんと伝えられているのでしょうか? この授業では「どうやって」「なにを」つくるか?よりも、そもそも「なぜ」つくる必要があるのか?そして、「誰のために」つくり、「どのように」伝えていくべきなのかを考えるきっかけとして「人間中心設計(Human Centered Design:HCD)」を「伝わる仕組み」としてご紹介します。 ■授業のアジェンダ(予定) ・コトづくり=伝わる仕組みをデザインする(ユーザエクスペリエンスデザイン) ・伝わる仕組みをデザインする=人間中心設計 ■「CONCENT」×「schoo」全3回の連続授業 第1回 デザイン領域の拡張に伴うデザイナーの役割とは? 第2回 サービスデザイン時代のデザイナーのあり方とは?

    優れたUXを実現するための人間中心デザインとは?|オンライン動画授業・講座のSchoo(スクー)
  • スマートフォンサイトのUIデザイン考察 〜ナビゲーション編〜

    こんにちは、ウミの森山です。あっ・・という間に年の暮れですね!先日ウミの忘年会も終わりまして、時が過ぎる早さに焦り気味の私です。 さて日は、「スマートフォンサイトにおけるUIデザイン」について書きたいのですが、 その中でも特に重要な役割を果たしている「グローバルナビゲーション(メインメニュー)」について掘り下げてみたいと思います。 スマホサイトの使いやすさを左右するナビゲーションメニューあれこれ 普段スマートフォンでサイトを閲覧される機会の多い方であれば、よく見かけるナビゲーションデザインのパターンがいくつか思い浮かぶかと思いますが、ここではスマートフォンサイトで使われているナビゲーションのUIパターンをいくつかご紹介したいと思います。 1. ハンバーガーボタン + プルダウン(ドロップダウン)メニュー これがもっとも一般的なスタイルでないかと思います。「 ≡ 」のアイコンをタップすると

    スマートフォンサイトのUIデザイン考察 〜ナビゲーション編〜
  • fladdict » スマホのUI考 〜 ボタンについて

    SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ

  • Collect UI

    You can see the designs from the ui challenge below, we extended it with the components we found, updating daily. See stats for frequency.

    Collect UI
  • lovely ui

    device: iphone / ipad / android / app icons / app store / badges / buttons / calendars / capture / coach mark / comments / compose / count / detail / empty states / feed / graphs / home / icons / launch screen / list / login / maps / media player / navigation / notifications / popovers / profile / search / settings / share / stats / walk throughs / trends: circles / gradients / ghost buttons / rai

    lovely ui
  • デザインの確かな知識が身につく!Webサイトやアプリのデザインの勉強になるスライドのまとめ

    実践的なUXデザインやインタラクションデザイン、レスポンシブサイトに効くデザインTips、Sketchを使ったデザインフロー、Webデザイナーのためのタイポグラフィ講座など、Webサイト・アプリなどのUIデザイン/UXデザイン勉強になるスライドを紹介します。 時間をかけてゆっくり、何度でも見たいスライドばかりです。 写真: ぱくたそ 確実に良くするUI/UX設計 from Takayuki Fukatsu 実践的なUXデザインとインタラクションデザインの考え方 from CyberAgent, Inc. UXとデザインまとめ by 上野学 - presentation from UX まとめ 2015 from Sociomedia アクセシビリティからはじめる、WebサイトのUXデザイン from Yoshinori OHTA いいデザインのために組織の一人ひとりができること f

    デザインの確かな知識が身につく!Webサイトやアプリのデザインの勉強になるスライドのまとめ
  • Google の新しいデザインガイドライン「Material Design」 | DevelopersIO

    Material Design Google I/O 2014 で新しいデザインガイドラインが発表されました。 Google Design その中で注目されるキーワードが「Material Design」です。これは直訳すると「素材のデザイン」という感じになりますが、これは現実世界の素材をメタファーとすることでユーザーにとってわかりやすくなるように考えられたデザインのようです。 ということで、Material Design について簡単にまとめつつ、どうやってデザインを始めていけばいいか考えていきたいと思います。 Google Design のガイドラインを個人的に解釈した内容を掲載しています。誤解などありましたらコメント欄にて連絡ください。喜んで修正します。 イントロダクション まずはじめに Material Design の概要です。文をそのまま引用します。 We challenge

    Google の新しいデザインガイドライン「Material Design」 | DevelopersIO
    karauma
    karauma 2015/12/04
  • could

    Design, Content, Experience

    could
    karauma
    karauma 2015/12/03
  • WordPress Themes, HTML Templates - ThemeForest

    Professional WordPress Themes & Website Templates for any project Discover thousands of easy to customize themes, templates & CMS products, made by world-class developers.

    WordPress Themes, HTML Templates - ThemeForest
  • サイトやアプリのユーザビリティを向上させる35のポイント | ベイジの社長ブログ

    デバイスがどのように進化しようが、アプリの時代になろうが、ユーザビリティは変わらず求められるものです。Web/IT業界では「使いやすさ」という意味で気軽に使われる言葉ですが、奥は深く、原論を解説した書籍もいくつか出ています。 学術的な解説はそういった書籍に任せるとして、ここでは、経験の浅いデザイナー、あるいは非デザイナー(ディレクター、Web担当者、エンジニアなど)向けに、ユーザビリティの向上に繋がる基的な要点をまとめてみました。 ボタン、テキスト、コピーなど ボタンやテキストのデザインは、ユーザビリティを左右する大きなポイントです。表面的な美観に流されず、ユーザ視点で考えていきましょう。 1:ボタンじゃない要素は、ボタンと似たデザインにしない ボタンのデザイン次第で、サイトやアプリの使いやすさは大きく変わります。特に、ボタンでない要素にボタンのようなデザインを施すことは、どこが押せるの

    サイトやアプリのユーザビリティを向上させる35のポイント | ベイジの社長ブログ
    karauma
    karauma 2015/11/30
  • 複数のエンジニアと開発を円滑に進めるためのissueの立て方 - クックパッド開発者ブログ

    こんにちは。クックパッド特売情報ディレクターの田中です。 前回ヘルスケア事業部の濱田くんのエントリーでエンジニア以外のGitHubの利用について紹介されていましたが、今回は私がチーム開発で実践しているissueの立て方についてご紹介したいと思います。 チームが大きくなってきてヒズミが生じてきた 来、ディレクターが開発を伴わない価値検証を十分に行った上で仕様を考え、デザイナー・エンジニアに引き継ぐのが理想的だと思います。 私自身も当初はその開発の進め方を採用していましたが、チームが大きくなり、ディレクター1人で関わるエンジニアが増えてくると、状況は変わってきました。 マルチタスク的に仕様を考えていたために詰めが甘い部分が多く、手戻りが発生してしまったり、仕様の準備が追いつかず、エンジニアの手が空いてしまうことが増えてしまったのです。 当初は自分自身の頑張りが足りないからだと、徒に気合いと根

    karauma
    karauma 2015/11/20
  • 【永久保存版】エンジニア・デザイナー必見!「UI/UX」の基礎が学べるSlideshare30選

    UI/UXという言葉を聞いて久しいですが、みなさんは基的な考え方をきちんと理解できているでしょうか?様々なアプリを触り、「このアプリのUI/UXいいよね」と言う人は多くいますが、UI/UXを何となく知っている感じになっていると思います。 そこで今回はUI/UXの基礎が学べる資料をSlideshareから30�個集めました。デザイナーの方は必見です!

    【永久保存版】エンジニア・デザイナー必見!「UI/UX」の基礎が学べるSlideshare30選
    karauma
    karauma 2015/10/29
    永久保存版】エンジニア・デザイナー必見!「UI/UX」の基礎が学べるSlideshare30選
  • 【素敵入力フォーム4】自動車保険編 | EFO(エントリーフォーム最適化)ナビ

  • 最近のWebデザインで採用されているページレイアウトやUIの新常識がチェックできる素材のまとめ

    最近のWebのUIはフラットデザイン・Material Designが着実に進化し、シンプルでコンテンツにフォーカスされたデザインが定着してきました。テキストは読みやすく、写真はより大きく使用されています。レイアウトは縦長型やカード型の人気が高く、デスクトップでもスマホでもスクロールを前提にしたデザインが主流となっています。 最近のWebデザインで採用されているページレイアウトやUIの新常識がチェックできる素材やプレビューを紹介します。 Boring Cards UI Kit PSD、個人・商用利用無料。 Bootstrap 4でも新しいコンポーネントとして注目されているカードを使用したUIキット。黄金比をベースにしたデザインはさまざまなサイズ・カラーで展開することができます。

    最近のWebデザインで採用されているページレイアウトやUIの新常識がチェックできる素材のまとめ
    karauma
    karauma 2015/10/28
  • パターンライブラリー | Accessible & Usable

    公開日 : 2015年10月17日 (2019年1月26日 更新) カテゴリー : アクセシビリティ / ユーザビリティ ウェブサイトやアプリケーションの開発や運営においては、一貫性のあるユーザーインターフェース (UI) を採用し、維持することが、ユーザビリティ上重要になります。UI の一貫性を保つためには「パターンライブラリー」を用意し、プロジェクト関係者の間で共有しておくと便利です。 パターンライブラリーとは、サイトやアプリを構成する UI コンポーネントをパターン化して再利用できるように、一覧化したものです。「スタイルガイド」と呼ばれることもあります。 パターンライブラリーの内容 プロジェクトによってパターンライブラリーに含まれる内容は様々だと思いますが、主な構成要素としては以下が挙げられます。 UI コンポーネントの外見およびインタラクション 実装に用いるソースコード (HTML

    パターンライブラリー | Accessible & Usable
    karauma
    karauma 2015/10/21
  • userflowpatterns.com - このウェブサイトは販売用です! - userflowpatterns リソースおよび情報

    This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

    karauma
    karauma 2015/10/15
    ユーザーのスマホ操作フローを動画で紹介しているサイト
  • Loading...