请大家帮忙投票, A 是我画好的 UI, B 是领导找的参考 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
请不要在回答技术问题时复制粘贴 AI 生成的内容
Joseph0717
V2EX    程序员

请大家帮忙投票, A 是我画好的 UI, B 是领导找的参考

  •  
  •   Joseph0717 2021-08-31 14:13:50 +08:00 16603 次点击
    这是一个创建于 1507 天前的主题,其中的信息可能已经有所发展或是发生改变。

    领导非说 B 好看,让我参考,我参考出来的结果就是 A,他要和 B 一摸一样,不要五花八门的颜色,搞不懂...请大家帮忙投票。 A: https://z3.ax1x.com/2021/08/31/hUvDTP.jpg https://z3.ax1x.com/2021/08/31/hUv0eI.jpg https://z3.ax1x.com/2021/08/31/hUvsFf.jpg https://z3.ax1x.com/2021/08/31/hUvdOA.jpg B: https://z3.ax1x.com/2021/08/31/hUvayd.jpg https://z3.ax1x.com/2021/08/31/hUvBwt.jpg

    第 1 条附言    2021-08-31 17:20:40 +08:00
    211 条回复    2021-09-02 15:22:30 +08:00
    1  2  3  
    cstj0505
        1
    cstj0505  
       2021-08-31 14:15:18 +08:00   2
    确实 b 好看,a 有种半成品的感觉
    ZxBing0066
        2
    ZxBing0066  
       2021-08-31 14:18:06 +08:00   3
    B
    anyxchachapoly
        3
    anyxchachapoly  
       2021-08-31 14:20:53 +08:00 via iPhone
    A,虽然应该是粗稿还没细致处理,但明显稍微考量了 UX,
    B 就是传统国内的工具设计,能用就行

    但如果你 A 已经高保真那就不行
    xarthur
        4
    xarthur  
       2021-08-31 14:20:54 +08:00 via iPhone   1
    显然 B 好看……
    你们领导说的对,你设计的对 UI 颜色搭配太奇怪了。
    而且有些该有颜色区分的(比如已完成界面的四个按钮)没有颜色区分,不该有颜色区分的,比如各种订单号的显示,黑底白字就行,要弄的粉红色的底色。
    lyz1990
        5
    lyz1990  
       2021-08-31 14:21:18 +08:00 via Android
    B 好看
    8888888888
        6
    8888888888  
       2021-08-31 14:22:18 +08:00
    你的设计太“块”了,功能性的操作和常规的内容显示相近
    kuaner
        7
    kuaner  
       2021-08-31 14:22:37 +08:00   1
    A 主要是颜色区分不出主次,重点信息不突出
    javapythongo
        8
    javapythongo  
       2021-08-31 14:22:57 +08:00
    A 这种 UI 有种复古的感觉
    HeyWeGo
        9
    HeyWeGo  
       2021-08-31 14:23:03 +08:00
    B 清晰,好看?谈不上~
    Macolor21
        10
    Macolor21  
       2021-08-31 14:23:11 +08:00
    B 好看,A 里面,很多子元素,如入库日期这些,为什么也加了圆形边框和颜色,搞得好像按钮一样。太乱太杂,颜色搭配也是。简洁一点,
    Joseph0717
        11
    Joseph0717  
    OP
       2021-08-31 14:23:12 +08:00
    @xarthur 本人前端,没学过设计,目前的颜色搭配只是临时的
    butanediol2d
        12
    butanediol2d  
       2021-08-31 14:23:50 +08:00   1
    理性分析我觉得 B 好看一点。但 B 总给我一种大厂开发的软件的感觉(比如阿里云 App ),看着还行但点起来很难受。A 有点像个人开发者的玩具项目,看起来略粗糙但更“原生”。
    Jaosn
        13
    Jaosn  
       2021-08-31 14:24:53 +08:00
    B 搞点圆角就好看了
    stimw
        14
    stimw  
       2021-08-31 14:25:24 +08:00 via Android   2
    好不好看另说,单从信息获取角度,b 清晰很多,a 会找不到重点。
    finab
        15
    finab  
       2021-08-31 14:25:34 +08:00
    只能说 B 比 A 好点
    A 把信息放方块里看起来费劲,配色奇奇怪怪的
    E2gCaBAT5I87sw1M
        16
    E2gCaBAT5I87sw1M  
       2021-08-31 14:27:33 +08:00
    大家审美一致,楼主接受意见吧
    oh
        17
    oh  
       2021-08-31 14:29:27 +08:00
    @Joseph0717 专业的事交给专业的人做,没学过设计的前端,可以先从“抄”开始。
    dengji85
        18
    dengji85  
       2021-08-31 14:29:35 +08:00
    非专业,b 好看不疲劳,a 太整齐了 找不到重点
    ryougifujino
        19
    ryougifujino  
       2021-08-31 14:31:29 +08:00   2
    我能说都不好看嘛...
    lower
        20
    lower  
       2021-08-31 14:31:36 +08:00
    a 的颜色确实给人五花八门的感觉

    我其实蛮喜欢有赞的 vantui 的风格的,很简洁
    stormysky
        21
    stormysky  
       2021-08-31 14:32:53 +08:00
    b 一下就能看出要展现什么,a 就是一坨一坨没重点
    yousabuk
        22
    yousabuk  
       2021-08-31 14:34:17 +08:00 via iPhone
    B,色彩搭配再调整下就好了。

    A,没有重点,太难找到有用信息了。
    3wdddd
        23
    3wdddd  
       2021-08-31 14:34:41 +08:00
    a 看起来像是没有经验的设计师设计的东西,和好看不沾边,
    b 也和好看不沾边,但是很规整,井井有条
    总体来说 b>a
    Joseph0717
        24
    Joseph0717  
    OP
       2021-08-31 14:35:15 +08:00
    看来选 B 的人多,那我就弄 B 了,,,
    wzq001
        25
    wzq001  
       2021-08-31 14:36:16 +08:00   2
    B:领导都选我了,你还纠结个毛线!!!
    itechify
        26
    itechify  
    PRO
       2021-08-31 14:37:57 +08:00
    楼主自闭
    Vegetable
        27
    Vegetable  
       2021-08-31 14:38:16 +08:00
    确实是 B 好
    2i2Re2PLMaDnghL
        28
    2i2Re2PLMaDnghL  
       2021-08-31 14:39:20 +08:00   1
    A 的问题:
    可排版的环境,给人眼看,就别 T 字母分隔了
    不分主次轻重,关键信息和非关键信息混为一谈
    颜色就不赘述了
    B 的问题:
    可预见的,很多操作凭空多了很多步骤
    B 第 2 张图文字未明确所属字段

    应当结合 A 的交互设计和 B 的视觉设计
    Originalee
        29
    Originalee  
       2021-08-31 14:41:20 +08:00
    A 的色彩搭配需要再考量考量,并且第三第四张图一眼看过去看不出那些块状是操作按钮还是状态 tag
    chairuosen
        30
    chairuosen  
       2021-08-31 14:42:27 +08:00
    B 好
    lovelive1024
        31
    lovelive1024  
       2021-08-31 14:42:33 +08:00
    b,a 就像后端程序猿做的一样(又不是不能用)
    Joseph0717
        32
    Joseph0717  
    OP
       2021-08-31 14:42:54 +08:00
    虽然我画不出正儿八经的 UI,我不喜欢的是 B 没有一点设计感,啥也不说了,画 B,和 A 结合一下
    gablic
        33
    gablic  
       2021-08-31 14:44:14 +08:00   1
    A 对于现在的人类还有点早
    ericgui
        34
    ericgui  
       2021-08-31 14:44:49 +08:00
    领导说的都好看,这一点觉悟都没有。。。。
    coderluan
        35
    coderluan  
       2021-08-31 14:45:33 +08:00
    "他要和 B 一摸一样"

    说的这么明白, 楼主还想这么多干啥.....
    U2Fsd
        36
    U2Fsd  
       2021-08-31 14:46:36 +08:00   5
    @Joseph0717 #32 设计是基于功能 而不是 在自以为好看的审美里闭门造车
    Joseph0717
        37
    Joseph0717  
    OP
       2021-08-31 14:47:52 +08:00 via Android
    @coderluan 就我一个前端 ,太自由了
    Macv1994
        38
    Macv1994  
       2021-08-31 14:49:15 +08:00
    B 谈不上好看,但是清晰
    Solix
        39
    Solix  
       2021-08-31 14:49:21 +08:00
    你们缺一个产品经理吧……
    lagoon
        40
    lagoon  
       2021-08-31 14:49:39 +08:00
    B 。

    作为开发,不抬杠,觉得 UI 有时候的目标总是“要有个性”、“要有设计感”,但其实,UI 很多时候和开发一样,都是“后台岗位”。

    要的只是,方便好用。
    deplivesb
        41
    deplivesb  
       2021-08-31 14:52:44 +08:00
    u1s1,B 好看,A 有一种说不上上来的违和感
    353943780
        42
    353943780  
       2021-08-31 14:56:09 +08:00
    B 吧
    MX123
        43
    MX123  
       2021-08-31 14:56:12 +08:00
    B,这应该是公司内部 App 吧。而且 A 并不是太好看。
    Rakuu
        44
    Rakuu  
       2021-08-31 14:56:13 +08:00
    其实都不好看,但硬要比较的话,B 比 A 好
    darknoll
        45
    darknoll  
       2021-08-31 14:56:41 +08:00
    B 好太多了啊,A 就跟后台差不多只能内部用
    Tink
        46
    Tink  
    PRO
       2021-08-31 14:58:33 +08:00 via iPhone
    A 找不到重点
    X-Force
        47
    X-Force  
       2021-08-31 15:02:59 +08:00
    不知道楼主是专业学设计还是半路过来做 UI 的,反正我半路还没出家的,看到 A 都发现很多一眼就能看出的问题:

    1 、主次不分;所有元素都是一样的字重而且颜色都比较缤纷,看起来没重点,整个版面都是满满的信息。
    2 、没考虑“可用性”的设计,比如绿色的「完全收货」,那到底是显示“状态”还是一个“按钮”?一样看不出来,这就会让用户陷入思考了,在用户的直觉上就是“不够好用”。
    hyy1995
        48
    hyy1995  
       2021-08-31 15:03:15 +08:00 via iPhone
    这波楼主输了
    X-Force
        49
    X-Force  
       2021-08-31 15:04:00 +08:00
    错别字纠正:“一样看不出来” = “一眼看不出来” // 这就会让用户陷入思考了,在用户的直觉上就是“不够好用”。
    8jinmuyan8
        50
    8jinmuyan8  
       2021-08-31 15:04:07 +08:00
    显然是 B 简约符合现在大多国内商业产品的设计, A 的设计显得很奇怪,颜色搭配,图标设计都不符合现在流行趋势,如果追求设计感,多看看像国内 站酷,国外 dribbble 之内。
    LemonK
        51
    LemonK  
       2021-08-31 15:04:30 +08:00
    A 一看就是不懂任何基础设计理论的纯外行做的。实用性一团糟,审美也不咋地。
    B 烂大街堆套路,但能用。
    ws52001
        52
    ws52001  
       2021-08-31 15:05:58 +08:00
    选择 B,你对颜色语言的了解还不够透彻。
    360511404
        53
    360511404  
       2021-08-31 15:09:15 +08:00
    A 看着好累...眼花
    B 虽然老套,但很清晰
    Smilencer
        54
    Smilencer  
       2021-08-31 15:11:35 +08:00
    A 花里胡哨
    byron
        55
    byron  
       2021-08-31 15:14:10 +08:00
    听领导的。
    spacebound
        56
    spacebound  
       2021-08-31 15:14:42 +08:00
    A 花里胡哨
    B 简介明了
    mhqschen
        57
    mhqschen  
       2021-08-31 15:15:20 +08:00
    B 好。A 的想法可以感受到,但是不能理解有什么设计感。
    xu2060
        58
    xu2060  
       2021-08-31 15:20:23 +08:00
    B 就是看的舒服 但是并不出众,一般
    mxT52CRuqR6o5
        59
    mxT52CRuqR6o5  
       2021-08-31 15:20:29 +08:00
    选择烂大街的 ui/交互从另一个角度看待就是用户不需要更多的学习成本
    whusnoopy
        60
    whusnoopy  
       2021-08-31 15:20:54 +08:00
    从半吊子自学设计的角度来说一下 A 的一些问题

    1. 配色太多,太多色块,让人一眼看过去不知道视线应该聚焦在哪里
    2. toB 的工具,只有可以按的地方用色块会更好,明确「信息」和「操作」的区别
    3. 信息区域,说明性文字和数值用不同的表现形式好过现在这种都一样的,按 HTML 语义就是 dt 和 dd 在 dl 里的表现
    Rwing
        61
    Rwing  
       2021-08-31 15:21:16 +08:00
    建议任何非设计专业的人都买本这个书看看
    《写给大家看的设计书》
    https://book.douban.com/subject/3323633/
    ganbuliao
        62
    ganbuliao  
       2021-08-31 15:22:48 +08:00   8
    你们领导说让你一模一样照着抄的时候,心里估计已经绝望了吧。
    crab
        63
    crab  
       2021-08-31 15:23:04 +08:00
    A 眼花缭乱 B 直观
    xianxiaobo
        64
    xianxiaobo  
       2021-08-31 1:23:17 +08:00
    A 是真不行,看起来就是新手的设计,根本不能用。B 看起来,虽然没什么亮点,但好歹是能用的的那种。
    satchy
        65
    satchy  
       2021-08-31 15:24:00 +08:00
    其实都很丑。。。相比之下,A 更丑,属于完全没学过设计,色彩原理都不懂的那种。。。B 是路边打印名片小店水平。。。
    whosesmile
        66
    whosesmile  
       2021-08-31 15:24:11 +08:00
    A 的配色是认真的吗?一个人要是这么穿衣服,是少数民族服饰吗?
    zhengfan2016
        67
    zhengfan2016  
       2021-08-31 15:24:28 +08:00
    emmm.....就我一个觉得 a 好的嘛 类原生看着就很舒服
    minamike
        68
    minamike  
       2021-08-31 15:25:46 +08:00
    A 下面那四个按钮风格都不统一
    maplerecall
        69
    maplerecall  
       2021-08-31 15:25:59 +08:00 via Android
    B 清晰,效率高

    A 有种早期 bootstrap 组件拼接的古早味,感觉比 B 更老套,很有那种初学者逮着个有几个"高级"css 样式的框架就套的感觉
    whosesmile
        70
    whosesmile  
       2021-08-31 15:26:16 +08:00
    我回复完,我反应过来,楼主应该是正话反说:
    他领导估计是选 A,因为正常做设计就算半吊子也不应该做出 A 的配色效果来。
    hervey0424
        71
    hervey0424  
       2021-08-31 15:26:34 +08:00
    A 感觉看起来一屏幕都是按钮
    izoabr
        72
    izoabr  
       2021-08-31 15:27:22 +08:00
    你就直接用现成的 antd mobile 或者 ele 多好呀,大概把功能区块规划好就得了
    toou123
        73
    toou123  
       2021-08-31 15:29:01 +08:00
    我觉着是字体的原因
    madlifer
        74
    madlifer  
       2021-08-31 15:29:47 +08:00
    B 好,A 可以很明显没有系统的学习过交互设计,作为 PM 或者 UI 来说都不合格。

    单说入库单详情这个页面,如果 B 作为模板

    1. A 缺信息: 入库类型、入库仓库 入库操作人,尤其是入库操作人是追责、划定业绩用的这个竟然没有

    2. 总预计数量、总接收数量、预计入库数量 这三个没搞懂什么意思,入库单按道理入了库才能开,为啥有个预计

    3. 总条数 那排蓝色 总条数跟其他信息很明显不是同级别数据,放在同一地方展示了

    4. 这种“...” 是不想展示给用户看,但查看详情是肯定要提醒用户查看的。


    另外,啥公司啊 没 PM 整理页面要素信息, 没 UI 做视觉设计,让前端做也太难为人了,建议跑路
    Unclev21x
        75
    Unclev21x  
       2021-08-31 15:30:18 +08:00
    无脑 B 。领导还是领导。
    JamChiu
        76
    JamChiu  
       2021-08-31 15:31:12 +08:00
    恕我直言 我选 B
    james2013
        77
    james2013  
       2021-08-31 15:31:20 +08:00
    明显 b 好看,a 这一眼看去背景颜色很显眼,a 不好
    yuzo555
        78
    yuzo555  
       2021-08-31 15:32:19 +08:00
    A 主次混乱,次要信息也用圆角矩形背景展示,而且项目名称(如订单日期)和内容没有任何样式区别。满屏都是圆角矩形按钮,感觉设计背景你貌似只会用圆角矩形,连选项卡 Tab 都用圆角矩形背景
    X0ray
        79
    X0ray  
       2021-08-31 15:33:47 +08:00
    随便让谁选都是 B 啊
    leeeeec
        80
    leeeeec  
       2021-08-31 15:34:46 +08:00
    招个设计吧
    AlisaDestiny
        81
    AlisaDestiny  
       2021-08-31 15:37:24 +08:00
    不是做设计的,但是我觉得一个好的设计是让人能在颜色上区分哪些是文本区域、按钮、条目结构、可滚动区域、可编辑区域,而不单单是靠上面显示的文字。
    wr516516
        82
    wr516516  
       2021-08-31 15:39:41 +08:00
    我选 B
    wangyzj
        83
    wangyzj  
       2021-08-31 15:42:27 +08:00
    B
    楼主严重受伤了
    rnv
        84
    rnv  
       2021-08-31 15:43:32 +08:00
    B 看着舒服多了
    docx
        85
    docx  
       2021-08-31 15:48:02 +08:00 via Android
    B 说不上好看,就是中规中矩的那种,比 A 看着更规范成熟。

    话说回来,领导说什么就是什么,准没错。
    zxxufo008
        86
    zxxufo008  
       2021-08-31 15:50:26 +08:00
    B 看着舒服 A 不直观,而且在 app 上不建议白底太多,看的难受
    dabaoziwy
        87
    dabaoziwy  
       2021-08-31 15:54:19 +08:00
    总感觉 A 看起来怪怪的=_+
    noahhhh
        88
    noahhhh  
       2021-08-31 16:03:05 +08:00
    @butanediol2d lz 配色太怪了
    cxe2v
        89
    cxe2v  
       2021-08-31 16:06:54 +08:00
    我是领导,我选 B
    lycpang
        90
    lycpang  
       2021-08-31 16:08:50 +08:00
    我觉得很难设计出特别好看的东西,所以还是借鉴淘宝、京东、拼多多吧。。这 ab 都不好,但是 b 明显能用。。。a 就是 demo
    Junzhou
        91
    Junzhou  
       2021-08-31 16:11:39 +08:00
    如果是我,我会选 B 。。。。A 虽然看上去很好看。。。
    ChevalierLxc
        92
    ChevalierLxc  
       2021-08-31 16:11:53 +08:00
    你要考量视觉效果,A 感觉就给人那种各种颜色都要硬用,还不如不用,换种颜色可能会好一些,但是你得找到那种配色
    onemotor
        93
    onemotor  
       2021-08-31 16:14:02 +08:00
    A 色彩搭配不合适
    simo
        94
    simo  
       2021-08-31 16:30:15 +08:00
    B
    A 就一原型
    B 好歹能用
    gps949
        95
    gps949  
       2021-08-31 16:31:01 +08:00
    一看 A 就是码农(非设计师 or 产品经理)设计的,啥文字、按钮、表单毫无主次往上一堆就 ok 了,反正信息都显示了、功能都有了,用户用起来爽不爽才不管。
    B 的话虽然颜色、样式显得也一样土,但最起码信息显示有主次、界面布局有留白,才能引导用户产生“操作逻辑”。

    一句话评语:
    A不如干脆让用户去直接连数据库自己 CRUD 吧。
    B传统国产软件。
    blackshow
        96
    blackshow  
       2021-08-31 16:42:33 +08:00
    A 太丑了。。。。
    wuxinling
        97
    wuxinling  
       2021-08-31 16:44:23 +08:00
    @ily433664 (□′)┻━┻ 后端程序员坚决不背这个锅!明明是你们先要求后端程序员画界面的!!!
    lerp
        98
    lerp  
    PRO
       2021-08-31 16:44:36 +08:00
    A 看着很累
    hst001
        99
    hst001  
       2021-08-31 16:46:59 +08:00 via Android
    A 的颜色搭配拉垮
    EvansUtopia
        100
    EvansUtopia  
       2021-08-31 16:48:19 +08:00
    你们没有产品没有交互没有视觉吗...
    1  2  3  
    关于     帮助文档     自助推广系统     博客/a>     API     FAQ     Solana     2775 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 31ms UTC 14:24 PVG 22:24 LAX 07:24 JFK 10:24
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86