ふくやま | COMPASS

教育系のプロダクトの会社でUIデザイナーをしています。とても可愛いオス猫を飼っています。

ふくやま | COMPASS

教育系のプロダクトの会社でUIデザイナーをしています。とても可愛いオス猫を飼っています。

マガジン

最近の記事

  • 固定された記事

理想のデスク環境ができたので自慢します2022

noteのデスクをすっきりさせるマガジンに出会い、ケーブルを全力で排除し、理想を追求する姿勢に感銘を受けました。 私はフルリモートの職場なので、毎日8時間以上自宅デスク過ごします。「そこそこ」ではなく「大満足」のビジュアルにしたい・・・。 やるぞ!と立ち上がったものの、生来の優柔不断が災いしパーツや色選びに手間取り半年がかりのプロジェクトに。遂に毎日るんるんで仕事できる理想のデスク環境ができましたので、憧れだったデスク自慢noteを書きます! レイアウト壁の方を向いてるの

    • 🍎HIGざっくりまとめ Patterns編 vol. 10 Live-viewing apps(ライブビューイングアプリ)

      ライブビューイングアプリには、他のtvOSアプリとは異なる、いくつかのユニークなデザイン上の課題があります。とりわけ、アプリはライブコンテンツを高め、優先させる必要があります。どの画面でも、ライブコンテンツに目を向けさせ、一目でVODコンテンツと見分けがつくようにするのです。 ベストプラクティスライブコンテンツを目立つように配置し、簡単にアクセスできるようにする。 ユーザーはテレビを見るためにアプリを利用するので、アプリを起動してからコンテンツが再生されるまでの間隔を短くし

      • 🍎HIGざっくりまとめ Patterns編 vol. 8 Going full screen(フルスクリーン化)

        iPhone、iPad、Macはフルスクリーンモードで、システムコントロールやアプリコントロールを、人が操作するまで隠しておくことができるため、気が散らない環境を作ることができます。 ベストプラクティスフルスクリーンモードは、あなたの体験にとって意味がある場合に有効にしてください。 ゲームをしたり、メディアを再生したり、没入型のタスクを実行したりするときにフルスクリーンモードが喜ばれますが、すべてのアプリがそのような体験を可能にするわけではありません。たとえば、macOSの

        • 🍎HIGざっくりまとめ Patterns編 vol. 6 Entering data(フィードバック)

          フィードバックは、現状を把握し、次に何をすべきか、行動の結果を理解し、失敗を回避するのに役立ちます。 アプリやゲームの操作に際して、明確で一貫したフィードバックを提供することで、直感的に理解でき、より深い探求を促すことができます。フィードバックは、次のようなさまざまなことを伝えることができます。 何かの現在の状態 重要な任務や行動の成功または失敗 悪い結果を招く可能性のある行為についての警告 ミスや問題状況を修正する機会 最も効果的なフィードバックは、情報の重要性

        • 固定された記事

        理想のデスク環境ができたので自慢します2022

        マガジン

        • UXリサーチ
          8本
        • デザインシステム
          8本
        • 🍎HIGざっくりまとめ
          19本

        記事

          🍎HIGざっくりまとめ Patterns編 vol. 5 Entering data(データ入力)

          情報入力は、どのようなインタラクション手法を用いても、面倒な作業になります。できるだけ多くの情報を事前に収集し、入力に必要なデータ量を最小限に抑えるとともに、利用可能なすべての入力方法をサポートし、利用者が自分に適した方法を選択できるようにすることで、利用体験を向上させることができます。 ベストプラクティス可能な限りシステムから情報を取得する。 位置情報やカレンダー情報など、設定から自動的に収集できる情報や、本人の許可が必要な情報については、提供を求めないようにしましょう。

          🍎HIGざっくりまとめ Patterns編 vol. 5 Entering data(データ入力)

          🍎HIGざっくりまとめ Patterns編 vol. 4 Drag and drop(ドラッグ&ドロップ)

          ドラッグ&ドロップで、選択した写真やテキストなどのコンテンツを別の場所に移動したり、複製したりすることができます。 iOS、iPadOS、macOSは、タッチスクリーン上のジェスチャー、ポインティングデバイスとのインタラクション、そしてフルキーボードアクセスモードによるドラッグ&ドロップをサポートしています。さらに、Universal Controlを使えば、MacとiPadの間でコンテンツをドラッグすることもできます。Macでは、VoiceOverのユーザーもドラッグ&ド

          🍎HIGざっくりまとめ Patterns編 vol. 4 Drag and drop(ドラッグ&ドロップ)

          🍎HIGざっくりまとめ Patterns編 vol. 3 Collaboration and sharing(コラボレーションと共有)

          優れたコラボレーションと共有の体験は、シンプルで応答性が高く、コンテンツに集中できる一方で、他者との効果的なコミュニケーションを可能にします。 システムインターフェイスとメッセージアプリは、コラボレーションや共有のための一貫した便利な方法を提供するのに役立ちます。例えば、メッセージの会話にドキュメントをドロップしたり、使い慣れた共有シートで宛先を選択することで、コンテンツを共有したり、コラボレーションを開始したりすることができます。 ベストプラクティス共有ボタンをツールバ

          🍎HIGざっくりまとめ Patterns編 vol. 3 Collaboration and sharing(コラボレーションと共有)

          🍎HIGざっくりまとめ Patterns編 vol. 2 Charting data(データのチャート化)

          チャートは、多くのテキストを読み解くことなく、複雑な情報を効率的に伝えることができる方法です。また、チャートはグラフィカルであるため、ユーザーエクスペリエンスの個性を表現したり、インターフェースに視覚的な面白さを加えたりすることも可能です。 ※チャートの作成に使用するコンポーネントについては、「チャート」を参照してください。 チャートは、一目でわかる情報を提供するシンプルなグラフィックから、アプリの目玉となるリッチでインタラクティブな体験まで、さまざまな角度からデータを探

          🍎HIGざっくりまとめ Patterns編 vol. 2 Charting data(データのチャート化)

          🍎HIGざっくりまとめ Patterns編 vol. 1 Accessing private data(個人情報へのアクセス)

          アプリやゲームを信頼してもらうためには、プライバシーに関連するデータやリソースが必要で、それらをどのように使っているのかを透明にしておく必要があります。 人々は非常に個人的な方法でデバイスを使用しており、アプリが自分のプライバシーを保護するのに役立つことを期待しています。人々を追跡したり、データやデバイスリソース(広告識別子を含む)にアクセスする許可を要求することに加え、アクセスを許可されたデータを保護することが不可欠です。 許可申請アクセスするために許可を求めなければなら

          🍎HIGざっくりまとめ Patterns編 vol. 1 Accessing private data(個人情報へのアクセス)

          🍎HIGざっくりまとめ Foundations編 vol. 11 Typography(タイポグラフィ)

          タイポグラフィーは、読みやすさを確保するだけでなく、情報階層の明確化、重要なコンテンツの伝達、ブランドの表現に役立ちます。 ベストプラクティス多くの人が読みやすい最小フォントサイズを維持するように努めます。 ピクセル密度や明るさなど、デバイスのディスプレイの違いは、適切な最小フォントサイズに影響を与える可能性があります。また、読み手とディスプレイの距離、視力、動いているかどうか、環境光の状態など、その他の要因も読みやすさに影響します。 Dynamic Typeをサポートする

          🍎HIGざっくりまとめ Foundations編 vol. 11 Typography(タイポグラフィ)

          🍎HIGざっくりまとめ Foundations編 vol. 10 SFシンボル

          SFシンボルは、サンフランシスコのシステムフォントとシームレスに統合され、あらゆるウェイトとサイズのテキストと自動的に整列する、一貫性があり高度に設定可能な何千ものシンボルを提供します。 ナビゲーションバー、ツールバー、タブバー、コンテキストメニュー、テキスト内など、インターフェースのアイコンが表示される場所であればどこでも、オブジェクトやコンセプトを伝えるためにシンボルを使用することができます。 個々のシンボルや機能の利用可能性は、対象とするシステムのバージョンによって

          🍎HIGざっくりまとめ Foundations編 vol. 10 SFシンボル

          🍎HIGざっくりまとめ Foundations編 vol. 9 Right to left

          Right to left(右から左)アラビア語やヘブライ語などの右から左へ読む言語をサポートするため、必要に応じてインターフェースを反転させ、関連する言語の読み方を一致させることができます。 システム提供のUIフレームワークはデフォルトで右から左(RTL)をサポートしており、システム提供のUIコンポーネントはRTLコンテキストで自動的に反転することが可能です。 システム提供の要素と標準的なレイアウトを使用する場合、アプリの自動反転インターフェースに変更を加える必要がない

          🍎HIGざっくりまとめ Foundations編 vol. 9 Right to left

          🍎HIGざっくりまとめ Foundations編 vol. 8 モーション

          Motion(モーション)あらゆるプラットフォームで、美しく流れるようなモーションがインターフェースに生命を吹き込み、ステータスを伝え、フィードバックや指示を与え、視覚体験を豊かにしています。 システムコンポーネントには自動的にモーションが含まれます カスタムモーションを設計する際には、ユーザーのアクションに応じた明確なフィードバックを提供し、ユーザーが圧倒されることなく習得できるようにします。 要点 アニメーションをつけることを目的としない 過剰なアニメーションは人

          🍎HIGざっくりまとめ Foundations編 vol. 8 モーション

          🍎HIGざっくりまとめ Foundations編 vol. 7 マテリアル

          Materials(マテリアル)Appleのプラットフォームでは、マテリアルが背景に半透明とぼかしを与えることで、前景と背景のレイヤーを視覚的に分離する感覚を得ることができます。 マテリアルは、Vibrancy(バイブランシー)と組み合わせることで、インターフェイスに視覚的な面白さを加えることができます。 ↓上の説明ではピンと来ませんね。例えばこういうメニューバーやボタン、検索窓だけ透けてるような表現です。 マテリアルとは 平たくいうと背景。コンテンツが載る土台ってこ

          🍎HIGざっくりまとめ Foundations編 vol. 7 マテリアル

          🍎HIGざっくりまとめ Foundations編 vol. 6 インクルージョン

           2022年6月7日、AppleのHuman Interface Guidelinesが改訂されました。これを期にしっかり読み込み、個人的視点からのざっくりなまとめを記していきます。 ※私はブラウザで動くWEBアプリーケーションのUIをデザインしています。その視点から大切だと思った点を残してくので、対象外のデバイスや各プラットフォームの細やかな話は端折っています。 Inclusion(インクルージョン)インクルーシブなアプリは、敬意あるコミュニケーションを優先し、誰もがア

          🍎HIGざっくりまとめ Foundations編 vol. 6 インクルージョン

          🍎HIGざっくりまとめ Foundations編 vol. 5 レイアウト

           2022年6月7日、AppleのHuman Interface Guidelinesが改訂されました。これを期にしっかり読み込み、個人的視点からのざっくりなまとめを記していきます。 ※私はブラウザで動くWEBアプリーケーションのUIをデザインしています。その視点から大切だと思った点を残してくので、対象外のデバイスや各プラットフォームの細やかな話は端折っています。 Layout(レイアウト)レイアウトガイドは、画面上のコンテンツの位置や配置、間隔を調整するのに役立つ長方形

          🍎HIGざっくりまとめ Foundations編 vol. 5 レイアウト