界面改进提案投票与意见征集

本贴最后更新于 264 天前,其中的信息可能已经时异事殊

提案:界面降噪,减少使用边框

关联 GitHub Issue:Issue #12970 · siyuan-note/siyuan

这是思源目前的界面,顶栏底栏和侧栏都各自有边框,看起来会有一点杂乱:

image.png

隐藏边框后将会更干净、融合与现代化,用户可以更专注于功能,不需要关心顶栏底栏和侧栏的边界(用颜色区分功能界面和编辑器即可):

image.png

我安装了集市中下载数量最高的 10 个主题,其中 8 个去掉了边框,现在征集意见是否要在本体改进这一点。

是否支持隐藏默认主题中顶栏底栏和侧栏的边框?

单选 公开 永不结束 88 票
支持隐藏边框
32% 29 票
反对隐藏边框
67% 59 票

欢迎回帖讨论。

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    26504 引用 • 110244 回帖 • 1 关注
2 操作
JeffreyChen 在 2024-11-03 10:06:15 更新了该帖
JeffreyChen 在 2024-11-03 09:57:56 置顶了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • chenshinshi 1 赞同

    image.png

    支持用色块替代边框区分。

  • Near via macOS

    建议开发垂直标签页,参考 edge 浏览器的垂直标签页。

  • 我大概看了一下下载数前 10 的主题,没有边框的都有颜色或间距的区分。我不支持仅隐藏边框。

    Dark+

    image.png

    Rem

    image.png

    tsundoku

    image.png

    minivlook

    image.png

    1 回复
    • Asri
      image.png
    • Dark+
      image.png
    • 任我行
      image.png
    • Rem
      image.png
    • 写味
      image.png
    • 其他主题很多都是去掉了边框,用颜色来区分的
    1 回复
  • 赞同你的观点这一点我也发现了,我回复的第一行也指出了,我不支持“仅”隐藏边框,目前的提案没有后续,只是隐藏边框。帖子正文图也只是隐藏边框、没有颜色区分。因此投票我给了反对。

    image.png

    image.png

    1 回复
    1 操作
    Undii 在 2024-11-03 10:29:02 更新了该回帖
  • JeffreyChen 1 评论

    我的看法是即使仅隐藏边框也会更好看,用户需要的其他样式都能靠 CSS 实现

    明白,这一点我不赞同,当然只是我不赞同而已。 看到你编辑了内容,我只能说隐藏边框也能靠 CSS 实现。我不认为这是理由。
    Undii
  • EmptyLight

    我觉得边框没什么,有没有都可以接受。不过要去掉的话一般情况下我还是喜欢用颜色区分不同的功能区。用自己改的主题演示一下,附图如下。

    PixPin20241103103958.png

    而用了背景图片插件之后我更愿意把界面之间的隔阂去掉,尽可能让整个界面一体化。附图如下。(将标题栏、标签栏和面包屑独立出来主要是不想改了)

    PixPin20241103104516.png

    这个效果也是我打磨几次之后确定使用的效果。全部界面之间的隔断几乎没有。

    至于我平时使用是隐藏停靠栏的,在所有功能确定位置之后就不去修改功能的定位了,所以只需要把鼠标移过去就能用对应的功能,比如文档树、大纲。

  • muxue via macOS

    既然主题、css 都能解决这个问题,那为啥要在默认主题里面加这种一半人喜欢另外一半人不喜欢的改动?个人不赞同。就算要加最好也弄个开关,但是主题本身加开关好像也不现实。

    默认主题更应该修改一下分行符、代码块的辨识度,现在的辨识度太差了,特别是默认的暗色主题。

    2 回复
  • 就是要投票才知道用户喜不喜欢。本质是为了优化默认主题,不能让默认主题保持难看然后大家都去用第三方主题。

    1 操作
    JeffreyChen 在 2024-11-03 12:14:36 更新了该回帖
  • 分隔线可以用这个 CSS 修改:

    /* 更改分割线样式 CSS片段 */ .protyle-wysiwyg [data-node-id].hr>div:after { height: 2px; background-color: #e9e900; }

    代码块可以自己设置颜色:

    image.png

    1 回复
  • EmptyLight 2 评论

    刚看了 ob 对比视频回来,如果视频里用的 ob 主题是默认主题的话,它也是有边框的。只不过 ob 的界面布局都是纯色的,各个功能区之间没有色差。

    我也看过 OB ,感觉不是很好看,默认主题跟思源一样没有那么“现代”
    JeffreyChen
    @JeffreyChen 我刚用思源的时候觉得默认主题还是耐看的,算是比较“现代”的。比起 dopus 来说好了不止一点(我为什么要这样比)
    EmptyLight
  • 没有边框也不太好看,杂乱不是边框的问题,

    而是设置很多都是重复的,把设置项归类一下就好。还有侧边栏就是感觉是没什么用的

  • Tisamn

    选项不好选啊,个人意见:
    同意隐藏底栏的边框线,上栏和侧栏有边框线的话,看起来会好点

    当然如果通过颜色进行区分的话,隐藏边框线没有意见,并且希望底部的边框的颜色和页面颜色相同

  • 不支持,隐藏边框会让整体设计没有空间感

    09296CEB2D1F4D5F8FF34AF092F6BD67.png

    隐藏边框之后,软件刘海就变成了蘑菇头了,除非像上面一样把刘海剪掉

  • bala1000

    我的建议是给它添加一个快捷键,如 alt +` ,这样久可以快速隐藏,界面就更加简洁。同时我觉得可以适当侧重引导用户去习惯使用快捷键,这样效率更高。

    image.png

  • 看来需求各不相同,大家自行用 CSS 改吧。

  • AhaluYah 1 赞同

    个人观点:可以优化,但不建议直接去掉线条。

    原因 1,现有的边框整体观感虽然不是特别好,但也不坏,影响其实并不大。

    原因 2,线条的功能是分区,如果直接去掉,整个界面就成了一坨,没有边界感。

    原因 3,如果要修改,建议融合色块 + 线框,丰富界面层次感。

    个人比较喜欢的软件界面:滴答清单。

  • muxue via macOS

    不是代码块颜色的问题,是现在默认主题的代码块和其他块之间的辨识度不好,看起来和引用块一样似的。和 mac 代码块美化插件一比就能感受出来。

    分割线这个 css 我知道,但是默认的那个真的太细了吧?改这个我感觉不会有人有异议吧 😂

    1 回复
    1. 我觉得区别蛮大的:
      image.png
    2. 分隔线你可以发起一个投票看看
  • 我是支持的,因为我不会搞 CSS,也不想为了写笔记去学。

  • paris1943 1 赞同

    我投的“反对”。

    一个是,我真的觉得一些长久以来就有且不影响大部分用户使用的东西就别改了;

    第二个是,如果要改希望往好的方向去改。“去掉线条”怎么看也不是好的方案,不仅没有让界面变得简洁清晰,反而视觉上更臃肿了(不是元素变少了就是“简洁”)。

    1 回复
  • 应该主动改进,而不是用户能习惯就一直保留,否则就会僵化跟不上时代了。

    你是用默认主题的吗?

  • 界面是整体的事情,线条我觉得还是要有的,主要是界面要有层次,有区分度,只是思源目前的整体看起来就很粗糙,间距、颜色、图标、大小远不如借鉴的 ide 编辑器那样美观

    image.png

    image.png

    image.png

  • 我支持再次降低边框对比度,弱化边框的存在感,但移除我不是特别赞同,有一点点分区还是有用的,另外右侧停靠栏的边框支持移除

  • temacc0531

    建议直接来波大改trollface

  • veee via macOS

    试了下去掉边框,个人感觉更好一点。不过我还是投了反对票,因为不想改的人挺多的,而对于想改的人来说,这类简单的需求可以直接 CSS 就实现了。

    如果真的改 UI,可以考虑出份设计稿大改一下。不过,相对于这些细枝末节的元素,我倒是觉得不如花心思优化一下界面的逻辑,精简和合并一下入口之类的,目前还是有点乱(比如我始终理解不了文档右上角的“打开菜单”和“更多”是靠什么区分的,为什么导入导出功能不在“更多”里面)。

    上面讨论的边框的问题,感兴趣的可以用这个 CSS 看下效果:

    /* 隐藏界面边框 */ .layout-tab-bar { border-bottom: none; } .layout__resize--lr:after { top: 0; width: 0; left: 0; height: 0; } .toolbar { border-bottom: none; } .dock#dockLeft { border-right: none; } .dock#dockRight { border-left: none; } .status { border-top: none; }
    1 回复
  • 不过我还是投了反对票,因为不想改的人挺多的

    投票应该投自己的需求而不是别人的需求。投票时不考虑他人是基本准则。

    如果大家实际上都需要且赞同,但都觉得别人会反对所以也投反对,那就倒置了结果,反应不了真实的情况了。

  • 那些线框确实不好看,但是单纯的隐藏的话其实似乎更不协调。

    因为有主题功能存在所以官方肯定不愿意改。

    但如果愿意改的话希望模仿下 affine

    1 回复
  • 来个图看看 Affine

    1 回复
  • 整体设计理念不好概括,但好看image.png

请输入回帖内容 ...
JeffreyChen
思源笔记同步教程:https://ld246.com/article/1692089679062 爱发电:https://afdian.com/a/JeffreyChen

推荐标签 标签

  • 招聘

    哪里都缺人,哪里都不缺人。

    188 引用 • 1057 回帖
  • Solidity

    Solidity 是一种智能合约高级语言,运行在 [以太坊] 虚拟机(EVM)之上。它的语法接近于 JavaScript,是一种面向对象的语言。

    3 引用 • 18 回帖 • 446 关注
  • Sandbox

    如果帖子标签含有 Sandbox ,则该帖子会被视为“测试帖”,主要用于测试社区功能,排查 bug 等,该标签下内容不定期进行清理。

    442 引用 • 1238 回帖 • 598 关注
  • LeetCode

    LeetCode(力扣)是一个全球极客挚爱的高质量技术成长平台,想要学习和提升专业能力从这里开始,充足技术干货等你来啃,轻松拿下 Dream Offer!

    209 引用 • 72 回帖
  • ngrok

    ngrok 是一个反向代理,通过在公共的端点和本地运行的 Web 服务器之间建立一个安全的通道。

    7 引用 • 63 回帖 • 656 关注
  • sts
    2 引用 • 2 回帖 • 246 关注
  • NetBeans

    NetBeans 是一个始于 1997 年的 Xelfi 计划,本身是捷克布拉格查理大学的数学及物理学院的学生计划。此计划延伸而成立了一家公司进而发展这个商用版本的 NetBeans IDE,直到 1999 年 Sun 买下此公司。Sun 于次年(2000 年)六月将 NetBeans IDE 开源,直到现在 NetBeans 的社群依然持续增长。

    78 引用 • 102 回帖 • 714 关注
  • 七牛云

    七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。

    29 引用 • 230 回帖 • 125 关注
  • 反馈

    Communication channel for makers and users.

    120 引用 • 906 回帖 • 279 关注
  • C++

    C++ 是在 C 语言的基础上开发的一种通用编程语言,应用广泛。C++ 支持多种编程范式,面向对象编程、泛型编程和过程化编程。

    108 引用 • 153 回帖
  • InfluxDB

    InfluxDB 是一个开源的没有外部依赖的时间序列数据库。适用于记录度量,事件及实时分析。

    2 引用 • 107 关注
  • 微信

    腾讯公司 2011 年 1 月 21 日推出的一款手机通讯软件。用户可以通过摇一摇、搜索号码、扫描二维码等添加好友和关注公众平台,同时可以将自己看到的精彩内容分享到微信朋友圈。

    134 引用 • 798 回帖
  • 旅游

    希望你我能在旅途中找到人生的下一站。

    100 引用 • 905 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 642 关注
  • 尊园地产

    昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 800 关注
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 39 关注
  • Python

    Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。

    554 引用 • 675 回帖
  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。

    730 引用 • 1284 回帖
  • 创造

    你创造的作品可能会帮助到很多人,如果是开源项目的话就更赞了!

    186 引用 • 1021 回帖 • 1 关注
  • etcd

    etcd 是一个分布式、高可用的 key-value 数据存储,专门用于在分布式系统中保存关键数据。

    6 引用 • 26 回帖 • 544 关注
  • AWS
    11 引用 • 28 回帖 • 7 关注
  • API

    应用程序编程接口(Application Programming Interface)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

    79 引用 • 431 回帖
  • Excel
    31 引用 • 28 回帖
  • DevOps

    DevOps(Development 和 Operations 的组合词)是一组过程、方法与系统的统称,用于促进开发(应用程序/软件工程)、技术运营和质量保障(QA)部门之间的沟通、协作与整合。

    59 引用 • 25 回帖 • 4 关注
  • 运维

    互联网运维工作,以服务为中心,以稳定、安全、高效为三个基本点,确保公司的互联网业务能够 7×24 小时为用户提供高质量的服务。

    151 引用 • 257 回帖 • 1 关注
  • 服务

    提供一个服务绝不仅仅是简单的把硬件和软件累加在一起,它包括了服务的可靠性、服务的标准化、以及对服务的监控、维护、技术支持等。

    41 引用 • 24 回帖 • 1 关注
  • Spring

    Spring 是一个开源框架,是于 2003 年兴起的一个轻量级的 Java 开发框架,由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构,分层架构允许使用者选择使用哪一个组件,同时为 JavaEE 应用程序开发提供集成的框架。

    948 引用 • 1460 回帖