恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
通过Framer来谈谈设计师学习代码二三事
0.0°
2017-07-03 原创文章 经验/观点 举报 749 2 1 0

前段时间Framer改版,让这个软件大热,分出了设计和代码两种模式。阁主喜欢尝试新鲜事物的性格,这下子也是跃跃欲试。这一周,终于静下心来去尝试做了一个demo。通过做这个demo,阁主通过Framer的尝试,来说说设计师到底有没有必要学习代码。


Framer简介


先来说说阁主对Framer的理解。

Image title


Framer是一个用来做动效的软件,用来将咱们二维平面软件设计出来的方案做成可以在手机上可以进行真实模拟操作交互的原型出来。市面上有很多种这样的软件,每个软件的原理可能不太一样,比方说Flinto,Principle,Origami等等。


绝大部分都是在视觉基础上进行一些手势的串联,设计师只需要设置出类似流程线的东西,设置好一些参数(不需要写代码),软件就会帮忙进行计算,然后渲染出demo,即咱们所说的原型。


Framer的不同之处,它是真的是让设计师去写代码呀,通过代码实现出原型,当然Framer它自己也做了很多的类似于效果包的代码库,设计师只需要调出来进行使用就可以。意思就是,不是每行代码设计师都要敲,Framer是简化后的代码模式软件。还有就是它支持Sketch等文件的导入,也就是说咱们可以在sketch上画好了,再到Framer进行动态效果的呈现,不需要将每个图层都在Framer进行代码实现。(后来验证,画图还是在Framer自己的设计模式进行画实现才比较方便)


Image title


怎样学习


入手Framer的时候,阁主先从它全英文的手册开始看,跳过设计模式(粗略看了一下觉得跟sketch的用法很像),直接从代码模式进行查看。知道了原来它是基于CoffeeScript语言进行demo开发的。当然,手册网上也可以找到部分的中文翻译,但更新不完全,阁主也下了一番功夫,将最新的Framer的代码手册翻译成了中文,整理好了之后会给分享给大家。


CoffeeScript阁主也不会,于是又从网上去找相应的官方手册,于是发现,太TMD难了,一点也不想看(原谅阁主也是个萌妹纸,偶尔也会任性)。


于是,阁主一不做二不休,直接从Framer官方网站的简易版手册和部分教学视频开始学习。然后画好了sketch文件,导入到Framer进行敲代码了。当然也是不完全会的,先在官网上看手册,然后加入一些学习小组的群在群里进行讨论(阁主第一个群人满,以后有需要再开第二个)。


然后遇到都不懂的问题(毕竟咱们都是设计师),阁主就在下班后拿去请教公司的开发GG们,当然也不能太多,可以分开进行问几个人,这样每个人都比较轻松。

就这样纠结了好几天,一个雏形的demo算是做出来了。


阁主现在说的是很轻松,每一步实施起来都是困难重重,因为不懂所以会遇到很多问题,然后自己再耐心一个个解决。



学习中的收获


这一个礼拜的收获除了自己入门的Framer,还有几点比较重要。


一是验证了阁主一直强调的学习方法,即实践总是让自己学习最快的流程,没有之一


二是最为交互设计师,领悟到了之前开发GG们一直强调的一句话“设计师的方案是会影响到开发代码实现的逻辑的”。设计师在做方案的过程中不要突发奇想去想一些很创新的idea,往往这些idea可以解决当前的交互问题,可能却不知道影响了哪些地方的操作和逻辑的统一性。考虑问题的时候不单单从一个小的点进行思考,如果可以,尽量从大局,即所有的功能点都进行一些思考。操作越统一,代码越简单,逻辑越清晰,实现起来也越方便。



设计师到底要不要学代码


如果从大的方向来思考一下,设计师到底需不需要学习代码?随着阁主工作经验的丰富,阁主从现阶段的理解来跟大家聊聊。


主要可以分为两个阶段,如果是新手,也就是想换行到互联网领域的设计师,或者说从业大概1~2年以内的设计师(求职的时候会代码会给设计师加分但不是主要的判断依据),这个阶段阁主建议暂时不需要将精力放在学代码上面,这个阶段主要是设计基本功的扎实,颜色、字体、排版的功底在这个阶段更重要。


度过新手,处于上升期或者稳定期的设计师,也就是工作2~3年以上的设计师,可以开始这方面的着手了,但依个人精力来进行一个判定,不强求。学了代码自己思维训练又多了一个维度,跟开发交流起来更加方便。不学的话自己主攻视觉UI这一层也很不错。


总的来说,学了更好,不学影响也不是很大,术业有专攻,这只是一件锦上添花的事情。个人愚见,只限于同行进行交流。


会代码的设计师会让人看起来很酷,但不代表着职场核心竞争力会变强,人最核心的竞争力还是寻找问题核心的分析力以及解决问题的执行力。但如果阁下是个洒脱之人,去看看学学也是件极好的事情,说不准哪天在哪个场合也能用上~祝大伙越来越棒~



作者简介:Sophia的玲珑阁,一枚爱折腾,爱健身的交互设计妹纸。
职场设计技能,更多教程抢先看,请关注作者的微信公众号:Sophia的玲珑阁Image title



更新:2017-07-03

收藏

2人已收藏

Sophia的玲珑阁

从创业公司到大厂,分享实用的互联网设计技巧和职场经验。

  • 142

    作品

  • 389

    粉丝

  • 7

    关注

  • 作为设计师,我是如何一步步找到业务增量的
  • 情绪是魔鬼,但要原谅自己
  • 2020年打工人4条总结出炉
  • 提升屏效可实施性最强的4大方法
相关标签
设计经验uiUDC

    猜你喜欢

      2017-07-03 原创文章 经验/观点 举报 749 2 1 0

      通过Framer来谈谈设计师学习代码二三事

      0.0°

      你确定要举报通过Framer来谈谈设计师学习代码二三事

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2017年07月03日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      1
      2
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录