usagimaru

Software Designer / UI Architect / Developer; デザイナーとしてGUIの設計を考える傍ら、AppleプラットフォームでmacOSやiOSのアプリケーション開発も行っています。Apple Developer Program加入者です。

usagimaru

Software Designer / UI Architect / Developer; デザイナーとしてGUIの設計を考える傍ら、AppleプラットフォームでmacOSやiOSのアプリケーション開発も行っています。Apple Developer Program加入者です。

    • ソフトウェアデザインとUIの構造設計

      ソフトウェアデザイン分野における構造設計に関する考え方や方法論を紹介します。 特にUIデザインの「裏側」とされる分野に焦点を当て、情報アーキテクチャ、モデリング、構造化、インタラクションなどの直接“見た目”ではないUIデザインを中心に、さまざまな考え方や方法論を気まぐれに紹介します。

      • ソフトウェアデザインとUIの構造設計

    • 固定された記事

    モデルベースUIデザイン—構造化UIデザインの発想と方法論

    ユーザーインターフェイス（UI）のデザインに強く求められる技術や能力を列挙するとしたら、私は “情報を整理する能力” をまず挙げます。デザイナー職に対する世間一般の認識は「なんとなく絵を描くのが得意な人」だと思うのですが、絵が得意か不得意かはあまり本質的ではなく、情報をどのように整理して適切に表現できるのかが重要だと考えます。 UIデザインにおける “情報を整理すること” をもう少し詳しく説明すると、「設計コンセプトを形にし、コンセプトに基づく適切な部品の姿や機能を記述し、

    usagimaru

      • 実例から考えるUIの情報設計

        情報設計とは、端的に言うと「情報に関する混乱を整えて、理解しやすい形にする行い」です。情報設計というとなんとなくWebデザインやUIデザインに関する専門的な分野として認識されることが多いかもしれませんが、“情報” に関することなので、情報があるところには基本的にどこにでも通用します。 情報設計の専門書を漁ってみると、“ふわっとした” 話か、Webサイト設計の話に終始するものが多いのですが、本来はWebサイト設計以外の分野にも通用する考え方です。今回はiOSなどのアプリケーシ

        usagimaru

        • Apple Studio Displayを2台のMacで運用する構成

          Studio Displayには入力（アップストリーム）として1つのThunderbolt 3ポートを持ちますが、これだと複数台のデバイスで共用するにはあまり都合が良くありません。他社製モニターの中には入力を複数持っていて切り替えが可能なものがありますが、Studio Displayではその運用ができないため、限られた方法の中から複数台で共用する方法を検討しなければなりません。 Studio Displayとの接続方法の検討過去記事でも検討しましたが、改めてStudio D

          usagimaru

          • Apple Studio Displayの開封に至るまでの話

            最初に注文をかけてから待つこと5ヶ月、ついにApple Studio Displayが手元に到着したのでその開封の様子と、そこに至るまでの小話をちょっと書いてみます。思い返せばこの5ヶ月間ずっとディスプレイのことを考えていたような気がします。 選んだスペックとNano-textureについて過去記事でも散々検討したのですが、結局は次のような構成にしました。 標準ガラス 傾きと高さを調節できるスタンド AppleCare+ 既存のiMac 27”がNano-textu

            usagimaru

          マガジン

          マガジンをすべて見る すべて見る
          • ソフトウェアデザインとUIの構造設計
            usagimaru

          記事

          記事をすべて見る すべて見る

            macOSをミュートするショートカット

            ショートカットには「音量」アクションが備わっていますが、音量値をいじらずに直接「ミュート」をトグルするためのアクションがありません。なので、ミュート状態にするには次のいずれかの方法をとることになります。 音量を“0”に設定するトグルを諦めるならば、単純に値0の音量を設定すれば実質的にミュートになります。「音量を設定」アクションを任意に配置し、音量値を0にします。 これでMacからは音が出なくなりますが、キーボードのミュートキーを押してもミュート前（音量変更前）の音量には戻

            usagimaru

            UI構造設計：導入—プラットフォーム思考とデザイナーの視点

            ソフトウェアUIデザインにおける構造設計の前提となるデザインの考え方。 ・・・ このシリーズは、ソフトウェアデザインの手引きとなるような考え方や方法論を複数回に渡って紹介するものです。ソフトウェアデザインの中でも特に「UIデザイン」に焦点を当てながら、その構造設計の分野に迫ります。その折、情報設計と呼ばれる分野にも触れていきますが、筆者は情報設計または情報アーキテクチャ（IA）の専門家というわけでもないため、そこを重点的に説くことは致しません。 このシリーズでは、Web

            usagimaru

            AAC変換のクイックアクションをShortcuts.appで作る

            macOSのShortcuts appにはシェルスクリプトを実行するアクションが備わっています。iOSのShortcuts appではシェルスクリプトを実行できませんが、macOSではシェルを活用することでiOSよりも凝ったショートカットを作れます。 Terminalの使用に慣れていればわざわざショートカットで実行する必要はないように思うかもしれませんが、例えば定型実行するようなコマンドであればショートカットにした方が楽に実行できて便利なこともあります。 今回は、入力に任

            usagimaru

            Studio DisplayとMac環境の構成検討

            この記事はStudio DisplayおよびMac Studio未発売の時期に執筆しています。未確認・未確定情報を含みます。 追記：実際にStudio Displayを購入して接続構成を検討しました。 目当てiMac 27インチをStudio Display + Mac Studioの構成に置き換えること。 ディスプレイ環境の検討 – 基本スペックiMac 27インチのRetinaディスプレイとStudio Displayのスペックを比較します。Appleの仕様ページに

            usagimaru

            何でもかんでも“UX”と言うのをやめる

            解釈は人それぞれなのかもしれませんが、この業界には何でもかんでも“UX”を付けたがる癖があります。私はこの流行りには乗らずに物事を分けて考えてみたいです。 言葉の定義と解釈など ユーザーインターフェイス（UI）の設計を表す言葉に関して、それをわざわざ「UX〜」と言い換える事例が国内外問わず多くあり、本来この“UX”と呼ばれるはずのものがどこか蔑ろにされているようにも感じられます。言い換えの例としては次のような具合です。 “UX”という言葉がバズワードになり、Xの文字がど

            usagimaru

            ネイティブアプリケーションの意味

            プラットフォームによってはアプリケーションの実装技術には複数の方法があり、開発側の要件や制約、好み等に合わせて適した技術を選ぶことができます。例えばiOSアプリケーションの実装技術には、Appleが提供するCocoa Touch（およびUIKitやSwiftUIなどのフレームワーク群）がありますが、そのほかのベンダーから提供されている技術として、FlutterやReact Native, Titanium, Xamarinなどのフレームワークも存在します。 どのフレームワー

            usagimaru

            デスクトップGUI：フォーカスの勘所

            フォーカスの定義デスクトップGUIでいう「フォーカス」の意味を次のように置いて考えます。 GUIにおいて、ユーザーからの入力を受け付ける状態を示すもの。イベントの送信対象。多くの実装例ではユーザーが選択したものを直接知覚できるようにビジュアルでフォーカスが明示されるが、ビジュアルが示されない暗黙的なフォーカスも存在する。クリックしたらアクティブ状態（＝フォーカスがある）になったり、逆に非アクティブ状態（＝フォーカスがない）にもなる。 フォーカスはユーザーが今この瞬間に何を

            usagimaru

            UIデザインのカラーマネージメント環境を考える

            モニターの発色性能と個体差DTPや映像の世界ではカラーマネージメント（Color Management）と呼ばれる工程が非常に重視されます。ざっくりいえば、モニターで見る「色」と、プリンタなどそのほかの装置から出力される「色」と、デジタルデータの「色」、それぞれを統一的に管理して、クリエイターが求めている「正しい色」というものを得るための仕組みです。『色なんてRGB値を合わせておけばズレることなんてないじゃないか』と思われるかもしれませんが、私たちが普段目で見ているモニターの

            usagimaru

            誠実さで製品を選ぶ

            使用する製品（サービス、ツール、ソフトウェア）を選ぶ際の指標みたいなものとして、私の場合は製品そのものや作っている人々の「誠実さ」を特に重視しています。人によってはこの指標が「価格」だとか「機能性」だとかに重きが置かれることがあると思いますが、私には価格の安さやポイント還元率よりもこれらが優先されます。 ITサービスなら、まずプライバシーへの姿勢を強く重視します。どんなに価格が安くポイント還元率が高かろうと、自身のプライバシーを損なうサービスはなるべく利用したくありません。

            usagimaru

            マルチペイン型UIの設計観点／iOS 14の新しいスプリットビュー

            デスクトップ向けのアプリケーションやWebサイトなどでよく見られるパターン「マルチペイン型UI」の設計とその考え方を深掘りしてみます。今回は特にiOSにおけるiPad向けの新しいスプリットビュー／サイドバーのスタイルについて触れたいと思います。 ※iPadOSもiOSで括っています。 この記事の対象読者は次のような属性の方を想定しています： ・UIデザイナー ・iOSデベロッパー ・iPadのネイティブインターフェイスを設計しようとしている マルチペインに関わる要素と言

            usagimaru

            MacとネイティブインターフェイスとGUIの原理に関する考察

            macOSネイティブアプリケーション（Mac app）がもっとも美しい姿を見せるのは、Dockにアプリケーションの姿が「アイコン」として現れ、デスクトップの上で「特定の何か」に縛られることなく個々のウインドウが様々な大きさで自由に浮遊している、まさにその時であると私は思います。そしてその瞬間、Macと対峙した私は無限の力を得たかのような錯覚をして、創造力を掻き立てられ、画面の向こう側に確実に在るオブジェクトたちと直接的に戯れることができます。そこでは、私が予想した通りに求めた

            usagimaru

            GUIの「こちら側」からのデザイン #macosnative

            この記事は、2019年7月7日に開催されたmacOSネイティブアプリケーション開発を主題としたイベント macOS native symposium #04 での同名公演を記事化したものです。MacやmacOSのGUIデザインをテーマに「入力方法」に関するデザインの観点を考察しました。 GUIというとどうしても画面表現の方法について考えてしまいがちですが、ユーザーインターフェイスである以上はその入力方法にも着目しなければなりません。今回は、私たちがどのようにしてMacを操作

            usagimaru