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

UI 太抠细节 强迫前端天天该样式怎么办

  •  
  •   Tomfe · 23 小时 54 分钟前 · 9157 次点击

    如题,每次做完需求后,UI 会提出大量 Bug ,例如分布不均匀,文字过大,输入框有点短之类的问题,而且优先级还都是写的高,问他就说这些问题很重要,领导这边对于这种情况只是说按照 UI 改,但是我想前端对这种问题应该深有体会,在不影响整体的情况下,这些完全是没什么用的工作内容

    第 1 条附言  ·  16 小时 47 分钟前
    大佬们的指点与批评在下都看了,有一点我要申诉一下,我并不是那种一股脑自己乱做一气不看设计图那种前端,而是设计图很多时候和现实场景差距很多,举个例子,一个页面 UI 设计头部一行五个下拉框,图里的下拉框展示文字都是五个字 看起来很平均美观,但是实际场景 每个下拉框内容可能是有长有短 不可能强制搞成一个宽度 这时候我就会根据情况修改每个下拉框长度 最后结果看起来和设计图不符
    142 条回复    2025-03-19 09:09:49 +08:00
    1  2  
    gechang
        1
    gechang  
       23 小时 51 分钟前   ❤️ 5
    《改》
    lingyan223
        2
    lingyan223  
       23 小时 47 分钟前   ❤️ 34
    你的难受本质上是因为你受到了 UI 的单方面压力,并且从政治正确的角度来讲,似乎无法反驳这种强迫。我建议你反向要求 UI 进行组件化设计,不要按照 UI 的喜好随意设计,以提升开发与设计效率。
    kera0a
        3
    kera0a  
       23 小时 47 分钟前 via iPhone   ❤️ 8
    你想法太多了,如果确实和 UI 设计效果不一致,那就应该改。这并不是没什么用的工作,相反细节一塌糊涂对整体观感影响巨大。
    kakakakaka8889
        4
    kakakakaka8889  
       23 小时 47 分钟前
    改呗,UI 图都出了你还能分布不均匀文字过大输入框短本身就是你的问题,既然有 UI 图就按 UI 图来呗,你这些也不是什么难以还原的
    AlanBrian
        5
    AlanBrian  
       23 小时 43 分钟前
    正视 UI 问题
    catch
        6
    catch  
       23 小时 43 分钟前
    看你公司什么水平吧,大厂就 听话,垃圾公司 无所吊慰,就说改一部分
    root71370
        7
    root71370  
       23 小时 42 分钟前 via Android
    应该的
    shadowyue
        8
    shadowyue  
       23 小时 42 分钟前
    还原设计稿都做不到,那还能叫前端吗?
    除非是很难的设计
    paopjian
        9
    paopjian  
       23 小时 41 分钟前
    工作量这不就有了, 让他提供精细设计稿直接抄
    LHRUN
        10
    LHRUN  
       23 小时 38 分钟前
    如果是 C 端项目, 这肯定有用啊, 要改的
    ZE3kr
        11
    ZE3kr  
       23 小时 36 分钟前 via iPhone
    前端最基本的不就是像素级对其吗?如果楼主是后端那我还可以理解
    Jaosn
        12
    Jaosn  
       23 小时 36 分钟前   ❤️ 10
    还原设计稿都做不到,那还能叫前端吗?还好意思来发帖
    Tomfe
        13
    Tomfe  
    OP
       23 小时 35 分钟前
    @paopjian 有设计稿 但是设计稿是按照大屏显示器 1920 这种尺寸设计的 所以图里面很多设计都是尺寸较大 但是验收时候又是小屏幕笔记本和显示器都要看下效果,所以我的做法是用相对适中的尺寸 flex 布局这种方式处理 所以 UI 觉得没有按照设计稿来 问他屏幕尺寸的情况 他又说要两边都能满足 一个 ToB 的项目 在做个响应式 感觉又有点犯不上 因为业务开发量本身就很重
    miloooz
        14
    miloooz  
       23 小时 35 分钟前   ❤️ 3
    “不影响整体的情况下,这些完全是没什么用的工作内容” ???
    能将设计的内容在页面呈现是前端的基本要求。
    如果设计图有问题,在开发前应向设计组提出。
    在编写时应尽可能符合设计的要求,如果有 figma 、蓝湖等工具,还让 UI 提出这么多样式问题,应该反思而不是吐槽。
    ryan4290
        15
    ryan4290  
       23 小时 35 分钟前
    我也是遇到了这个问题。

    其实看你的位置了,有的公司,很小,但是人家就是卡住了生态位,ta 这样做,就证明了:ta 在干活。那么 ta 的目的就到了,至于你爽不爽,ta 是不在意的。

    否则 ta 就岌岌可危了。
    whoosy
        16
    whoosy  
       23 小时 33 分钟前   ❤️ 4
    这本身就是你的问题,人家对你负责,你却不对人家负责
    kinkin666
        17
    kinkin666  
       23 小时 30 分钟前
    你是不是比较喜欢用 flex 来做定位?

    如果碰到大领导说不好看,UI 会把锅扣你头上的(本来就是你的锅)

    况且现在 UI 出的图都鼠标点一下都能看到 css 样式,在 rem2px 的基础上配合 relative 和 absolute 定位,任何东西都是一把梭哈,脑都不用动还不好吗
    zhangpulin
        18
    zhangpulin  
       23 小时 28 分钟前
    改,不能 1:1 还原 UI 设计,做什么前端?
    YVAN7123
        19
    YVAN7123  
       23 小时 28 分钟前
    安排工作量,每天改改这种也不错啊。 调整一个输入框算一条任务。 一天下来任务量巨多
    emiyamuto
        20
    emiyamuto  
       23 小时 28 分钟前   ❤️ 3
    有种理工直男的美
    产品的外观本身就是产品最重要的一部分,粗制滥造的 ui 产品我根本看都不看
    还没什么用,我看到乱七八糟的设计语言我直接换平台了,谁管你里面雕了什么花
    xing666
        21
    xing666  
       23 小时 27 分钟前
    100%还原设计稿,前端基操啊,设计都是像素眼,你没还原就是没还原,这怪不了设计,乖乖改吧
    shadowyue
        22
    shadowyue  
       23 小时 26 分钟前
    @Tomfe #13
    那你问 UI 啊,小屏幕尺寸是等比例缩小,还是给你一套新的设计稿,商量下呗
    BigPiggggg
        23
    BigPiggggg  
       23 小时 26 分钟前
    你直接用 px to vw 来做等比例缩放不就完了
    Aolose
        24
    Aolose  
       23 小时 22 分钟前   ❤️ 1
    多尺寸适配让 UI 给设计 不给设计 备注适配方案也行
    UI 报 bug 就是一种协作的沟通方式 哪些地方要改 帮你列出来不是很好吗
    至于优先级 那是浮云 高低都是要改的
    thoo61871
        25
    thoo61871  
       23 小时 22 分钟前
    领导不懂技术
    但是领导不瞎
    TiAmo998
        26
    TiAmo998  
       23 小时 21 分钟前
    用 design token 就可以啊,推一推这个落地,就不用关注细节了
    zy0829
        27
    zy0829  
       23 小时 18 分钟前
    同前端 看着改就行了,都是工作
    kneep
        28
    kneep  
       23 小时 17 分钟前   ❤️ 7
    你说的这些问题,我觉得都不是小问题。为什么有些应用看起来简洁高雅有品味,而有些应用看起来像村办企业做的,差别就在这些地方。
    ilovecqrwx
        29
    ilovecqrwx  
       23 小时 17 分钟前
    评估工时的时候把还原设计稿这项也加上去就好了
    q2677855779
        30
    q2677855779  
       23 小时 16 分钟前
    UI 要走查的,一点不同就要返工改,除非是那种大屏不好实现的,反正基本上能还原 UI 就还原,至于适配这个得提前沟通好,不然小屏笔记本很难受。遇到过几次了我
    zuosiruan
        31
    zuosiruan  
       23 小时 14 分钟前 via iPhone
    转后端?
    snimstice
        32
    snimstice  
       23 小时 14 分钟前
    @BigPiggggg 宽高都用 vw 来做适配吗?
    wangpao
        33
    wangpao  
       23 小时 14 分钟前
    花了很多精力设计 UI ,结果前端做出来根本是另外一个东西,字号、颜色、线框粗细完全不一样,而且是一眼不一样!!!
    这和像素眼没关系,纯粹就是前端做出来的完全不是同一个东西,字体磅重、字号大小和设计稿一致很难吗?输入框这个大黑框和设计稿是一回事吗? 还有为啥你改了我所有的圆角啊!!!!图片为啥拉伸了? 真是不是设计龟毛,老老实实还原设计就好,请不要随意按照自己的想法修改设计稿!!

    实在是被坑过太多次了!!!
    Tomfe
        34
    Tomfe  
    OP
       23 小时 11 分钟前
    理解楼上各位说的前端要还原设计稿,反思了下也有我的问题,不知道为什么改业务加需求什么的都能接受,但是改样式这种工作做起来就是特别抓狂
    hwdq0012
        35
    hwdq0012  
       23 小时 10 分钟前
    mvvm 本来 Ui 和业务是分开的,可以两个人搞,现在都是压一个程序员身上
    看微软的 wpf , 前端有一个 blend , 功能简直和 photoshop 有得打, 后端用 visual studio
    但国内会 blend 的很少, 基本就是后端用 vs 完成 ui 和业务
    Leon777
        36
    Leon777  
       23 小时 10 分钟前
    商业产品 UI 非常重要,字体间距组件要精确到像素
    Tomfe
        37
    Tomfe  
    OP
       23 小时 8 分钟前
    @hwdq0012 初入行时候是这样的 那时候我只负责 html css 还有特效部分 做完页面把代码给后端,后端加上业务逻辑
    i33
        38
    i33  
       23 小时 7 分钟前
    没有 UI, 自己做也应该细节拉满, 字号 、标题、对齐、层级感等,前端应该有基础审美, 并且对自己有要求,不吹毛求疵, 做不出来好产品。
    leokun
        39
    leokun  
       23 小时 7 分钟前
    也许你看不出来,但是 UI 确实能看出来,而且大多时候改了后的确好看了
    虽然让人抓狂,但也是本职工作呀
    finab
        40
    finab  
       23 小时 5 分钟前   ❤️ 5
    @Tomfe
    改 UI 问题特别抓狂的话, 应该是 UI 不够漂亮,俺们公司 UI 贼漂亮我就爱和她说话
    RSTAR
        41
    RSTAR  
       23 小时 3 分钟前
    这就像一个爱整洁的人指摘邋遢的人,但邋遢的人觉得他事太多,本质是认知问题。
    Tomfe
        42
    Tomfe  
    OP
       23 小时 2 分钟前   ❤️ 1
    @finab 嗯 是有点丑
    irisdev
        43
    irisdev  
       23 小时 1 分钟前
    跑路,别干前端了。我就是因为这个原因跑路的
    ccraohng
        44
    ccraohng  
       23 小时 1 分钟前
    理论是应该还原。
    但是 ui 设计的很随意、很乱,间距、大小都不统一,那只能也随意了
    Tomfe
        45
    Tomfe  
    OP
       23 小时 0 分钟前
    @RSTAR 有道理 对样式这个问题确实是不太关注
    Tomfe
        46
    Tomfe  
    OP
       22 小时 59 分钟前
    @irisdev 现在做啥了 我目前是下了班后在学后端 打算往后端或者全栈路线走
    NoManPlay
        47
    NoManPlay  
       22 小时 58 分钟前
    还原设计稿是基本标准,有设计稿已经很好了
    xiaoqidev
        48
    xiaoqidev  
       22 小时 56 分钟前   ❤️ 7
    100% 还原是基操,响应式页面 UI 应该出不同尺寸的多个设计稿,字节有款走查验收工具 https://copixel.bytedance.com 交付前可以自己检查一下
    tricker1215
        49
    tricker1215  
       22 小时 54 分钟前
    我认为前端要兼顾考虑 ui 的还原程度问题和工时问题,工时长可以细节控,工时短的话确保颜色,字号对得上,定宽定高,不同 size 的屏幕兼容整体美观就可以了,做 b 端根本没必要对 ui 吹毛求疵,做 c 端的话 uiux 自然是好马要配好鞍。
    guguji5
        50
    guguji5  
       22 小时 54 分钟前
    我们不是 UI 让改。是 UI 出了,前端还原了,老板继续改。说设计稿框框太多,空间太大
    tcper
        51
    tcper  
       22 小时 51 分钟前   ❤️ 7
    你这一看没啥经验,搞得好像自己还挺有责任感,还特别不招人待见。

    一个原则,无论如何都应该符合 UI 设计。
    你做的任何事如果违反这个原则,你放在哪都没人支持。

    但是,这个原则需要付出代价
    UI 出一个设计他觉得很美,老板也满意,但是你要兼容小中大三种屏幕,你可以要求所有设计都出 3 套
    按照你的快速实现,2 天能干完的活,像素级还原,要 10 天

    不要和大原则做对,你所做的一切都是还原 UI 设计
    让老板去做取舍,而不是你自己做取舍
    AokiNet
        52
    AokiNet  
       22 小时 50 分钟前
    @xiaoqidev #48 chrome 说是什么没有遵循最佳实践不让下载,不过看操作视频是有点意思,平常开发到处切屏看 ui 也挺麻烦
    loadin
        53
    loadin  
       22 小时 50 分钟前
    既然是前端,理应就按照 UI 的设计进行啊。 如果 UI 没有规则,那么就反馈这个问题。
    rabt
        54
    rabt  
       22 小时 45 分钟前
    楼主是前端吗,是的话菜就多练
    forschers
        55
    forschers  
       22 小时 43 分钟前
    UI 扣的细还不好么
    zsc8917zsc
        56
    zsc8917zsc  
       22 小时 43 分钟前
    让 UI 用 figma ,直接生成样式,像素级还原
    calmlyman
        57
    calmlyman  
       22 小时 43 分钟前
    还原 UI 设计稿是应该的,但如果 UI 只出了一份稿却让我实现三个终端的适配,那我就得提刀了/doge
    xiaoqidev
        58
    xiaoqidev  
       22 小时 39 分钟前
    @AokiNet #52 以前装的没注意,很多插件不升 v3 都不让装了,找到另外一个链接,有需要可以手动下载安装一下 https://www.crxsoso.com/webstore/detail/iljifliapaimkofafkddpgkfkmnocajf
    ynxh
        59
    ynxh  
       22 小时 37 分钟前
    都有 UI 了,你当公司出钱养人是在闹着玩呢? 正视自己的问题,1:1 还原 UI 是前端的基本工作职责。
    WillBeethoven
        60
    WillBeethoven  
       22 小时 36 分钟前 via iPhone
    @Tomfe 让他针对不同尺寸的屏幕都做一套设计方案
    rainsounds
        61
    rainsounds  
       22 小时 35 分钟前   ❤️ 1
    @Tomfe #13
    UI 没给适配方案,你也没问,测试阶段 BUG 都指给你,优先级还特别高,那你肯定越改越不爽。

    这些东西开发前就要达成一致,包括本次测试的分辨率范围、每个分辨率对应的效果图或是适配方案,开发时有擅自修改的地方一定要和 UI 达成一致。发现 BUG 的时候先看看是否是设计问题,对于效果图上没有的、适配方案不够具体的,BUG 责任人都可以标成 UI ,这样你改起来就没有负担了。

    另外楼上说的组件化设计也非常对,对于字体、字号、边框这些和你们的 UI 库差异比较大的问题,多跟领导沟通改动所需要的工时,领导肯定还是以工时为重的。
    Marmot
        62
    Marmot  
       22 小时 31 分钟前
    这是基本职责
    me1onsoda
        63
    me1onsoda  
       22 小时 26 分钟前
    果然大部分前端是没有 100%还原设计稿的能力
    chairuosen
        64
    chairuosen  
       22 小时 23 分钟前
    所有数字,要么自动标注,要么让 UI 手动标注,开发按照标注来,只要跟标注一样就不是 BUG
    gbw1992
        65
    gbw1992  
       22 小时 23 分钟前
    "分布不均匀,文字过大,输入框有点短 " 这些属于基本工作内容
    就像测试跟你提出这个接口响应有点慢一样
    arron2022
        66
    arron2022  
       22 小时 21 分钟前
    评估工作量的时候把这一块时间评估进去
    wyman222
        67
    wyman222  
       22 小时 20 分钟前
    之前公司都是要求像素级对齐,迫于 UI 的压力,慢慢的对布局,控件,还有一些简单的设计都了属于心。而且养成了对事情较真的习惯,在我的个人感知里,我很感谢那时候的认真
    IanHo
        68
    IanHo  
       22 小时 19 分钟前
    对着蓝湖的代码抄,也不至于出现这种小问题……
    duanxianze
        69
    duanxianze  
       22 小时 13 分钟前   ❤️ 2
    同为前端,我能理解你,本质并不是不愿意还原设计稿,而是某些 UI 水平太次,根本考虑不到例如屏幕尺寸,分辨率,不同的字体宽度大小粗细不一,图片放大缩小导致的比例不一等等适配的问题,就说和设计稿不一样,无法沟通
    jobscolin
        70
    jobscolin  
       22 小时 12 分钟前
    我觉得 UI 挺负责任的,我们的 UI 出个图,一套图一个边距,把我整崩溃了
    zepc007
        71
    zepc007  
       22 小时 10 分钟前 via iPad
    作为切图仔都做不到设计稿还原, 那还做个啥切图仔, 小项目做多了就容易产生这种错觉. 像素级验收人家是对自己负责, 你做不到那是你对自己不负责
    connection
        72
    connection  
       22 小时 10 分钟前
    推动组件化设计可以一定解决这种问题。
    但是我遇到的问题是 组件化后,设计仍然对组件化内容“微调”“特性调整”
    connection
        73
    connection  
       22 小时 4 分钟前
    而且,有谁感受过,长迭代的前端项目人员遇到没有规范的设计人员的持续迭代的痛苦。
    dp
        74
    dp  
       22 小时 2 分钟前
    ...这不是基本要求吗
    ccraohng
        75
    ccraohng  
       22 小时 0 分钟前
    @connection 同感受,只能安慰自己世界是一个巨大的草台班子了😇 “设计得太烂不想花费太多的精力”
    CH122
        76
    CH122  
       21 小时 57 分钟前
    @lingyan223 这是正确的
    jydeng
        77
    jydeng  
       21 小时 57 分钟前
    UI 这么做没问题,不过你要想办法减负。
    包括但不限于:模块分级、建立设计标准、组件库、tailwind presets 等等
    dudubaba
        78
    dudubaba  
       21 小时 56 分钟前
    能理解,但难受。这是人家的工作,如果不较真那么对方的工作就没价值了。所以一般处理方式就是搞好关系,简单的改一改就算可以了。
    bello123
        79
    bello123  
       21 小时 54 分钟前
    同前端也经常与 ui 扯皮,一些问题确实存在只能改,一些问题不好实现就跟 ui 商量折中方案,ui 也不容易上面有领导压着
    irisdev
        80
    irisdev  
       21 小时 49 分钟前
    @Tomfe 全干了,对于 ui 方面会比专业前端宽容点
    crysislinux
        81
    crysislinux  
       21 小时 49 分钟前 via Android
    设计工具和浏览器渲染方式都不一样,追求个屁的 100%还原。追求 100%直接挂图片得了。
    overflow99
        82
    overflow99  
       21 小时 48 分钟前
    如果 UI 提供了设计稿,那么作为前端,按照设计稿精准实现,这算是基础能力
    terrysnake
        83
    terrysnake  
       21 小时 42 分钟前
    你(或者你的领导)要么就在设计稿定稿的那时候提出来前端实现很困难,或者有其他的想法。不能定了以后,说实现不了。本质上,这和改后端需求没什么两样。
    simo
        84
    simo  
       21 小时 41 分钟前
    从 ie6 时代过来的,怎么抠细节都不觉得有麻烦了,还 css hack ,都妖精。
    gorvey
        85
    gorvey  
       21 小时 32 分钟前
    还原设计稿是基本能力。
    但是自己的还原能力,设计稿的质量,项目 UI 规范都会影响到写页面的痛苦程度

    最好是整理一套 UI 规范,对颜色,间距,字体,页面宽度等设立标准,用 design token ,tailwind ,css 变量

    你来牵头让领导在团队内推一推规范,蓝湖,figma 这些工具能用就用。

    还有就是宽度的问题,按照我的经验最好是让 UI 出 1200 宽的设计稿比较方便适配小屏幕
    bitmin
        86
    bitmin  
       21 小时 24 分钟前
    确定不是钓鱼吗,你这些个问题太大条了,如果是我老板,一眼看出 1px 不一致让你 1px 1px 的调

    在他的观念里,前端连还原设计稿都做不好,那还做啥

    设计稿和验收尺寸不一致,这你在开发前就得提出。别自以为是,自己觉的要怎么做,如果不和其他人沟通自己做了,所有的锅都自己背

    开发中我最怕的人就是啥都不说,闷头扑哧扑哧做,问有没有问题,都没问题,做完发现和目标相去甚远。问原因就是我认为,我以为,我觉的
    gorvey
        87
    gorvey  
       21 小时 23 分钟前
    @crysislinux #81 用 figma 呗,直接生成组件了,100%还原
    geekfxxk
        88
    geekfxxk  
       21 小时 18 分钟前
    正视 UI 问题,积极修改!
    learnshare
        89
    learnshare  
       21 小时 8 分钟前
    所以说前端已经是另一个时代,pixel perfect 不是基本要求了吗?

    如果能提供设计稿,为何不能要求 UI 实现更精细一些呢。
    响应式的适配,如果已经明确要求了,那也是前端的工作内容之一。
    对于质量不好的设计稿,或者实现有难度/工作量超标的任务,完全可以提出来。
    katwalk
        90
    katwalk  
       21 小时 7 分钟前
    是你的活儿干的不行,还是 UI 设计师鸡蛋里挑骨头,你贴个对比图出来就一目了然了
    xzh654321
        91
    xzh654321  
       20 小时 47 分钟前
    @xiaoqidev 。。。chrome 插件不支持最佳实践已被暂停使用
    wangyzj
        92
    wangyzj  
       20 小时 42 分钟前
    如果设计图像素级别的数据都给了
    那么照着做,做到一致是对的
    xu33
        93
    xu33  
       20 小时 42 分钟前
    用 ai 不就行了
    xuanbg
        94
    xuanbg  
       20 小时 39 分钟前
    你 100%按 UI 还原不就没事了?既然不一样被人找出来了,那就改啊。
    zcvvvbb
        95
    zcvvvbb  
       20 小时 35 分钟前
    @Tomfe 哈哈一模一样,我也是烦扣 ui 细节,也在转全栈
    tonytonychopper
        96
    tonytonychopper  
       20 小时 28 分钟前
    事先没有和 UI 对齐吧,不让走查的时候怎么会提这么多问题
    szyp
        97
    szyp  
       20 小时 28 分钟前
    我是后端,我们组没有 UX 、UI ,我看着前端自己按照产品的原型做的页面特别痛苦
    zgsi
        98
    zgsi  
       19 小时 58 分钟前
    我是后端,我写前端非要扣到像素级别。所以我做不了全栈
    yunyuyuan
        99
    yunyuyuan  
       19 小时 53 分钟前
    干前端是这样的,有时遇到了设计稿太简陋了,一些报错或者警告的样式都没设计,使用项目里的组件,他们也给提 bug ,我一个切图仔还能说啥呢,堆屎呗
    chenyu0532
        100
    chenyu0532  
       19 小时 48 分钟前
    像游戏客户端改 UI 更是频繁,我都是把示意图放编辑器里,30%透明度,对着一个个 UI 去调整
    1  2  
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5490 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 01:21 · PVG 09:21 · LAX 18:21 · JFK 21:21
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.