四虎影院网址多少
栏目分类
热点资讯
呦呦免费无限

你的位置:四虎影院网址多少 > 呦呦免费无限 > 呦呦免费无限 有哪些组件值得学习?吾梳理了八个大厂的设计组件!

呦呦免费无限 有哪些组件值得学习?吾梳理了八个大厂的设计组件!

发布日期:2021-09-20 03:11    点击次数:191

设计组件行为设计体系里的构成片面呦呦免费无限,能够说是构成这个体系最基础也是最实用的片面了。它的展现比“设计体系”这个概念来得早,现在吾们常说的积累沉淀、可复用、避免重复造轮子、挑高效率等益处,大多是来源于它。

两个人高清免费视频完整版

早期的时候,组件拆分为两个自力的概念,一个以形式为主,将常用的界面元素挑炼出来,根据挑炼的周围包括形式、形状、状态甚至交互,受多主要为 UI 设计师,主要是为了挑高设计师画图的效率。另外一个以逻辑为主,将常用的功能定义,交互规则和有关代码等挑炼出来,受多主要为研发工程师(也辐射到交互设计师和产品经理),主要是为了挑高研发码代码的效率。后来,一方面由于设计和研发配相符性的强化,另一方面,能够是人们发现两个库的现在录长得差不多,现在许多设计体系最先逐渐联相符为一个概念。

模式和组件 ©Nathan Curtis 

但这两个概念在整个走业并异国十足联相符,添上设计圈也最先用组件(component)这个概念就更有点乱了,最初的 component 是由研发牵头的,介绍里可是主要讲代码的。而现在在相反性的驱动下,能够会展现概念名词的混用,联相符个名词,这个设计体系里能够指一个概念,在另外一个设计体系里能够又指向了另外一个概念。在这篇文章里,吾以“设计组件”来代外这两个概念。(即用设计组件来代外吾上一篇文的组件和模式两个名词。)

五个大厂 web 端组件 1. Ant design 组件

网址: https://ant-design.gitee.io/components/overview-cn/

蚂蚁集团出品,分 7 个大类挑供了 61 个组件,技术和设计联相符,每个组件上面是设计的介绍,下面就对答 API,而且能够声援 VUE 和 React 两栽技术栈。挑供的 UI kit 也和网站的现在录对答的特意益。吾本身带的设计组在做 web 端的时候也选用了 Ant design 为基础。

2. Element design 组件

网址: https://element.eleme.cn/#/zh-CN/component/installation

饿了么出品,也和技术做了联相符,声援的是 react 技术栈;和 Ant design 相通也对一切组件先辈走了分类,分为六个大类挨近 70 个组件,不过在六大类中有一个基础分类,内里包含了色彩、icon、字体等,遵命吾上篇文里的分类,算风格和规范了。同为阿里旗下的组件,幼我比较爱 Ant design,单从分类来说更具参考性一些。(详细分类参见文末外格)

3. Shopify Polaris 组件

网址: https://polaris.shopify.com/components/get-started

添拿大一家很著名的跨国 Saas 模式电商服务公司出品的,将组件分为四个大类挑供 24 个组件,技术和设计的联相符性也做的很益,技术栈声援 React,css only。现在设计资源仅挑供 figma 格式,figma 上有该设计团队特意挑供资源的网址: https://www.figma.com/@shopify

4. Aliteambition Clarity design 组件

网址: https://design.teambition.com/

将组件分为了四个大类,基础、区块、营业,还有个比较稀奇的页面模板类别。UI 资源里基础和营业类组件就有 49 个。和研发的联相符性也做的很益,每个组件的介绍都包含设计侧和研发侧 API 的介绍,声援 React 技术栈。

5. IBM Cartoon design 组件

网址: https://www.ibm.com/design/language/

比较老牌的经典设计体系呦呦免费无限,统统 35 个设计组件异国像前线的设计相通再分大类。每个组件会分类介绍它的用法、形式、代码和可用性,资源挑供 sketch/XD/Axure 三栽格式。

微柔公司 1. MR design 组件

网址: https://docs.microsoft.com/zh-cn/windows/mixed-reality/discover/mixed-reality

figma 资源网址: https://www.figma.com/file/ltLag9SxjUIyLQFsp7NNE7/Figma-Toolkit-for-MRTK-/-HoloLens,-Windows-Mixed-Reality?node-id=116:4

针对微柔旗下的虚拟同化眼镜 Hololens 的设计体系,技术栈基于 Unity。

网页展现上秉承了整个公司的产品线,异国单独启一个网站,这点照样蛮尊重微柔的,毕竟这么多营业。

网站现在录里异国联相符设计组件概念,取而代之的是交互模式和 UX 元素中的控件和走为。但现在挑供的 figma 格式资源,内里是有用组件这个概念的,和页面现在录并异国逐一对答。吾这边以它挑供的 figma 文件来算,分为九个类别 14 个组件,包括具有 MR 特色的比如 Hand Gestures(现在录对答 Hand coach)和 Bounding Box(现在录对答 Bounding Box and App bars)。从数目上来望答该是吾这批捋的里最少的,但由于 MR 内情结相符的特性,许多造就不是单纯的 UI 能挑供,而是二维 UI、三维模型、光效和特效、算法,界面研发共同的作用。

2. Fluent design 组件

网址: https://docs.microsoft.com/zh-cn/windows/apps/design/

微柔公司最著名的设计体系和它最让人熟知的产品同源,作用对象主要为微柔体系的桌面行使(UWP),并以此为基础涵盖多个终端,分为 12 类共计 56 个设计组件。和研发的联相符性也做的比较益,每一个组件页面都挑供对答的开发文档。另外,和 Hololens 的 MR 设计组件相通,现在 UIkit 也只挑供 figma 格式资源。

谷歌公司的 Material design

网址: https://material.io/components

相较于微柔公司,基于 Anroid 体系扩展到其他终端的设计说话对后来的终端进走了更益的兼容,统统 30 个组件也异国再分类,技术和设计端也很益的联相符在了一首,在每个组件的介绍页面既有设计侧的介绍也有给研发工程师望的内容。

在这 30 个组件里,有 7 个组件不是源于最初的 Android 移动端,而是基于终端特性新建的,这 7 个组件是 Backdrop/Banners/Data tables/image lists/Lists/Sheets:side/Tooltips。

设计资源挑供了 XD、figma 和 Sketch 三栽文件格式。

苹果公司的 Human Interface Guidlines

网址: https://developer.apple.com/design/human-interface-guidelines/

最早以设计著名的苹果公司的设计体系,它异国像随之而首的谷歌 Material design、微柔 Fluent design 等给本身取了一个益听的名字,就照样吾最初清新它的谁人标题:Human Interface Guidlines。

人机界面请示现在的。望望这名字,一股提醒江山的豪迈铺面而来!这格局,这气势,比不得比不得!(抱歉,近来二次元望得比较多)

不过,从那台革新了手机走业的第一代 iPhone 最先,它实在划开了一个时代,异国只说不做。

现在,苹果的 OS 组件已经随着苹果产品线的扩大从最初的 ios 扩展到了 iOS、MacOS、WatchOS、tvOS 四大终端,主要为多多在这些 OS 上研发行使的开发者(包括设计师)服务。设计和研发的联相符性也做的不错,但设计下的组件介绍页面并争吵开发说话同化,而所以“For developer guidance“起头,请示链接到另外的页面。和谷歌在组件下分终端纷歧样,苹果的整个 OS 体系固然秉承了相反性,但每个终端都对答单独的一套设计体系,并异国“组件”这个概念。设计资源方面,在各个公司中稀奇的包含了 PS 格式的资源,OS13 还声援了 Keynote 格式。

1. iOS

苹果设计体系的源首之处,对答手机和 pad 端。

现在录里对答设计组件的类别有四个分类(Bars、Views、Controls、Extensions)共计 38 个组件。另外还有行使架构、用户交互、体系能力三个比较方向交互逻辑和规则的介绍。不过,固然 OS 体系的设计在其网站上异国用组件这个词,但它们的 Sketch 文件里倒是照样行使了组件(conponents)。

2. MacOS

现在录里将对答设计组件分成 Windows and Views、Menu、Buttons、Fields and Labels、Selector、indicators、Touch Bar 和 Extensions 八个分类,共计 56 个组件。

益玩的是,MacOS 里还把它不提出行使的组件也放在了现在录内(吾这边未计入组件数 56 内),比如在窗口和视图分类里,它把本身不提出行使的 Drawers 和 Placards 也列了进往,并列出了选举行使的其他组件。自然是放眼人机界面请示现在的,而不是限制在本身的 OS 设计体系内。

2. WatchOS

现在录里设计组件这个概念被拆对答 Interaction 和 Element 两大类,下面共计 22 个组件。和微柔的 MR design 相通,由于终端的稀奇性,交互分类下能够望到 Haptics 触觉这栽在其他设计组件里可贵一见的现在录,也能够在 Element 里望到比如 Activity Rings 这栽比较有有趣的组件。

3. tvOS

网站现在录上和 watchOS 相通行使的是 Element 概念,下面统统 13 个组件。

总的来说,能够望到在近几年新出的,终端比较单一的设计组件里两个概念联相符的趋势外现清晰,但组件的概念随着产品和营业的扩展而复杂化后,这两个概念就又会表现出还未十足联相符时的别离状态,这在早几年就最先建设设计体系并影响到整个走业的谷歌、苹果和微柔产品的组件设计中都可见端倪。

随着设计工程化和研发与设计配相符性的强化,吾认为整个走业中,这两个概念必将会不息相符并联相符,但落到每一个详细的设计体系上,设计组件是否必要设计研发联相符,联相符到什么水平,照样要望设计组件存在的详细环境和需求的。毕竟,回归本源,组件这个东西的存在,和设计体系相通,都是为了升迁效率才展现的。

末了,附一张这几个设计组件的对比外格:



友情链接:

Powered by 四虎影院网址多少 @2013-2021 RSS地图 HTML地图