zoukankan      html  css  js  c++  java
  • 静态按钮UI优化

    讨论一下静态按钮的样式可以如何优化(国产动态按钮较少,当用户量大了也是相当耗费资源的一件事),那就讨论一下静态按钮优化的一些思路:

    1,直角与圆角

    根据我所找的一些样本,大多数采用圆角,见附录。然后就是圆多少的问题了,有两种,一种是圆一丢丢,把直角整没了;另外一种就是圆一半,左右变成半圆。

    在一些纯图形表意的按钮,直接用圆了。【不管用多少,用圆基本上成为了常态】

    image-20200729170855448image-20200729170902808image-20200729170908895

    2,按钮中嵌入图片

    在表意上更为强烈!!!【即使没有合适的图,一个红点也让按钮有了更强烈的生命力】

    image-20200729170935808image-20200729170941576image-20200729170953320image-20200729171017128image-20200729171034520

    3,使用对比度强的配色更醒目

    对我这种接近红绿色盲的人来说,没资格说颜色。/(ㄒoㄒ)/~~

    白色也太百搭了把

    image-20200729171305329

    但是跟黑色是对比最强烈的

    image-20200729171325511

    element这个框架做了一般性通用颜色的示意,但与实际还是有所出入

    红色是公认的危险按钮,与之对应的就是绿色,安全的意思。

    剩下的就仁者见任,智者见智了

    image-20200729171402095

    比如得到这种橘配白色

    image-20200729171701247

    飞猪用黄配黑来作为主要功能键的配色

    image-20200729171721823

    相对来说,飞猪的醒目程度比得到更强一些。

    附录

    image-20200729170017802

    image-20200729170029672

    image-20200729170045561

    image-20200729170110322

    image-20200729170155345

    image-20200729170204377

    image-20200729170225305

    image-20200729170248624

    image-20200729170301032

    image-20200729170326065

    image-20200729170342376

  • 相关阅读:
    pip 笔记
    Codeforces Round #739
    leetcode周赛 248
    AcWing周赛 6
    AcWing周赛 5
    算法提高--最长上升子序列一
    算法提高--数字三角形模型
    数据结构--线段树
    leetcode周赛 243
    AcWing周赛 1
  • 原文地址:https://www.cnblogs.com/noneplus/p/13398369.html
Copyright © 2011-2022 走看看