タグ

関連タグで絞り込む (136)

タグの絞り込みを解除

uiに関するnayo74のブックマーク (138)

  • 色に頼らないビジュアル表現を考える | mkasumi.com

    実はこのテキストの中には、どこかがリンクになっています。どこのテキストにリンクが指定されているかビジュアルだけでわかりますか? 少し意地悪な問題ですが、題ではないので早速答えを述べます。実は、「このテキスト」という部分にリンクが指定されています(リンクには「#」が設定されているので、クリックするとこのページのトップに移動します)。 皆さんはどの段階で「このテキスト」という部分が少し青色であることに気づけましたか?もしかしたら、普段色を使うお仕事をされている方(デザイナーなど)はすぐに違和感に気づけたかもしれませんが、全てのテキストを読んでから青色になっている部分を探して見つけた方もいらっしゃるのではないでしょうか。 このように、文が黒文字でリンク色に暗めの青を使った場合はリンクだと気づけないことがあリます。 では、どのようなスタイルにすれば良かったのか考えると以下のようなパターンが挙げ

    色に頼らないビジュアル表現を考える | mkasumi.com
  • WEBデザイナーとUIデザイナーは違う職業なの?(求められるスキルや傾向など)|スズキアユミ(デザインメモ)

    【重要:この記事を読む前に】この記事は2018年に書いたもので、すでに4年ほど経過しています。常にトレンドが移り変わる業界ですので、あくまでも過去のものとしてご参考にしてくださいませ!(2022.04.14記) WEBデザイナーとUIデザイナーって、求められるスキルや得られるものって違いがあるの?と質問されて、「それたしかにちゃんと考えたことなかった!!」と思い、私なりに簡単に書き出してみました。 もちろん、会社や顧客によって変わってくるので、あくまでも【傾向】と明記していますが、これからデザイナーを目指している、別の方向へ転職しようと思っている方などに、少しでも参考になれば幸いです! 【前提】 この記事でのデザイナーの「デザイン範囲」まず、前提として昨今『デザイン』という言葉が広義になり、デザイナーのやることが広範囲になっているので、この記事では『制作・開発工程フェーズをメインとしたデザ

    WEBデザイナーとUIデザイナーは違う職業なの?(求められるスキルや傾向など)|スズキアユミ(デザインメモ)
    nayo74
    nayo74 2018/06/27
  • UX Design Glossary: How to Use Affordances in User Interfaces

  • LINE 桜川さんの話す「もっと読んでもらうための工夫」が実用的すぎてめちゃいい #AWAsia #LINE_AWA - @d_tettu blog

    2018年5月14日〜16日に、東京ミッドタウンで開催されているAd Week Asia。会社の偉い人から関係者向けのチケットをもらったので行ってきました。 何を聞こうかな〜とパンフレットに目を通していたら「スマホ時代のコンテンツデザイン」なる講演を発見。LINE・桜川さんのお話がめちゃ良かったのでメモを残しておきます。 こんな風に「より届けるべき人に届ける、よく読んでもらうために何をするべきか?」を考え続けてるのいいな〜。みんな読んでね。 ちなみにほか記事は以下 Googleは、機械学習でどうマーケティングを変えようとしているのか #AWAsia - @d_tettu blog 6秒でメッセージを届ける方法とはーーYouTube動画広告の効果的な作り方 #AWAsia - @d_tettu blog 「伝える」は奥が深い。メディア編集者3人が語る”これからのストーリーテリング” #AWA

    LINE 桜川さんの話す「もっと読んでもらうための工夫」が実用的すぎてめちゃいい #AWAsia #LINE_AWA - @d_tettu blog
  • 【2018年版】アプリUXデザインのトレンド12選

    モバイルアプリ領域の動きは非常に早く、UXデザインにおいて成功するためには、デザイナーは先見の明を持ち、新たな課題に備えなければなりません。 ここでは皆さんのタスクを軽減するために、2018年において影響力がもっとも大きいであろうトレンドをリストアップしました。 1. ユーザージャーニーの簡略化 アプリやWebサイトを使用する場合、ユーザーには特定の目的があります。その目的を達成するために費やす労力が少ないほど、より良い体験となるのです。 リニアユーザフロー リニアデザイン体験とは、ユーザーが各ステップを1つのアクションで完了できるようにするための開始・途中・終了があるUXのことです。タスクを完了するために必要な時間を見積もることができるため、リニアユーザーフローはユーザーのためになります。

    【2018年版】アプリUXデザインのトレンド12選
  • Maximize Your Profits: Unlocking the Potential of Crypto Revenue Streams

    Cryptocurrency payments have gained significant traction in recent years, emerging as a viable alternative to traditional banking systems. Unlike conventional currencies, which are controlled by …

    Maximize Your Profits: Unlocking the Potential of Crypto Revenue Streams
    nayo74
    nayo74 2018/04/06
    XDの素材が揃っているサイト
  • わかりやすい!イベントの「学び」がつまった、私の大好きなグラフィックレコーディング11選 | キャリアハック(CAREER HACK)

    いまSNSでシェアされている『グラフィックレコーディング』を徹底リサーチ!過去半年以内にシェアされた最新のグラレコのまとめをお届け。かわいいイラストや図など、ひと目でイベントの要点が把握できちゃいます。どんな職種の方にも参考にしていただけるはずです! 目次 はじめに グラレコ作成者|Twitterアカウント一覧 ・イラストレーター ますぶちみなこ @masco ・わなみん @wanami3103 ・タムカイ @tamkai ・こまどり @kmdrism ・たじま/マーケティングとデザイン @DesignHumore ・kanako nakamura @puchikana ・川邉マナブ / 15VISION @kwbmnb ・ひろみつ @hiromitsuuuuu イベント別|グラフィックレコーディングまとめ ・UI Crunch Design in Fintech Startups(201

    わかりやすい!イベントの「学び」がつまった、私の大好きなグラフィックレコーディング11選 | キャリアハック(CAREER HACK)
  • Foursquare: A UX case study

    Foursquare’s iOS app after tweaked experience of user journey I love Foursquare and have used it since I lived in Tokyo. After I moved to San Francisco, I was impressed that I could use it seamlessly. It helped me discover a new place anywhere in the world. Last summer, I also planned a trip to Portland with Foursquare but I realized a problem while using the iOS app. So I set out to explore featu

    Foursquare: A UX case study
    nayo74
    nayo74 2018/03/13
    改めて読んでるけど、面白いし、ペルソナ目線からの使い方は旅好きとしてとてもわかる。
  • Webサイトを使いやすく!UIデザインのCSS小技テクニック21個まとめ(実例サンプルコード付)

    素敵なインターフェースを心がけ、ユーザーエクスペリエンスを格段に改善することができる、UIデザインの重要ポイントを具体的なHTML/CSSのサンプル例と一緒にご紹介します。これらの各ポイントは、もともと@steveschogerがTwitterでツイートした内容となります。 1. アイコンはラベルよりも少しだけ明るくしよう。 文字ラベルの横にアイコンを配置するときは、少しだけ色を明るくしてみましょう。こうすることで、もっとも重要な情報(文字ラベル)をうまく強調することができます。 See the Pen Little UI Details : 小技テクニック01 by PhotoshopVIP (@vipcrew) on CodePen. 2. 明るい背景色では、白文字に少しだけ影を追加しよう。 背景色が明るく、白文字を利用するときは、文字に少しだけ素敵な影を加えることで、より読みやすくな

    Webサイトを使いやすく!UIデザインのCSS小技テクニック21個まとめ(実例サンプルコード付)
    nayo74
    nayo74 2018/01/24
    ちょっとしたポイントだけど、うまくまとまってる。
  • グリッドシステムベースのデザインをするときに気をつけること | バニデザノート

    グリッドシステムのフレームワークでデザインを作成する際、コーディングの時点で困らないデザイン方法です。 完全に順守すればほとんどカラム落ちやブラウザのことも考えずに作れると思います。 ただ、例外の部分もあって構わないと私は思っているので、あくまでも基ということで、拡張は自由にやってください。

    グリッドシステムベースのデザインをするときに気をつけること | バニデザノート
  • スマホ入力フォームを最適化する4つの方法 | デザイン

    あなたのサイトの入力フォーム、きちんとスマホ最適化してますか? Webサイトにおいて「いかにフォームからのコンバージョンを獲得するか」は最も重要なミッションです。単にPCサイトのCSSを切り替えて設置しただけでは、スマホに最適化されているとは言えません。操作領域が小さく、使用環境も異なるスマホユーザーに対しては、PCサイトと異なるアプローチが必要です。今回は、特に対応が難しい「膨大な項目数と情報量をもつ入力フォーム」にケースをしぼり、スマホサイトでのページの離脱を防ぐUI改善メソッド(EFO)を前編・後編にわたってお届けします。

    スマホ入力フォームを最適化する4つの方法 | デザイン
  • チャット一覧の新UIをβ版としてリリース

    ChatWorkは日、チャット一覧の新しいデザインをβ版としてリリースしました。 今回は、5年間ぶりの大きな変更としてチャット一覧のデザインをアップデートするにいたった背景を紹介します。 *2017年12月13日更新:新UIを正式にリリースしました。 今回のUI(ユーザーインターフェース)改善のポイント ボタンが複数並んでいるデザインをやめ、複雑で難しい印象をなくす 今回のスコープから外したポイント チャット一覧以外はデザインを変えない 機能性は変更しない 現行UIで抱える課題 今までのチャット一覧は、「未読」「Toの未読」「タスク」のアイコンをボタン形式で全て表示していました。これにより、フィルタの切り替えは簡単におこなえるものの、ボタンが多すぎて、サービスとして複雑な印象を与える要因になっていました。 また、各チャットには「未読数」「Toの未読数」「タスク数」「ミュート」「ピン」など

    チャット一覧の新UIをβ版としてリリース
  • 会員登録率を15%上げた方法 ~noteの改善の現場から~|justin / iOSエンジニア

    こんにちは。ピースオブケイクでnoteの開発をしているjustinです。 10月に深津さんがCXOに就任して、早2ヶ月が経とうとしています。 週1回グロース会議を行い、そこで話し合われた内容がどんどんリリースされています。 定期的に深津さんがnoteのカイゼン施策をノートにまとめていますが、現場でどんなことが行われているのかはあまり公開したことがありませんでした。そこで、この記事では少しだけ施策の裏側をお話したいと思います。 この記事では「最近のnoteカイゼン(11月中半)」で紹介された、 課金時のユーザー離脱を下げるチューニングを施しましたにスポットをあてます カイゼンの流れざっくりですが、カイゼンの流れは以下のようになります。 1. 購入導線を洗い出す 2. データを取る 3. 数字の著しく落ちているところを探す 4. 改善案を考える 5. 実行する 6. 評価上の流れはcakesの

    会員登録率を15%上げた方法 ~noteの改善の現場から~|justin / iOSエンジニア
  • 2017年、デザインガイドラインについて考える。|Yuya Furusato|note

    株式会社rootのUIデザイナー 古里祐哉です(@remmyfurusato)。 rootでは、サービスの立ち上げやリニューアルに伴う、UI/UXデザインをご支援しています。 さて、今年を振り返えると「デザインガイドラインに注力した」年でした。デザインガイドラインを必要とされるクライアント様には共通点があります。 ・レイアウトパターンやパーツの使い方が定義されていないで、設計者やエンジニアが迷う。 ・結果、サービス全体の一貫性がなく使いづらい。 このような課題を抱えるクライアント様からのご依頼を多くいただきました。サービス開発の現場で、徐々にデザインガイドラインの重要性が広まってきているのではないでしょうか。 デザインガイドライン作成を通して考えたことをまとめたいと思います。 デザインガイドラインとは? デザインガイドラインの定義は「サービスやプラットフォームのデザイン方針を示したドキュメ

    2017年、デザインガイドラインについて考える。|Yuya Furusato|note
  • 最小タップ数を極限まで追求したスマホ通販UIの商品選択仕様

    nayo74
    nayo74 2017/10/06
    []
  • スマートフォンサイトのUIデザイン考察 〜ナビゲーション編〜

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

    スマートフォンサイトのUIデザイン考察 〜ナビゲーション編〜
    nayo74
    nayo74 2017/10/06
  • スマホのパンくずリスト19選+α!あのサイトからあのサイトまで!

    スマホのパンくずリスト19選+α!あのサイトからあのサイトまで!
  • 読みやすさのデザイン備忘録 | 深津 貴之 (fladdict) | note

    noteのコア体験は、「読む楽しさ」と「書く楽しさ」だと考えています。 来ならコア体験は、調査でしっかりと導くべきものです。しかしアカデミックなUXとは異なり、実際のスタートアップ環境では時間とリソースに限界があります。このため調べながらも、走り出さなければなりません。 まず序盤はヒューリスティック(経験)ベースのデザインを行いつつ、調査やテストが可能なところから、裏づけやチューニングを行う流れになりそうです。 以下、「読書体験」における「可読性」のパートのメモ。noteチームにとりあえず提案する予定の諸々です(現時点では個人の見解です)。基的には「当たり前のことを、当たり前に」やる予定。「これもやっとけ」的なことがあれば、タイポグラファーの諸先輩の方々には、ぜひご意見をお伺いできればと。 書体をサンセリフ系に変えるべきか?デジタルでは、一般的にサンセリフ体の可読性は、ローマン体よりも

    読みやすさのデザイン備忘録 | 深津 貴之 (fladdict) | note
  • 初心者ブロガーが覚えておきたい読まれるブログデザインの大原則 - Naifix

    WordPress は、テーマの変更やカスタマイズで自分好みのデザインにできます。記事を書く以外の楽しみ方も増えますし、記事ネタが思い浮かばないとき・モチベーションが下がっているときの気分転換にもなりますよね。 しかし、読者を無視したデザインになっていないでしょうか。どんなデザインにするのも運営者の自由ですが、最終目的は「読まれるブログ」を作ることだと思います。そのため、最低限のルールは守らなければいけません。 記事では、ブログ初心者が覚えておくべきデザインの基とルールを解説していきます。 デザインは読者のためにある 大前提として覚えておくべき基は、「デザインは読者のためにある」ということ。 自分だけが見る自分のためだけに作ったブログなら、100 % 自分に合わせてもよいと思います。でも、あなたが読みやすい・使いやすいと感じているから周りもそうだ、とはかぎらないのです。 客観的な視点

    初心者ブロガーが覚えておきたい読まれるブログデザインの大原則 - Naifix
  • 【データ公開】スマホページのシェアボタン表示を変えたらシェア数が50%以下になった事例

    この記事は2015年4月17日に公開された記事を再編集しています。 ferretでは、ユーザーの皆様が使いやすいサイトになるよう日々細かな改善を行っています。 改善を繰り返していくなかで、思わぬ結果が出てしまうこともあります。 直近では、スマートフォン版ferretのシェアボタン表示を変更してA/Bテストを行ったところ、両者のシェア数に大きな差が生じました。 今回は、そのテスト内容と結果をご紹介します。 テストを実施した背景 ferret内には、会員登録すると利用できる「お気に入り」というブックマーク機能があります。 スマートフォン版では「お気に入り」ボタンはページの最下部に設置されているので気づかれにくいのではないかと考え、「お気に入り」をページ上部に自然と配置して利用率をあげようというのが今回のテストの狙いでした。 テスト内容:スマホページのシェアボタン表示を変更 ferretのスマホ

    【データ公開】スマホページのシェアボタン表示を変えたらシェア数が50%以下になった事例