Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                

タグ

UIに関するfunya-rのブックマーク (6)

  • アプリのアップデート300本ノックから学ぶUI改善のヒント|宮﨑 晃

    こんにちは、HR業界でアプリマーケティングをしている宮﨑です。 ・アプリのアップデート前後のUI変化 ・Push通知など気になったGrowth施策 こうしたものを「#アプリノック」としてTwitterで投稿すること3ヶ月。300以上のネタが溜まってきました。 今回のnoteでは「フォッグの消費者行動モデル」というフレームワークを使ってまとめていきます。 行動 = 動機 × 実行能力 × きっかけ ザックリいうとユーザーに何か行動を促す際に「動機/実行能力/きっかけ」の3要素をどう揃えるか?というモノ。 詳しくは深津さんの記事がとってもわかりやすいのでおススメです。 アプリノックがUI改善の勘所だけでなく、Growthの知識も一緒に学べるコンテンツになっていくと嬉しいです。 それではいってみましょう! 【動機】がないと、やる気にならない①慣れない体験にはイメージ作りを よくわからない体験は

    アプリのアップデート300本ノックから学ぶUI改善のヒント|宮﨑 晃
    funya-r
    funya-r 2020/01/16
    Hooked ハマるしかけ 使われつづけるサービスを生み出す[心理学]×[デザイン]の新ルール
  • UIのデザインでよく見かける、目の錯覚による違和感を取り除くデザインテクニックのまとめ

    WebページやスマホアプリのUIをデザインした時に、数値上は均整がとれているのに、人の目の錯覚で違和感を感じることがあります。ちゃんと揃えて配置したのに、同じサイズなのに、同じ色なのに、なんだか違和感があることはありませんか? この目の錯覚による違和感を取り除くUIデザインのテクニックを紹介します。 Visually distorted - when symmetrical UI looks all wrong by Gil Bouhnick 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 01. ボタンと同じ色だとテキストは明るく見える 02. 同じフォントでも小さいサイズだと細く見える 03. 背景画像の上のテキストは読みにくい 04. 行間が間違っているテキスト 形の扱い方 05. 整列されたのに揃っているように見えない

    UIのデザインでよく見かける、目の錯覚による違和感を取り除くデザインテクニックのまとめ
  • 【保存版】Webエンジニアが見るべきテックブログ一覧

    皆さんはどのような方法で最新の技術や、コードのTipsを収集していますか? はてなブックマークやTwitter, GitHubなど様々あると思います。 私はテックブログを使った情報収集をしています。今回はエンジニアが見るべきおすすめのテックブログをいっきにご紹介します。 テックブログとは? ご存知の方も多いと思いますが、テックブログとはWEBサービスゲーム等を提供している企業が、自社で使っている技術や開発手法を紹介するブログです。デベロッパーブログとも呼ばれます。 エンジニアが持ち回りで書くことが多いので、そこで働いている人のこともわかっちゃいます。 普段使っているサービスがどのような言語でできていて、どのようなフレームワークを使っているか、どんなツールを利用して開発しているのかが載っているのでとても刺激的な内容ばかりです。 転職、新卒の会社選びにも役立つ!? 転職する際に気になるどんな

    【保存版】Webエンジニアが見るべきテックブログ一覧
    funya-r
    funya-r 2019/10/26
    自分が学びたい言語のところをクリックすると面白いかも
  • UIのお作法。28個の「〇〇できそう感」をまとめました。|maiokamoto

    UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 1、進めそう感 2、戻れそう感 3、進めそう&戻れそう感 4、開きそう感(ドロップダウン) 5、開きそう感(アコーディオン) 6、開きそう感(モーダル1) 7、開きそう感(モーダル2) 8、カレンダーが開きそう感 9、メニューが開きそう感(ハンバーガー) 10、検索できそう感 11、入力できそう感 12、検索できそう + 入力できそう感 13、パスワード入力できそう感 14、パスワード感(強め) 15、間違えた感(エラー) 16、合ってる感(OK) 17、電話かかる感

    UIのお作法。28個の「〇〇できそう感」をまとめました。|maiokamoto
  • テーブルを見やすく、使いやすくするためのアルティメットガイド

    ウェブページでデータをみせるテーブルを見やすく、使いやすくするためのスタイルや機能性などUIパターンを紹介したアルティメットガイドをJanko At Warp Speedから紹介します。 Ultimate guide to table UI patterns 下記は各ポイントを意訳したものです。 テーブルの「(エクセルでいうところの)行と列」の表記は、「横列と縦列」に統一しています。 はじめに 1. 列を交互にスタイリング 2. 列をフルに 3. テーブルのセクション 4. ソート 5. フィルタリング 6. ページネーション 7. スクロール 8. 固定されたヘッダ 9. ヘッダのないテーブル 10. 拡張可能な列 11. 列のアクション 12. マルチプルな列のアクション はじめに テーブルは構造化されたデータをみせるものです。そして、その目的はデータを読みやすくし、走査しやすく、簡単

  • 大量のリストから目当てのものを瞬時に探せるようになるjQueryプラグイン「LiveFilter」:phpspot開発日誌

    大量のリストから目当てのものを瞬時に探せるようになるjQueryプラグイン「LiveFilter」 2010年01月20日- jQuery Plugin: LiveFilter 1.0.1 | Mike Merritt | Digital Inferno 大量のリストから目当てのものを瞬時に探せるようになるjQueryプラグイン「LiveFilter」。 1ページ内にリストが多く表示されていると探すのが大変ですが、LiveFilterを使えば瞬時に対象を探すことができます。 インプットボックスに検索したい文字列を入れると、一気に対象が絞り込まれ、好みのものがすぐに見つかるでしょう。 そんなの、グーグルツールバーやページ内検索を使えばいいじゃないか、という方もいると思いますが、それらの存在が知らない初心者の方に向けたページの場合は威力を発揮しそうです。 パソコン中級者や上級者の方に向けても、

  • 1