News center新闻资讯

4002-935-753

新闻资讯

app tab指示设计一些方向

2018-09-22

  顶部选项卡是设计应用程序时最常用的组件。它可以在各种类型的应用程序中看到,例如信息,购物,教育,音乐,视频等。虽然它占用少量页面空间,但它没有太多空间。在界面中起到了很大的作用,这种共享是一种简单的最常用的Tab类型,侧重于标签设计思想,常用样式和其他值。
  一.为什么有标签?
  当界面呈现不在单个维度中的资源时,为了允许用户快速找到目标资源,根据不同的维度对资源进行分类。例如,视频应用的视频类型具有热点,电影,电视剧,综艺节目等,并且用户不同。当在资源类型之间切换时,为了防止用户迷路,有必要将当前标签和其他标签区分为更明显的样式,以便用户可以清楚地找到他们的位置。
app制作1
  二.顶部标签的类型
  在显示现有选项卡说明之前,让我们简要介绍一下选项卡的类型,以便我们可以根据不同类型的选项卡提供不同的指示样式。1.纯文本选项卡这是最常用的选项卡类型。基于信息,音乐,视频,社交和其他基于内容的APP基本上都是这种表达形式。
  2.Text+图标选项卡
  此类标签通常用于购物应用,在电子商务和外卖应用中很常见。
  三。顶部标签表示设计思路
  通过了解选项卡的类型,我们可以看到两者一起看两个元素,一个是文本,另一个是图形。让我们来看看这两个元素想要做出的不同之处:1。有三种主要方法可以区分不同的文本。一个是字体大小,另一个是重量差异,第三个是颜色。
  2.图形
  为了使图形结构有所不同,主要有两种方式,一种是颜色差异,另一种是图形结构的差异(线切换)
  当然,您可能还想说您也可以制作不同尺寸。这种想法在设计中是一种非常常见的方法,但它不适用于顶部选项卡的小空间,因为用户更注重文本内容。该图标仅用于帮助解释。它不应该是这里主角的头,这个小空间不适合这种复杂的变化。
  3.介绍第三方
  标签本身的元素可以有所不同,但为了使这种差异更加明显,我们通常在界面设计中引导第三方,在文本周围放置一个简单的图形以帮助定位指令。根据一般和特点可分为两种形式:一种是小水平线提示,另一种是反映产品品牌特征的元素。
  以上是设计标签的最基本思路。这些设计思路可以单独显示,也可以与其他类型组合显示。下面我们将具体展示它们在界面中的呈现方式。
  顶部标签指示器类型显示
  1.文字颜色不同
  有两种主要方法可以改变文本的颜色:
  常规选项卡使用黑色文本,当前指示的选项卡由品牌颜色指示。
  带灰色文本的常规选项卡,当前显示带有黑色文本的选项卡
  2.重量这个词是不同的
  从下图中的示例中,我们可以看到单词重量的变化通常不会单独出现,但通常与颜色,字体大小等的变化一起使用。
  3.字体大小不同
  字体大小通常伴随着颜色和重量的差异,或引入第三方。
  4.不同的图形
  选项卡上的图形之间的差异主要是在线面部之间的区别,当前状态是面部图标。
app制作2
  5.小水平线指示
  一个是黑色水平线,通常从底部工具的图标开关也是黑色,没有品牌属性;
  例如。每个人都是产品经理。在整个主页中没有颜色倾向,这创造了身临其境的阅读体验。因此,tab指令也使用黑色来匹配整体样式。
  一个是品牌颜色的横线;
  例如。MaHoneycomb是一个生活旅行服务应用程序。为了让用户更深入地了解品牌颜色,页面上要强调的是品牌颜色。Tab也是品牌颜色之一的体现。
  小水平线视觉性能延伸
  不同颜色的不同选项卡
  这是一种特殊的表达形式。不同类型的标签由不同颜色表示。
  eg.36kr主模块的主要颜色非常丰富,主要体现在图标和模块入口颜色上,顶部标签指示也与整体颜色倾向相呼应。
  可以使用固定数量,并且少量的标签分类,因为表格标记复杂,记忆点清晰,可以在生活娱乐App中使用,增强页面的视觉表现力。
  6.有四种主要方式表达品牌的品牌特征,反映品牌的特征。
  通过品牌颜色增强用户对品牌颜色的记忆点;
  徽标辅助图形的扩展;
  例如。马蜂窝的短线是从标志上取下来的,就像一个笑脸给人一种青春活力和温暖的感觉,而且记忆力特别深,加上波纹的动感形态,你可以感受到心灵的设计。
  口号图形重用;
  例如。网易新闻,每个人都有一种态度。通过图形的细化和态度的运用,人们可以对品牌口号有深刻的记忆,对品牌文化产生非常积极和积极的影响。
  例如。虾音乐将声波引入标签。这也是一个非常好的表达。记忆很深,涟漪的节奏为整个标签增添了一种设计感。使用起来既有趣又有趣。
  7.图形第三方这种图形第三方主要用于电子商务平台,因为页面内容,颜色和形式更丰富。在这种情况下,如果你想反映差异感,你需要扩大技巧。图形构成了背景。
  例如。我们可以看到美国集团外卖的图标以现实的方式表达。不可能区分形式和颜色。此时,非常有必要引入背景颜色来引发,但不想破坏页面的透气性。舒适是使用这种浅梯度形式,视觉上舒适。
  总结一下
  今天,我主要解释了选项卡说明和常用选项卡表单的设计思路。我希望我可以扩展我的想法,并根据现有的风格进行更多的试验和扩展。我可以输出更有趣,丰富和漂亮的标签。将新颜色添加到整个设计资源库。
地址:江苏省苏州高新区晋源路鸿祥娱乐网络公司 电话:4002-935-753 邮箱:zhangsa@126.com
Copyright © 2018-2019 苏州鸿祥娱乐网络有限公司 版权所有 ICP备案编号:ICP备案中