Return to Blog Homepage

Xmind UI Design Now Is Open-Source

blog image

Xmind UI Design Now Is Open-Source

image

As the pioneer in the field of mind mapping software, sharing knowledge, embracing innovation and user-first have always been the beliefs we uphold. As early as 2008, Xmind launched an open-source version, and our font 'NeverMind' is also open and free for commercial use.

This is the first time our UI design made public and shared. It is to show our dedication to design for our users, as well as our contemplation to keep innovating and striving for meticulousness and excellence.


image

Highly Unified Design Language.

The Consistency

A great design is not defined by how good it looks but by how it could combine its functions and uses for users. We care deeply about how our software interacts with our users - this is what truly values our purpose of bringing the best experience to our users.

Xmind has a perfect adaptation to different platforms. As a cross-platform software, we consider the characteristics of different operating systems and make compliance with system specifications to meet our users' habits to a greater extent. For example, in the design of the toolbar, the top menu bar commonly used in macOS systems is missing in Windows, so we improved it for the Windows version by adding the menu button on the far left. image 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 natural and harmonious for each platform. image

Keeping the Interface Light and Airy.

No Fussy, Only Comfort and Quality

Simplicity and efficiency are our primary design principles. We make full use of white space and simple elements to achieve complex interaction interfaces that are clear, flexible, and highly consistent, and to comprehensively facilitate our users to be familiar with the software functions faster.

The panels and toolbars are minimally restrained-designed with no hint of redundancy in the interface, with a small number of controls, partitioned according to function logic. image 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 clear visual hierarchy of information through repeated deliberation on contrast, text, and element spacing.

Each section is empowered with clear functional purposes, and each action button serves exactly as its function should. There's no chaos in the toolbars and working panels. image

Ultimate User-Friendly

We believe that exceptional design is essential to define and maintain a superb experience for the users. A question that we always ask ourselves rhetorically: As a product, when stripped of the coating fancy, do you still love it? Does it still work for you?

We constantly remind ourselves by distilling information, polishing them, making necessary additions and subtractions, and reorganizing our design conceptually.

For instance, when it comes to color design, we make additions. The primary toolbars and action buttons all use the main color scheme of black, white, or blue. We analyze the color hue, lightness, and saturation to choose accessible colors for users with visual deficiency. We also follow the WCAG (Web Content Accessibility Guidelines) principles to ensure our users can navigate across the interface without any color-related obstacles. image 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.

Less is more. So when you ask us how to get started as a fresh rookie in mind mapping, we are more than confident to show you that you are fully equipped. When you open a new canvas in Xmind, you are ready to go. No complex designs or settings would confuse you.

Pay Attention to the Neglected.

Polished Details

Printing out mind maps is an essential scenario, especially when you print in black and white. You would probably know that we have many fun and creative stickers and illustrations that are carefully crafted by our designers. But we found that this was not enough. As the printing quality varies, it could be difficult to identify the stickers and illustrations in mind maps. So what we did was add an extra border to enhance the visual contrast and recognition. image As for the language setting, it is easily switched in a second within Xmind. You don't need to restart the app at all. CJK font settings are provided as well. This avoids the problem that some western fonts do not support CJK fonts and lead to missing characters. image

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

The system texts are center-aligned, just like the closing credits at the end of the movie which makes it visually agreeable and easy to search for certain texts. The display resolution in Xmind adapts to your system scales. Whether you need your display to be default, smaller or larger space, it changes automatically with your system preference. image All these details may not be easily perceived by users, but they are the result of our meticulous thinking in design.

We always put our users in first place.

Many have seen the fine logic behind our design principles, the dedication we uphold, and the embracement of sharing knowledge, ideas, and innovations openly. This also attracts people to imitate. But we do not see this as a bad thing at all. By all accounts, the fact that we are being imitated is a testament to our exceptional design and user experience.

We also hope to connect and attract more like-minded people who are passionate about design. We look forward to walking side by side with you in the pursuit of excellence.


How to Use Xmind UI Design Kit?

Xmind UI Kit includes all our design components: templates, fonts, stickers, illustrations, and other elements. You can go to Xmind UI Kit for Desktop to get all the above resources. image

Try Xmind Free
Try Xmind Free
We use cookies to provide, improve, and promote our service. We do not leak or sell the collected data to third parties. By continuing, you consent to our Privacy Policy.