V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
zfy941
V2EX  ›  分享发现

为啥近些年的 UI 要变得越来越圆润啊

  •  1
     
  •   zfy941 · 2 天前 · 3224 次点击
    典型的例子是 MacOS26 应用窗口都变圆了 真不好看 虽然直角更丑 但是圆的有点过了
    记得之前 chrome 还是梯形标签页 后面也改圆了 也是适应了好一阵
    设计师的问题还是我的审美问题
    34 条回复    2025-09-18 10:33:16 +08:00
    ufan0
        1
    ufan0  
       2 天前
    年纪大了后都会喜欢“珠圆玉润”的。
    zfy941
        2
    zfy941  
    OP
       2 天前
    @ufan0 只能说这帮设计师都上了年纪
    NoManPlay
        3
    NoManPlay  
       2 天前
    设计语言,一个是更容易区分各 app 并且突出自身中心内容,另外相比于尖锐的,人类心理上更容易感觉亲近,没有危险
    kzfile
        4
    kzfile  
       2 天前
    减少刺激,但是就像我日常会用圆体,但绝对不会用华文彩云
    zfy941
        5
    zfy941  
    OP
       2 天前
    @kzfile 直角我觉得有点刺激 但是圆圆的有点小学生
    gadfly3173
        6
    gadfly3173  
       2 天前 via Android   ❤️ 4
    这就是为什么我还留在 windows 10 。windows 10 的直角就很让人安心,感觉每一粒像素都有在好好干活
    dunn
        7
    dunn  
       2 天前
    我就喜欢圆角的,我应该是上了年纪的小学生吧
    levelworm
        8
    levelworm  
       2 天前
    Windows 2000 和同时代的 MacOS 是顶峰,以后不会再有了。
    clementewy
        9
    clementewy  
       2 天前
    我也喜欢圆角,但是不喜欢太圆
    my101du
        10
    my101du  
       2 天前
    可能和设计语言越来越偏向适配 “移动设备使用” 和取悦 “普通内容消费者”。

    早年间学 CSS ,一个入门的案例就是做圆角矩形按钮。 那时候放眼可见都是直角,矩形边框,做个圆角矩形的按钮、窗口边框,再加个阴影会让人耳目一新。那时候还是 PC 时代,移动设备也没有现在这么普及,理工科出身的开发工程师并没有什么特别高的审美水平,能满足功能要求就行了。

    后来有了独立的 UI 设计岗位,就开始对色彩、形状要求更多,注重美观了。

    慢慢地,美观的重要程度打败了功能优先。。。大家玩 app ,诸多竞争对手都是 todo/番茄钟, 那当然选漂亮的咯。
    触摸设备上圆形的东西触摸起来比直角的形状令人安心(基因里避开扎到尖锐的东西,哈哈,我猜测的),大概就是现在越来越圆润的原因了。
    yangwcool
        11
    yangwcool  
       2 天前
    会直回去的
    JarvanIV
        12
    JarvanIV  
       2 天前   ❤️ 4
    UI 有三宝,阴影渐变加圆角
    frankies
        13
    frankies  
       2 天前
    歪楼说个差不多 10 年前的事,如果你开发网站的按钮是纯矩形没有加 radius 圆角,那么 360 浏览器会强制给你渲染成圆角。。。
    shawnsh
        14
    shawnsh  
       2 天前 via Android
    过几年又会是直角,总得换个样式混饭吃,审美本来就很主观
    paopjian
        15
    paopjian  
       2 天前
    全世界的圆角趋势潮流吧, 我记得苹果鼓吹的不还有什么二次 三次超平滑贝塞尔曲线圆角, 设计师总得弄点特别的能说出故事的来证明劳动力
    windows8 开始的贴片真挺舒服, 结果用力过猛死了到 win10 就残留了点开始菜单, 当时 office2016 那画面真的很惊艳.
    现在全往 web 方向走, 到处都是圆圆的, 也不知道适配触摸屏用直角是有什么不好
    DualVectorFoil
        16
    DualVectorFoil  
       2 天前 via Android
    会直回去哈哈,我已经把自己博客全直回去了
    zfy941
        17
    zfy941  
    OP
       2 天前
    希望国产手机不要跟进 别屎都要抢着吃
    LaGeNanRen
        18
    LaGeNanRen  
       1 天前
    从实体开始圆角/倒角就是更贴合使用的,就像桌角会给你“靠近会被伤害”,打磨过的木桌角就会亲近很多。这种事情其实和屏幕里的世界无关,工业设计是一门跟随工业生产一起成长的学科,启蒙的话可以去看原研哉的设计中的设计

    苹果手机的机体圆角是有专利的,当时别的厂商因为技术原因做不出苹果那种圆角,除了锤子手机要做割手的直角以外,所以大家各圆各的😂苹果的工业设计拿了专利,就那个圆角,就一直是独一份

    ui 里的圆角出处不明,但我猜很大可能是跟随苹果手机的圆角风格。异形不做管控的安卓版本,你会发现手机里 app 有的宽扁,有的瘦长,各式各样,线性/面的啥都有。其实这在 ui 设计里是不对的,属于“一套系统里图标风格不统一”。

    现在的液态玻璃,你去看宣传片就能理解了,就像阳光透过一滴滴落在纸上的水来看纸上的文字一样,真的很美,能往这个角度去进一步进化现在的扁平风格真的很牛逼,设计感想,开发敢做(虽然实际效果没有理念上那么牛逼)
    然后关于美丑的定义,理论上是没有绝对美丑的,所以艺术上的发展是螺旋上升的,不像科技树,属于沉淀爆发平稳再爆发

    如果你想看省流版,那道理是这样的:羡慕,只有大公司才有能力和资源去做这种事情。行业头部,没有能抄的,因为自己就是领头羊,只能自己做探索和尝试。液态玻璃从理念到实现,真的厉害。但它作为一个全新的概念和设计风向,现在才刚刚诞生,还有很长一段时间去修改和成长。在行业老大哥拿出东西后,其他厂商也会跟着去尝试,群策群力 :)
    pyre
        19
    pyre  
       1 天前
    我现在连截图都用上了圆角矩阵了()
    rednose1037
        20
    rednose1037  
       1 天前
    @pyre #19 问下截图什么软件
    8355
        21
    8355  
       1 天前
    趋势问题 跟每年的流行色一样的
    AEDaydreamer
        22
    AEDaydreamer  
       1 天前
    过度圆角很损失内容展示的有效空间, 感觉比较臃肿
    pyre
        23
    pyre  
       1 天前
    @rednose1037 ishot ,也是昨天问 v 友知道的,替换掉了 snipaste ()
    raincaptain
        24
    raincaptain  
       1 天前
    库克快退了应该
    akakidz
        25
    akakidz  
       1 天前
    梦回唐朝 以肥为美
    huiyadanli
        26
    huiyadanli  
       1 天前
    UI 设计是个循环罢了
    zachary168
        27
    zachary168  
       1 天前
    @pyre #19 这个软件很好用的,可以设置的内容也比较多
    bojackhorseman
        28
    bojackhorseman  
       1 天前
    rounded is the new way
    chutsetien
        29
    chutsetien  
       1 天前   ❤️ 2
    在对抗邪恶的大圆角歪风方面我好像还满有经验的(这股妖风最早始于 iOS 10 的 Control Centre, 之后差不多在 2021/22 年左右无差别地覆盖了几家大厂的设计语言,如今到了 2025 年已经几乎渗透到了每一个角落),就简单总结一下吧:

    浏览器可以装 Unround Everything Everywhere—

    1. Userstyle: https://userstyles.world/style/8283/ 或
    2. Userscript: https://greasyfork.org/en/scripts/408378

    如果是 Firefox 的话,还可以把 Unround Everything 写到浏览器的外观里。我个人用的是如下这段:

    ```css
    #preferences-root *,
    body:has(> div#full) *,
    body:has(> div.container) *,
    body.aboutPageWideContainer *,
    body:has(> div#toolbar) *,
    [force-theme] *,
    #contentAreaDownloadsView *,
    body#lic-info *,
    body#body *,
    body:has( fxaccounts-button) *,
    body:has(> div.ancillary) *,
    body.wide-container *,
    body:has(> *[data-l10n-id^="about"]) *,
    body:has(> p[id^="UI_"]) *,
    body:has(> div#app) *,
    body:has(> div.container) *,
    [focuseddatatype] *,
    body.theme-body *,
    body:has(> p.showNormal) *,
    #moz-toggle-button {
    &, &::before, &::after {
    border-radius: 0 !important;
    }
    }
    ```

    再配合 Aris-t2 的 [CustomCSSforFx]( https://github.com/Aris-t2/CustomCSSforFx/) 以及一些自行调整,可以实现像下图这样起码在浏览器里全方位无圆角:


    顺,如果 OP 也像我一样不仅极度厌恶大圆角,也同样讨厌 emoji 的话,那么在 Chrome 上,可以透过在 Unround Everything Everywhere 的程式码中添加一行 `font-variant-emoji: text !important;`, 就像下面这样:

    ```css
    {
    &,
    &::before,
    &::after {
    border-radius: 0 !important;
    font-variant-emoji: text !important;
    }
    }

    来同时让 emoji 都以文字的形式显示。

    在 Firefox 上,由于对 `font-variant-emoji` 的支援一直不太好(在 about:config 里开了 `layout.css.font-variant-emoji.enabled` 也没啥用),因此可以透过以下这段 userscript 来实现:

    ```js
    (function() {
    'use strict';

    const r = /([\u{1F600}-\u{1F64F}\u{1F300}-\u{1F5FF}\u{1F680}-\u{1F6FF}\u{1F900}-\u{1F9FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}\u{2B00}-\u{2BFF}\u{1F780}-\u{1F7FF}\u{1F800}-\u{1F8FF}])/gu;

    function p(d) {
    if (!d || ![1, 9, 11].includes(d.nodeType)) return;
    const w = document.createTreeWalker(d, 4);
    let n;
    while (n = w.nextNode()) {
    if (n.parentElement && !['SCRIPT', 'STYLE', 'TEXTAREA', 'TITLE'].includes(n.parentElement.tagName)) {
    n.nodeValue = n.nodeValue.replace(r, '$&\uFE0E');
    }
    }
    }

    p(document.body);

    const o = new MutationObserver(l => l.forEach(m => m.addedNodes.forEach(n => p(n))));

    if (document.body) {
    o.observe(document.body, {
    childList: true,
    subtree: true
    });
    }

    window.addEventListener('beforeunload', () => o.disconnect());

    })();
    ```

    不一定能够确保 100% 有效,但大多数时候能够实现(但大多数时候也会有一些漏网之鱼),大体上效果如下(截图不是现在截的,挺久之前了)——


    Chrome 可以调外观的地方很少(所以是那个最傻逼的浏览器,老想当使用者的爹),因此如果非得用 Chrome 不可(因为某些傻逼网站只支援 Chrome ),可以试试 Supermium, 透过修改 flags (具体是修改哪些记不清了,总之就是 classic, compact 之类的关键字多搜一搜试一试), 目前还是勉强可以恢复成这样的外观的——


    微软的 Office 如果一定要用,可以停留在 2405 (build 17628.20164), 如果已经过了,可以透过如下去改写安装 xml 来重新安装指定版本(注意加写以及修改的部分):

    ```xml
    <Add OfficeClientEdition="64" Channel="Current" Version="16.0.17628.20164">

    <Updates Enabled="FALSE" Channel="Current" />
    ```

    之后透过合并以下 reg 档来恢复至非圆角化的外观——

    ```reg
    Windows Registry Editor Version 5.00

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Access]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Excel]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\OneNote]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Outlook]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\PowerPoint]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Project]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Publisher]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Visio]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"

    [HKEY_CURRENT_USER\SOFTWARE\Microsoft\Office\16.0\Common\ExperimentConfigs\ExternalFeatureOverrides\Word]
    "Microsoft.Office.UXPlatform.FluentSVRefresh"="false"
    "Microsoft.Office.UXPlatform.RibbonTouchOptimization"="false"
    "Microsoft.Office.UXPlatform.FluentSVRibbonOptionsMenu"="false"
    ```

    效果如下——


    很多时候一些事情还就非得 MSO 才能做好,因此 MSO 不得不用,不过如果只是简单地编辑编辑文档,那么可以试试 ONLYOFFICE, 它家至今提供非圆角的「经典外观」。

    作业系统的话,Windows 建议停留在 10 代,Server 2022 支援到 2031 年 10 月,是个很不错很干净很稳定的作业系统,至今月度累积更新的大小才刚刚、刚刚超过 400 MB!

    如果一定要使用 Windows 11, 则可以透过 [这个 Github 项目]( https://github.com/valinet/Win11DisableRoundedCorners/releases/latest) 来去除视窗的圆角,坏处就是,每次月度更新后都要重新执行一遍。执行时需保持网路畅通。

    其他的一些东西,很多可以透过浏览器去用,这样就可以藉由 Unround Everything Everywhere 来解决大圆角了,就比如 Teams—


    其他的比如多学一些命令列下的软体,能用命令列解决的就用命令列,很多花里胡哨的东西其实就是给人家命令列软体加了个外套而已。以及我个人正在争取能够在 2030 年之前完成向 Debian 的迁移——如今 KDE 已经堕落了,但是 Debian 加上一些比较简单的 wm 还是不会有大圆角的。

    行动装置上是没有什么好方法,如今基本上已经到了一看到就生理性不适的地步,不过正好敦促我少用——我本来就极少用行动装置,每天的荧幕时间甚至不到 20 分钟,四年前的手机如今还能保持两三天充一次电~

    顺附一张经过缩骨术的我的 Server 2022 的荧幕截取(今年年初截的),认真挑选软体的版本的话,还是能够坚持一个简单、清爽的外观的。
    z919126592
        30
    z919126592  
       1 天前
    会直回去的 等一个 material design 1 refresh
    Danswerme
        31
    Danswerme  
       1 天前
    Windows 10 的方角我一直很喜欢。
    moudy
        32
    moudy  
       1 天前
    应该是性能过剩,可以扣这些 ui 细节了吧
    zfy941
        33
    zfy941  
    OP
       1 天前
    @chutsetien 非常给力
    illiteracy0001
        34
    illiteracy0001  
       1 天前
    人也变得越来约圆润呀
    关于   ·   帮助文档   ·   自助推广系统   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3656 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 05:13 · PVG 13:13 · LAX 22:13 · JFK 01:13
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.