タグ

UIとuxに関するkoda3のブックマーク (14)

  • 最前線で活躍するUIデザイナーに聞いた、Adobe XDの良い点・ダメな点 | 株式会社プライサー

    こんにちは。デザイナーのモッチです。 今話題の『Adobe XD』、みなさんはもう活用されていますか? アプリデザインの現場で、格段のスピードアップが期待される新しいデザインツールです。今回はそのAdobe XDについて、当社でバリバリ活用しているUIデザイナー・さっちーさんにきいてみました。 Adobe XDってなに? ──まずはじめに、Adobe XDってなんですか? Adobe XDなら、これ1つでコンセプトからすばやくプロトタイプも作成できます。Webサイト、モバイルアプリ、その他のデザインがこれ1つで可能な、まったく新しいUI/UXソリューションです。 …とAdobeのサイトからコピってみました(笑)。でも、当にその通り。 UI/UXのためにまったく新しい方向から発足した開発チームが作ってくれたぞー! という感じのアプリケーションです。それでいてAdobeユーザーであれば(で、

    最前線で活躍するUIデザイナーに聞いた、Adobe XDの良い点・ダメな点 | 株式会社プライサー
    koda3
    koda3 2018/09/04
  • Adobe XDがどんどん便利になってる!Web制作に使える無料素材のまとめ

    先週のCreative Cloudアップデートで、Adobe XDが正式版としてリリースされました。Adobeユーザーはもちろん、Windowsがメイン環境の人にもUI/UXデザイン命と言えるでしょう。 昨日のAdobe Creative Cloud道場のライブ動画ではAdobe XDの近い将来の機能として、タブレット用のレイアウトを作成したら、人工知能Adobe Senseiでスマホ用の複数のレイアウト候補を自動作成し、あとはそこから選び出せるようになるとのことです。作業には時間をかけず、クリエイティブに時間をかけることができますね。 Adobe XDでWebサイトやスマホアプリを制作する際に役立つ、ユーザーフローやワイヤーフレーム、グリッド、スタイルガイド、UIコンポーネントなどの無料素材を紹介します。

    Adobe XDがどんどん便利になってる!Web制作に使える無料素材のまとめ
  • サイトやアプリの使い心地を改善!UIアニメーションを良くする実践テクニック、小技7個まとめ

    実際のサンプル例を確認しながら、UIデザインの「良い」アニメーションを「より良く」してみましょう。ほんの少し調整を行うだけで、UIマイクロインタラクションをより魅力的で、ユーザーにも分かりやすく表現できます。 たとえば、リスト形式で並べたコンテンツにちょっとした工夫を加えるだけで、よりつながりのあるUIパターンを演出できたり、コンテンツの関係性を考えたアニメーション遷移、ボタンをクリックするなどユーザーに行ってもらいたいものに注意を引くことも、ほんのわずかなUIマイクロインタラクションによって実現できます。 今回はこれらのサンプル例を作成するために、Material Motion、IBMのアニメーション原則、Motion in Manifestoのガイドラインを参考にしています。 また今回のサンプル例は、InVision Studio(現在は限定ユーザーのみのアーリーアクセスで、メール登録

    サイトやアプリの使い心地を改善!UIアニメーションを良くする実践テクニック、小技7個まとめ
  • 次世代のワイヤーフレーム「マイクロフレーム」とは

    Marcinは製品デザインのプラットフォームである、UXPinのCEOおよび共同創設者です。2010年にUXPinを共同創設して以来、彼はポーランドのシリコンバレーオフィスの製作チームをリードし手助けしてきました。 「ワイヤーフレームの時代は終わりました。インタラクティブなプロトタイプこそがすべてです。」 私たちは少なくとも7年間は、この主張を聞き続けてきました。もしこのような議論に対して、人気がすべてを証明するというなら、真実はこの主張の逆と言えるでしょう。なぜならワイヤーフレームは終わったらしいと議論され続けているという事実自体が、ワイヤーフレームは顕在で、デザインプロセスにおいて少なくとも一部のプロジェクトやデザイナーに適合する形で存続していることを証明しているからです。 ワイヤーフレームはどのように生き残ってきたのでしょうか? 実はワイヤーフレームは進化し続けています。 ワイヤーフ

    次世代のワイヤーフレーム「マイクロフレーム」とは
  • GoodpatchのUIデザイナーがおすすめ UIデザインを理解するためのブックリスト【2021増補版】|Goodpatch Blog グッドパッチブログ

    今回は、GoodpatchのUIデザイナーにヒアリングし、UIデザインを理解するためのおすすめをまとめました。 次のような人に特におすすめです。 UIデザイナーになったばかりの人 もっとUIデザインについて勉強したい人 サービス、アプリ開発に携わるエンジニア・ディレクターの人 目的別に6つのカテゴリに分けてご紹介します。あなたの関心に沿ったトピックから、 気になるを見つけていただけると嬉しいです。 1. UIデザインを基礎から理解する ユーザーインターフェース(UI)とは何なのか、どんなデザイン要素があるのか、UIが機能する環境とは?、どうやって作ってリリースするのか…UIデザインを始めるために、まずは基礎知識を網羅しましょう。 ■ はじめてのUIデザイン 改訂版 このは、著者の1人である吉竹遼さんが「UIデザインを体系的に学ぶためのが少ない」という課題感から企画されました。そのた

    GoodpatchのUIデザイナーがおすすめ UIデザインを理解するためのブックリスト【2021増補版】|Goodpatch Blog グッドパッチブログ
  • http://www.ogura.blog/entry/2017/02/28/190245

    http://www.ogura.blog/entry/2017/02/28/190245
  • 説明なしでもわかるUIを実現するために!マイクロインタラクションの基本を理解しよう

    こんにちは。TechAcademyの小嶋です。 皆様は「マイクロインタラクション」という言葉をご存知でしょうか。 誰にでもわかりやすいUI/UXを目指したもので、Webサービスやアプリなど様々な場面で使われています。 朝起きてアラームを解除するところから夜スマホの充電を開始してから寝るまで、数多くのマイクロインタラクションに触れています。 今回は、マイクロインタラクションの基概念と利用するメリットを解説します。 あらゆるサービスに応用できる概念なので、ぜひこの機会に覚えておきましょう。 マイクロインタラクションとは:誰でも直感的に何をすればいいかがわかるデザイン マイクロインタラクションとは、「ヒューマンセンタードデザイン(人間中心のデザイン)」と呼ばれるデザイン手法の1つで、「今どのような状況で、次にどう行動すれば良いのかを直感的なUIで伝える」ことを目的としています。 説明書を読まず

    説明なしでもわかるUIを実現するために!マイクロインタラクションの基本を理解しよう
    koda3
    koda3 2017/02/03
  • UXデザイナーが備えておきたいツール・サービス厳選20個まとめ

    UXデザインとはユーザーエクスペリエンス(UX)、Webサイトやアプリの使い勝手やユーザーが体験する満足度を重視したデザインのことで、あなたが満足するデザインをつくってもユーザーが使いやすいと感じなければUXが良いとは言えません。 ユーザーのリサーチやテストやフィードバック、プロトタイプやワイヤーフレームの作成、クライアントやチームメンバーとのコラボレーションなどに役立つツール・サービスを紹介します。 20 Valuable Tools For UX Designers 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 ユーザーのリサーチ・テスト・フィードバック プロトタイプ・ワイヤーフレームの作成ツール コラボレーションのツール ユーザーのリサーチ・テスト・フィードバック ユーザーのリサーチは、プロトタイプを制作する前におこなう

    UXデザイナーが備えておきたいツール・サービス厳選20個まとめ
    koda3
    koda3 2017/01/16
  • デザイナーだけでなくエンジニアもブックマークしておくべきUI/UXの情報を発信するメディア・ブログ6選|TechClips[テッククリップス]

    デザイナーにとっては、聞かない日がないほどトレンドとなっている「UI/UX」という言葉。もはやデザイナーに限らずエンジニアにとっても、UI/UXの概念を理解していることが基のスキルセットとして必要とされる傾向もあり、これまでのような“モノ”から“コト”を重視する考えが強まっているように思います。 さて、記事ではそうしたUI/UXの情報を余すことなく発信する国内メディアやブログを紹介。デザイナーはもちろん、エンジニアの方もUI/UXの理解を深める情報源として活用してみてはいかがでしょうか。 UI/UXとは 改めてUI/UXについて簡単にご紹介すると、それぞれの「UI」と「UX」では考え方が違うことに注意しましょう。はじめにUXとは、「ユーザーエクスペリエンス」の略で、いわゆる“体験”を指します。 例えば、「ECサイトで思いがけない好みの商品を見つけ、購入できたときの喜び。」つまり、利用者

    デザイナーだけでなくエンジニアもブックマークしておくべきUI/UXの情報を発信するメディア・ブログ6選|TechClips[テッククリップス]
  • よくわかるダメUI/UX画像コレクション - DOCUMENTS.TIPS

    Oops, removed. Sorry, that page doesn't exist. Please check the link and try again. We built a platform for members to share documents and knowledge. And we are not related to any other website

    よくわかるダメUI/UX画像コレクション - DOCUMENTS.TIPS
  • これだけは押さえておきたいアプリのUXを改善する10の方法

    アプリエンジニア。株式会社マイナースタジオ所属。主に扱っているプログラミング言語はSwiftRubyPHPPython。イカが好き。 ユーザーにストレスなくより良いユーザー体験を提供するためには、細部のUIデザインにも気をつけなければいけません。 今回はこれだけは押さえておきたいUIデザインを紹介します。 1. エラー時は問題の解決方法も載せる たとえば、ネットワークエラー時などには「ネットワークに接続できませんでした」と表示するだけでなく、「ネットワークに接続できませんでした。Wi-fiの設定を確認のうえ、もう一度お試しください」というようにエラーの解決につながる方法を明示した方がより親切です。 2. 画面をスワイプで戻れるようにする iPhone6, iPhone6 Plusがリリースされ、最近では大画面のデバイスが増えてきました。片手操作の場合、画面上部にあるボタンに届かないと

    これだけは押さえておきたいアプリのUXを改善する10の方法
    koda3
    koda3 2016/03/17
  • アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip

    ▼2016/01/25 クラスメソッド×RoomClip×ネイルブック DesignNight http://dev.classmethod.jp/news/design-night-vol-01/ 問い合わせが多かったんですが、使用フォントは「丸丸ゴシック」です RoomClip / http://roomclip.jp/ Read less

    アプリを生み出す現場でUI/UXデザイナーが意識するべきこと:RoomClip
  • 【永久保存版】エンジニア・デザイナー必見!「UI/UX」の基礎が学べるSlideshare30選

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

    【永久保存版】エンジニア・デザイナー必見!「UI/UX」の基礎が学べるSlideshare30選
  • 守ってはいけない、iOSのデザインルール4つ

    ページコントロール(ドット)、ページトップの「送信」、プラス(+)アイコン、並べ替えアイコンの4つは、テストでユーザビリティ上の問題を引き起こすことの多いiOSデザインパターンである。 4 iOS Rules to Break by Aurora Bedford, Raluca Budiu, Kara Pernice, and Amy Schade on July 9, 2015 日語版2015年8月31日公開 巨大ソフトウェア会社(たとえば、AppleMicrosoftGoogle)はユーザーとデザイナー双方のためにデザインガイドラインを作成している。 おかげで、デザイナーや開発者側は、恵まれた条件のもとで、きちんとしたものになることが期待できるインタフェースの作成を始められるようになり、まったく新しいUI要素を考案する(そしてテストする)必要がない。 一方、ユーザー側も、すべての

    守ってはいけない、iOSのデザインルール4つ
  • 1