• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >心得技巧 > 大公司如何做设计系统?24 个 Sketch 组件库源文件合集下载

大公司如何做设计系统?24 个 Sketch 组件库源文件合集下载

作者:Jamie Fang 字体:[增加 减小] 来源:互联网 时间:2018-08-23

本文主要包含sketch,交互组件库,界面组件,设计系统,资源下载等相关知识,Jamie Fang希望在学习及工作中可以帮助到您

最近几年,设计系统非常火。不管是 2C 还是 2B,很多大公司(甚至是政府)都构建了自己的设计系统。如果你想学习别人是如何搭建设计系统、组件库和交互规范,最快的方式就是研究他们的设计源文件。

△?alexpate/awesome-design-systems

△?Examples

△?Adele – Design Systems and Pattern Libraries Repository

△?Design Systems Repo

从这些 Design System Repo 中可以看出,大部分设计团队都选择用 Sketch 来搭建设计规范和可复用的组件库。这里收集了 24 个公开的官方 Sketch 组件库,源文件资源可以下载。

△?合集下载链接(2018/05/08 更新)

1. Apple UI Design Resources

下载地址:Design Resources – Apple Developer

2. Google Material Design

下载地址:Sticker sheets & icons – Resources – Material Design

3. Ant Design 蚂蚁金服

下载地址:A UI Design Language

4. Salesforce Lightning Design System

下载地址:Downloads – Lightning Design System

5. GE Predix Design System

下载地址:Predix Design System

6. Shopify Polaris

下载地址:Resources – Shopify Polaris

7. VMware Clarity

下载地址:https://vmware.github.io/clarity/news

8. Palantir Blueprint

下载地址:Blueprint – Documentation

9. Atlassian

下载地址:Web GUI pack | Atlassian Design

10. Nutanix Design System

下载地址:Nutanix UI Visual Guideline 2.0

11. Trello Nachos

下载地址:Nachos | Trello

12. IBM Carbon

下载地址:Carbon Design System

13. Priceline Design System

下载地址:Priceline One Design System

14. Microsoft Fluent Design System

下载地址:Design Universal Windows Platform (UWP) apps

15. U.S. Web Design System

下载地址:https://designsystem.digital.gov/getting-started/designers/

16. Morningstar Design System

下载地址:http://designsystem.morningstar.com/getting-started.html

17. Element 饿了么

下载地址:Element

18. MongoDB Design

下载地址:MongoDB Design

19. Audi

下载地址:User Interface / UI Introduction

20. Hewlett Packard Grommet

下载地址:Grommet

21. WeUI 微信

下载地址:weui/weui-design

22. macOS UI Library (非官方,由 Sketch 团队维护)

下载地址:macOS UI Library

23. Mand Mobile 滴滴

下载地址:Mand Mobile

24. Auth0 Cosmos

下载地址:Cosmos – Auth0 Design System

再安利一个 Sketch 插件

Automate-Sketch 插件的作者 @Ashung Hung?出了一款新插件 Ashung/design-systems,可以快速帮你找到最新的设计系统。

△ https://github.com/Ashung/design-systems

作者社交网络账户:

  • 知乎:https://www.zhihu.com/people/jamiefang/activities
  • 推特:https://twitter.com/jamiefang
  • 追波:https://dribbble.com/jamiefang

图片素材作者:rybaki

「设计系统好文合集」

  • 《大型的视觉设计系统都是怎么设计出来的?》
  • 《从设计指南说起,详解iOS系统组件分类体系》
  • 《超全面总结!「完美」的字体系统搭建与维护指南》

================明星栏目推荐================

优优教程网: UiiiUiii.com 是优设旗下优质中文教程网站,分享了大量PS、AE、AI、C4D等中文教程,为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章,按照我们的专栏一步步学习,一定可以迅速上手并制作出酷炫的视觉效果。

设计导航:国内人气最高的设计网址导航,设计师必备: http://hao..com

优设大课堂

您可能想查找下面的文章:

  • 高手进阶技巧!全方位深入理解 Sketch 库(上)
  • 高手进阶技巧!全方位深入理解 Sketch 库(中)
  • 大公司如何做设计系统?24 个 Sketch 组件库源文件合集下载
  • 我们拿到了InVision Studio 的内测资格,设计师们关心的都在这里
  • 免费高效!用 Paddy 让你的 Sketch 学会自动排版!
  • 学会这4大Sketch 高阶技巧,让你的效率猛翻10倍!
  • 两分钟认识一款把 Sketch 变成 Principle 的插件:Diya
  • Sketch 49 的交互原型新功能怎么用?来看这篇教程!
  • 简单实用!七步学会用 Sketch 搭建复杂表格
  • 新鲜出炉!五个超方便的Sketch 48 新功能介绍

相关文章

  • 2018-08-23谷歌设计师:如何评价新版 iPhone X 的设计规范?
  • 2018-08-23用标签代替文件夹!教你更高效的图片素材管理术
  • 2018-08-23当总监说你的作品太肤浅时,该如何改进?
  • 2017-08-06系统之外的字体引用及过渡效果
  • 2018-08-23最新版iOS 11设计规范发布了,来下载官方源文件!
  • 2018-08-23设计新手最常见的4个问题,高手统一为大家做解答!
  • 2017-08-06ie8,chrome中table的宽度固定方法
  • 2017-08-06impress.js表现层框架(演示工具)-初体验
  • 2017-08-06你需要知道的18个Web可用性原则
  • 2017-08-06最短JS判断是否为IE6(IE的写法)

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • 解决stackoverflow打开慢的方法
    • 提高设计说服力!来学习这个腾讯内部的设计效果检验方法
    • 网易云音乐产品负责人:如何做好用户研究的?(下)
    • 让网站支持老版本IE6、7、8、9浏览器的3种解决方案
    • Google对话式交互规范指南(八):通过确认和应答给予用户信心
    • 让IE6、IE7、IE8支持CSS3的圆角、阴影样式
    • 高性能网站优化指南
    • 浅谈H标签定义和注意事项
    • 超全面的图标基础知识总结
    • 浅谈React

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有