2019年最流行的10个前端框架 设计师快来收藏

【陈双义博客】从去年下半年开始,互联网行业慢慢进入寒冬,一些设计师也不得不重新找工作。打铁还需自身硬,找工作最重要的还是靠自身的能力。

那么究竟需要具备什么样的能力能得到公司的青睐呢?

陈双义博客

就拿市面上众多的 UI 培训班来说吧,作为盈利性机构,培训班的课程结构肯定是和当下公司实际需求挂钩的。毕业的学生被公司录用越多,口碑效应就会出现,那么报班的生源也会越多,培训机构自然赚的越多。

越来越多的培训机构开设了前端课程,这就说明公司实际需求大概也是这样的。现在求职,不说自己会点前端都不好意思面试,UI设计师学前端也是时下的趋势。

实际上,在公司项目中,设计师了解前端,会极大提升和程序员的协作效率,减少技术信息不对称的现象。如果在一个网站项目中,程序员还在跟设计师讲解最基本的 html、css、盒子模型知识,那开发效率就可想而知了。

很多公司的项目,都采用了前端框架来开发,如果设计师了解这些框架,能在框架的结构基础上进行 UI 设计,那无疑会提高项目整体的开发效率。下面就一起了解下常见的前端框架,说不定面试的时候能帮大忙。

Ant Design

网站链接:https://ant.design/index-cn

陈双义博客

蚂蚁金服出品,非常著名的框架。就算你不了解前端,也会在公司的项目中多少听到程序员说起过。目前很多公司都在用,已经很成熟。而且提供了对设计师友好的 Sketch 规范文件,可以直接拿来用。

Ant Design 是基于 React 开发的,并不是传统的 html。React 起源于 Facebook 的内部项目,现在已经成了一个很流行的开发工具。

理想的项目开发流程是,设计师和程序员一起熟悉 Ant Design 的各种样式,设计师不再随意设计,而是基于框架的基础样式进行设计创新。这样程序员在进行 UI设计稿还原的时候,能极大提高开发效率。

现在很多项目都使用了 Ant Design,一些公司在招聘 UI设计师的时候甚至会写上:了解 Ant Design 规范的优先考虑。所以这个框架建议设计师都好好看一下。

Bootstrap

网站链接:http://www.bootcss.com/

陈双义博客

Bootstrap 是 Twitter 推出的一个用于前端开发的开源工具包,是一个 CSS/HTML 框架,目前世界上的很多网站开发都使用了这个。其中的栅格理论、响应式解决方案都变成了业界的参考规范。

很多设计师在学前端的时候,都会接触到这个框架,甚至培训机构有专门的课程,所以重要性可见一斑。

Taro UI

网站链接:https://taro-ui.aotu.io/

陈双义博客

Taro UI,一套基于 Taro 框架开发的多端UI组件库,可以在微信小程序/H5/ReactNative 等多端适配运行。京东用户体验设计部的凹凸实验室出品。

现在一个产品要求在 iOS、安卓、小程序、h5 等多端运行,针对不同的客户端开发不同的代码会产生巨大的成本,这时候只编写一套代码就能够适配到多端的能力就显得极为需要。

使用 Taro,就可以只写一套代码,再通过 Taro 的编译工具,将源代码分别编译出可以在不同端(微信小程序、H5、RN等)运行的代码,节约成本。

iView

网站链接:https://www.iviewui.com/

陈双义博客

一套基于 Vue.js 的高质量 UI组件库。Vue.js 是一个 JavaScriptMVVM 库,是一套构建用户界面的渐进式框架。

在网站中可以看到数量众多的 UI组件和对应代码,本质上和我们制作 UI规范是一样的。

LuLu UI

网站链接:https://l-ui.com/

陈双义博客

LuLu UI,是一个基于 jQuery,针对 PC 网站,兼容 ie8、ie7 的前端 UI 框架,包含很多静态或动态 UI 组件。对设计师非常友好,只需要简单的 html、css 知识就能快速上手使用。

区别于 Ant design 面向中后台开发,LuLu UI 非常适合面向外部用户的网站开发。会简单的 HTML 和 jQuery 就可以上手了,不像一些流行框架,需要较多的学习成本。

QMUI

网站链接:https://qmuiteam.com/

陈双义博客

QMUI,腾讯出品,分为 Web、iOS、安卓三个端,都有相应的 dome 下载安装,设计师可以下载安卓和 iOS 应用,经常看看里面的组件,熟悉后,和技术的协作会更有效率。

Element

网站链接:http://element-cn.eleme.io/#/zh-CN

陈双义博客

饿了么出品,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库,很适合开发后台产品。有意思的是里面的默认图文数据很多都是食物……

Fusion Design

网站链接:https://fusion.design/

陈双义博客

阿里推出的一个适合设计、技术共同使用的设计规范框架。基本目的也是为了让设计师在一个标准框架内设计界面,同时也提供了 Sketch 插件,让设计的组件直接转化为代码,技术直接调用。

WeUI

网站链接:https://weui.io/

陈双义博客

WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信内网页和微信小程序量身设计,令用户的使用感知更加统一。

这个小巧的框架提供了微信页面常用的组件,我们在设计微信风格的项目时,可以参考使用。

Framework 7

网站链接:http://www.framework7.cn/

陈双义博客

一个简单、免费的 HTML 框架,主要用来构建移动端 web 应用,分为 iOS 和安卓两种风格。

其本身的结构非常简单,使用了最基础的 html、css 和 js 构建,很容易上手使用。也可以用来作为原型开发工具,迅速创建一个应用的原型。

总结

此外还有很多其他的前端框架,以上10个框架其实不需要设计师非常深入去了解,最基本的要求是设计师对其内容、样式、组件有个大致的认知即可。在和技术协作的过程中,知道哪些组件不需要额外设计,哪些组件可以进行样式扩展。

就比如设计师去学习前端,并不是去代替前端的工作,而是对 UI 界面有个更深层次的认知,设计的同时会考虑到界面的交互性、扩展性、可用性。犹如庖丁解牛,透过表象看到结构本质,提高自己的界面把控能力。

打赏 支付宝打赏 微信打赏
本文标题:2019年最流行的10个前端框架 设计师快来收藏
本文链接:https://www.chenshuangyi.com/post/669.html
作者授权:除特别说明外,本文由 陈双义 原创编译并授权 陈双义博客 - 互联网Power 刊载发布。
版权声明:本文使用「署名-非商业性使用-相同方式共享」创作共享协议,转载或使用请遵守署名协议。

为您推荐

Google 开源 I/O 2019 大会上的 Android 应用

Google 开源 I/O 2019 大会上的 Android 应用

Google 近日开源了今年 I/O 大会上用于演示 Android 最新特性的应用 Google I/O Androi...

2019-08-18 标签:谷歌AndroidAndroidQUI
高德地图iOS版10.0正式更新:全新UI设计

高德地图iOS版10.0正式更新:全新UI设计

【陈双义博客】今日,高德地图iOS版10.0正式更新,带来了更加扁平化的全新UI设计。整体主页设计分为“首页”、“发现”...

2019-08-07 标签:高德地图iOSUI
网页和UI设计师常用的在线协同工具有哪些?

网页和UI设计师常用的在线协同工具有哪些?

在专业设计领域,协同合作是创造优秀设计,成功完成设计项目的关键性因素。团队内部如果缺乏互动,怎会对项目产生负面的影响。为...

2018-02-23 标签:UI设计网页设计
2018 年,App 用户界面设计的九大趋势

2018 年,App 用户界面设计的九大趋势

1. 重叠字体、图形以及颜色的重叠,不仅可以使界面看上去更加醒目鲜明,还可以营造出一种空间感。 这也是为什么在不同的AP...

2018-02-14 标签:UI用户界面APP

发表评论

«   2019年8月   »
1234
567891011
12131415161718
19202122232425
262728293031
云服务器
轻量应用
站点信息
  • 文章总数:999
  • 页面总数:9
  • 分类总数:19
  • 标签总数:1613
  • 评论总数:162
  • 浏览总数:567573

当前非电脑浏览器正常宽度,请使用移动设备访问本站!