0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

Xmind开源桌面版UI设计

OSC开源社区 来源:OSC开源社区 作者:OSC开源社区 2022-11-15 11:42 次阅读

Xmind 上个月宣布正式开源其桌面版的 UI 设计,并表示这是首次面向公众分享其 UI 设计。Xmind 是知名的思维导图软件,据称这是 Xmind 在 2008 年推出开源版本后再度拥抱开源。

9597399c-6495-11ed-8abf-dac502259ad0.png

Xmind 在开源公告写道,极简、克制、轻量是 Xmind UI 设计的关键词。通过采用“无感设计”,力求为用户提供更简洁的使用体验、更流畅的交互体验、更无障碍的上手体验。既照顾到新手的易用性,同样也考虑到资深用户的深度需求。

以下内容摘录自 Xmind 开源公告。轻量设计,极致用户友好作为一款效率软件,在进行界面设计时简单高效成为了我们的首要设计原则。我们充分利用留白和简单的元素来构建复杂的交互界面,使其清晰灵活并保持高度的一致性。 在界面设计上我们采用了极简、克制的设计,界面中没有一丝冗余,只将最实用的功能放在软件工具栏上,不做多余的修饰干扰用户,不像其它传统软件各种功能满屏负载,一进来就给你很多选择和压迫感。

95ac319e-6495-11ed-8abf-dac502259ad0.png

我们采用了无障碍设计。在颜色上采用黑白蓝的主要配色,不依赖颜色来传递信息,而是采用高对比度的视觉处理方式,干净、简约、清晰、明朗,在视觉辨认上毫不费力,遵循 WCAG(Web 内容可访问性指南)原则,以确保我们的用户可以在没有任何与颜色相关的障碍的情况下浏览界面,充分考虑到了视力障碍人士的需求。

95c649da-6495-11ed-8abf-dac502259ad0.png

为方便用户更快认知和熟悉软件的功能,样式面板的设计也是我们每年反复推敲的重点。在面板的功能排布上,我们通过对元素、对比度、文字、间距的反复推敲,使其具有清晰的视觉层级。像思维导图一样,样式面板的功能排布也具有清晰的逻辑,让用户可以随取随用,对新手极度友好。

95e749aa-6495-11ed-8abf-dac502259ad0.png

不同平台,一致的使用体验Xmind 是一款跨平台的软件,为了保证用户在各个平台上都拥有相似的使用体验,我们在设计之初就考虑到不同平台下组件样式与系统本身的统一性,最大程度符合用户的使用习惯,而不仅仅只是针对平台做简单的适配。 比如在对于工具栏的设计中,macOS 系统常用的顶部菜单栏在 Windows 中有所缺失,我们便针对 Windows 版进行了改进,在最左侧加入菜单按键。

95fc5f48-6495-11ed-8abf-dac502259ad0.png

针对于两个平台控件样式的不同,我们区分了软件在不同平台内各种控件的圆角与阴影,使其自然和谐。对话框的弹出方式和排列方式也针对不同平台做出相应的调整。

961af6b0-6495-11ed-8abf-dac502259ad0.png

在适应不同系统的设计规范的前提下,最大程度保持了 Xmind 的设计风格,保持用户的熟悉感,降低用户的操作和认知成本。隐形设计,精细打磨精细是 Xmind 设计的另一个关键词。为了让大家拥有更好的使用体验,我们在软件的各个细节上都下足了功夫。小至一个勾选框,一张贴纸,甚至在各种边际情况下也做了充足的考量。 比如在智能配色方案中,如果你去掉了思维导图的背景色,我们会根据感知对比度算法(APCA)为字体设置反色,让你在各种背景颜色下都能保证文字的可读性。 为了优化用户的打印体验,我们在设计贴纸和插画时加入了双重描边来增强识别度,使其在深色背景和浅色背景的打印场景下都有良好呈现,对思维导图本身也进行了黑白打印模式的优化。

96380926-6495-11ed-8abf-dac502259ad0.png

在字体这件事上,除了我们自研的品牌字体 NeverMind 外,我们还专门提供了中日韩字体 (CJK font) 设置,让西方语言文字和中日韩文字混排时可以分别设置各自适合的字体来达到更好的组合使用效果,也避免了一些西文字体不支持中日韩文字而导致缺字的问题。

9672a05e-6495-11ed-8abf-dac502259ad0.png

在 Xmind 中,用户随时都可以知道自己创建了多少个主题,软件可自动适配系统的浅色和深色外观,语言切换也可在软件内秒切,软件字体也可自动跟随系统字体大小变化等。这些细节或许都不易被用户感知到,但都是我们精细思考和设计过的结果。

9717f072-6495-11ed-8abf-dac502259ad0.png

如何使用 Xmind UI 设计工具包?Xmind 的 UI Kit 包括 Xmind 设计的组件、模板、字体、贴纸等组成 Xmind 桌面版 UI 设计的各个元素。点击 Xmind 桌面版 UI Kit 即可获取以上的所有资源。

97779fd6-6495-11ed-8abf-dac502259ad0.png

审核编辑 :李倩

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 软件
    +关注

    关注

    69

    文章

    4680

    浏览量

    87065
  • 开源
    +关注

    关注

    3

    文章

    3210

    浏览量

    42285

原文标题:Xmind开源桌面版UI设计

文章出处:【微信号:OSC开源社区,微信公众号:OSC开源社区】欢迎添加关注!文章转载请注明出处。

收藏 人收藏

    评论

    相关推荐

    航天宏图重磅推出桌面版PIE-Patrol无人机智能巡检软件

    在无人机低空经济与人工智能飞速发展的时代,航天宏图凭借其深厚的行业底蕴和前瞻性的视野,在无人机巡检云服务平台基础上,重磅推出桌面版PIE-Patrol无人机智能巡检软件。该软件通过深度融合无人机巡检
    的头像 发表于 08-02 15:56 389次阅读

    VA段码COG液晶屏可个性化灵活设计UI,实现创意UI的高对比高亮多色彩炫酷显示。

    VA段码COG液晶屏可个性化灵活设计UI,实现创意UI的高对比高亮多色彩炫酷显示。
    的头像 发表于 07-11 10:50 431次阅读
    VA段码COG液晶屏可个性化灵活设计<b class='flag-5'>UI</b>,实现创意<b class='flag-5'>UI</b>的高对比高亮多色彩炫酷显示。

    使用 GPT4V+AI Agent 做自动 UI 测试的探索

    的工具,但是这些工具的投入产出比一直被质疑,自动化率越多维护成本越高,大部分都做着就放弃了,还有一部分在做与不做间纠结。 本文结合一些开源的项目探索使用GPT 自动做 UI 测试的可能性。 二、方案选型 当前UI 的主要问题:一
    的头像 发表于 06-20 15:42 357次阅读
    使用 GPT4V+AI Agent 做自动 <b class='flag-5'>UI</b> 测试的探索

    OpenAI推出ChatGPT桌面版应用程序

    OpenAI 近日宣布,备受期待的 ChatGPT 桌面版应用程序现已正式发布。在官方公告中,OpenAI 表示他们首先会将这款应用提供给 Plus 用户群体,并特别针对 macOS 系统推出。这是该公司为了满足用户对更便捷、更高效交流方式的需求而采取的重要一步。
    的头像 发表于 05-14 11:51 967次阅读

    Ubuntu 24.04 LTS发布:采用GNOME 46桌面环境,新增ZFS安装支持

    此版本的亮点包括强化桌面版安装器的辅助功能,简化自定义配置导入操作;更改默认安装选项:由原来的Minimal更改为Default,Normal更改为Extended。
    的头像 发表于 04-12 16:26 1475次阅读

    桌面显示器PD芯片:桌面显示技术的新篇章

    桌面显示器
    的头像 发表于 03-25 09:44 758次阅读
    <b class='flag-5'>桌面</b>显示器PD芯片:<b class='flag-5'>桌面</b>显示技术的新篇章

    好,自制一个桌面萌宠

    忙碌时光里相伴,治愈各种不开心,谁还没有个梦中“萌宠”了?想要的不离不弃,却因为各种原因还在寻寻觅觅、犹犹豫豫……好,那就自制一个桌面宠物——今天特别分享@有出息的男孩_大佬的开源佳作。简单可爱自带憨态,很适
    的头像 发表于 02-24 08:04 1180次阅读
    好,自制一个<b class='flag-5'>桌面</b>萌宠

    【AWTK开源智能串口屏方案】设计UI界面并上传到串口屏

    本篇文章将介绍如何使用AWStudio设计串口屏端的UI界面和添加绑定规则,以及怎么将资源文件上传到串口屏端。引言:AWTK-HMI是基于AWTK与AWTK-MVVM开发的低代码智能串口屏方案,本系
    的头像 发表于 02-22 08:24 618次阅读
    【AWTK<b class='flag-5'>开源</b>智能串口屏方案】设计<b class='flag-5'>UI</b>界面并上传到串口屏

    鸿蒙实战开发-全局UI方法的功能

    使用全局UI的方法定义日期滑动选择器弹窗并弹出。
    的头像 发表于 02-02 17:13 527次阅读
    鸿蒙实战开发-全局<b class='flag-5'>UI</b>方法的功能

    【核桃派1B 开发板试用体验】注入灵魂

    个镜像,分别是定制版Debian和无桌面版本。 根据我的需要,我安装定制版Debian,打开官方给的网盘地址: 百度网盘链接:https://pan.baidu.com/s
    发表于 01-10 13:18

    基于TouchGFX的智能手表设计 —底层驱动与 UI 进行关联

    电子发烧友网站提供《基于TouchGFX的智能手表设计 —底层驱动与 UI 进行关联.pdf》资料免费下载
    发表于 01-05 11:22 2次下载

    基于 TouchGFX 的智能手表设计—Designer 软件 UI 设计

    电子发烧友网站提供《基于 TouchGFX 的智能手表设计—Designer 软件 UI 设计.pdf》资料免费下载
    发表于 01-05 11:06 0次下载

    【核桃派1B 开发板试用体验】vnc远程桌面体验

    到最新的版本,2023年12月29日之前的版本都有设置后重启卡死。 打开vnc,新建一个连接: 然后打开就输入登录密码就可以进入桌面版了: 【总结】 vnc桌面连接花了不少时间,换了两个版本的镜像才好。 厂家技术非常给力,第一时间收到信息后修改好镜像分享。
    发表于 01-02 16:14

    【核桃派1B 开发板试用体验】+系统安装与基本功能测试篇

    版Debian和无桌面版本。 · 桌面版(desketop版) 可体验更像Windows系统般的桌面环境,系统预装了丰富的应用软件,开机即用。其包含C、Python编程软件、谷歌浏览器、LibreOffice
    发表于 01-02 09:47

    OpenHarmony开源GPU库Mesa3D适配说明

    (利用了图形加速硬件)依赖于显示设备厂家的硬件及实现。 OpenGL API实现的方式又分为闭源及开源两种方式。闭源实现一般由设备厂家完成,这种方式充分保证了它的高效性,但移植起来比较麻烦。今天我们要重点
    发表于 12-25 11:38