2022/10/17

Xmind UIデザインは現在オープンソースです

マインドマッピングソフトウェアの先駆者として、知識の共有、革新を受け入れ、ユーザーファーストの信念を常に大切にしています。2008年にはすでにXmindはオープンソース版を発表しており、フォント「NeverMind」も商業利用が可能で自由に使えます。

今回初めてUIデザインを公開し共有することにしました。これはユーザーのためにデザインするという私たちの献身と革新を続け、細部にまでこだわり、卓越を追求するという私たちの考えを示しています。

Text design featuring the words

高度に統一されたデザイン言語。

一貫性

優れたデザインは見た目の良さだけでなく、ユーザーのために機能と使い勝手をどう組み合わせるかで定義されます。私たちはソフトウェアがユーザーとどのように相互作用するかに深く関心を持っています - これこそが私たちがユーザーに最高の体験を提供する目的を実現する本質です。

Xmind

完璧な適応

を異なるプラットフォームに対して実現しています。クロスプラットフォームソフトウェアとして、異なるオペレーティングシステムの特性を考慮し、システム仕様に準拠してユーザーの習慣により対応するようにしています。例えば、ツールバーのデザインにおいて、macOSシステムでよく使われるトップメニューバーがWindowsにはないため、Windows版ではメニューボタンを左端に追加して改善しています。

Whenever you interact with the Xmind system to call out an action, the action sheet will present in the same way as how your system would present to you. There would be no disconnecting feeling in the interaction.We differentiated the rounded corners and shadows of the various controls to make them

自然で調和のとれた

各プラットフォームで。

Two application windows side by side: one on a blue background with a Windows interface, the other on an orange background with a macOS interface.

インターフェースを軽やかに保つ。

面倒なことはなく、快適さと品質のみ

シンプルさと効率性は私たちの主要なデザイン原則です。余白とシンプルな要素を駆使して、複雑な相互作用インターフェースを明確で柔軟性に富み、一貫性の高いものにし、ユーザーがソフトウェアの機能に速く慣れるよう包括的に促進しています。

パネルとツールバーは最小限に制約されたデザインで、インターフェースに冗長性はなく、機能ロジックに基づいて区分けされた少数のコントロールがあります。

The design of the format panel has always been one of the focuses of our annual retrospection. The layouts are designed to be logically structured, and we ensure a

明確な視覚階層

情報のコントラスト、テキスト、要素間隔の繰り返し議論を通じて明確な機能目的を強化しており、各操作ボタンはその機能にふさわしい役割を果たします。そこにはツールバーや作業パネルに混乱はありません。

User interface screenshot of a mind mapping tool, showing options for shapes, lines, text styles, and layout themes.

究極のユーザーフレンドリー

優れた体験を定義し維持するためには優れたデザインが不可欠と私たちは信じています。常に自問する質問:製品として、華やかな外見を取り除かれたとき、それをまだ愛せますか? まだあなたにとって機能しますか?

情報を抽出し、磨き、必要な追加や削除を行い、概念的にデザインを再整理することで常に自分たちを奮い立たせています。

例えば色彩設計について言えば、追加を行っています。主なツールバーとアクションボタンは全て黒、白、青のメインカラーを使用しています。色相、明るさ、彩度を分析して視覚障害のあるユーザーにもアクセスしやすい色を選択しています。また私たちは

WCAG(ウェブコンテンツアクセシビリティガイドライン)の原則

に従い、色関連の障害なくインターフェースを移動できることを確保しています。

And there’s also subtraction in our design. In the design of the sheet bar at the bottom, it only becomes visible when you need multiple canvases.

少ないほど多い。だから、新人としてマインドマッピングをどう始めるのか聞かれると、自信を持って装備が整っていることをお見せできます。Xmindで新しいキャンバスを開くだけで、すぐに始めることができます。複雑なデザインや設定が混乱を招くことはありません。

見過ごされがちなことに注意。

磨き抜かれた詳細

マインドマップの印刷は特に白黒で印刷する際に重要なシナリオです。私たちのデザイナーが丁寧に作り上げた楽しいクリエイティブなステッカーやイラストがたくさんあることをご存じかもしれません。しかしこれだけでは十分ではありません。印刷品質が異なると、マインドマップ内のステッカーやイラストを認識するのが難しくなることがあります。そこで私たちは、ビジュアルのコントラストと認識力を強化するために余分な枠を追加しました。

CJKフォント設定

も提供しています。これは、西洋フォントの一部がCJKフォントをサポートせず、文字欠落を引き起こす問題を回避します。

In the sheet bar, we have a topic counting function in the right corner, which allows you to track your ‘idea branches’.

システムテキストは映画の終わりのクレジットのように中央揃えされており、視覚的に心地よく、特定のテキストを検索しやすくしています。Xmindの表示解像度はシステムのスケールに適応します。表示がデフォルト、より小さい、またはより大きいスペースを必要としても、システム設定に応じて自動的に変化します。

All these details may not be easily perceived by users, but they are the result of our meticulous thinking in design.

常にユーザーを第一に考えています。

多くの方が私たちのデザイン原則の背後にある論理の巧妙さ、私たちの掲げる献身、および知識、アイデア、革新のオープンな共有を感じ取ってくれています。これが模倣者を引き付けます。しかし、私たちはこれを悪いこととは全く思っていません。いずれにせよ、私たちが模倣されているという事実は、私たちの優れたデザインとユーザー体験の証拠なのです。

私たちはデザインに情熱を持つ同じ志を持つ人々とつながり、引きつけたいとも願っています。卓越を追求する過程であなたと共に歩むことを楽しみにしています。

どうやってXmind UIデザインキットを使いますか?

Xmind UIキットには私たちの全てのデザインコンポーネント:テンプレート、フォント、ステッカー、イラスト、その他の要素が含まれています。以下にアクセスして

Xmind UIキット for Desktop

からこれらのリソースを全て入手できます。

Xmind desktop UI kit showcasing design elements, icons, and interface tools on a white background.

もっと投稿