2019年,UI设计师应该了解的这10个前端框架

从去年下半年开始,互联网行业慢慢进入寒冬,一些设计师也不得不重新找工作。关于求职这个事情,UI黑客之前写过一篇文章《面试了50多位UI设计师,我总结了这些求职技巧》,大家可以参考下。打铁还需自身硬,找工作最重要的还是靠自身的能力。

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

就拿市面上众多的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界面有个更深层次的认知,设计的同时会考虑到界面的交互性、扩展性、可用性。犹如庖丁解牛,透过表象看到结构本质,提高自己的界面把控能力。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 211,376评论 6 491
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,126评论 2 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 156,966评论 0 347
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,432评论 1 283
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,519评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,792评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,933评论 3 406
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,701评论 0 266
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,143评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,488评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,626评论 1 340
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,292评论 4 329
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,896评论 3 313
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,742评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,977评论 1 265
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,324评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,494评论 2 348

推荐阅读更多精彩内容

  • 请关注不错研究室 在公司项目中,设计师了解前端,会极大提升和程序员的协作效率,减少技术信息不对称的现象。如果在一个...
    不错研究室阅读 3,567评论 0 8
  • 16款优秀的Vue UI组件库推荐 Vue 是一个轻巧、高性能、可组件化的MVVM库,API简洁明了,上手快。从V...
    晏辉_e7c6阅读 2,902评论 0 31
  • 心形湖 又是一个寒冷的周五,还是迷我心智的心形湖。它给我的记忆总是那么冰冷,许是我第一次一个人来就快立冬的原因...
    王鑫利_阅读 194评论 0 1
  • 今天晚上给路虎喷卡钳,买了一个套装。喷上去挺好,有一个轮没有喷好,拿别的品牌的喷一遍,咬了。洗掉重新喷
    d005a7da9b80阅读 221评论 0 0
  • 还记得母亲在集市上买了几只鹅,母亲说专捡大的买的,看着样子也机灵,容易养。还说等长大了,如果是母的就留着它下蛋,要...
    自在闲士阅读 285评论 1 7