最近思考,一个前端怎么去理解设计的思维。平时对设计比较感兴趣,自己是前端,当然现在有很多前端和设计结合的岗位,逼入某某大公司有专门的 UI 设计师,动画设计师,都要求会 JavaScript。写好自己的 css 库和 JavaScript 可以直接拿给研发使用。
那么问题来了? 一个前端怎么去学习设计啦?从实用的角度去看
1
pandaaa OP 前端自己可以做很多动画,但是很多设计图考虑不到,JavaScript 或者 css 的实现程度。如果一个前端工程师学习设计,我想很多地方能考虑到代码的实现难易程度和具体的方案,让设计更加开发友好
|
2
iq72 2018-03-29 09:58:34 +08:00 via Android 1
和想学前端的设计师合作,建个个 atomic design 的库之类的
|
3
shimomiaizo 2018-03-29 10:02:28 +08:00 3
设计关注的更多是一个相对 macro 的层面,也就是我不在意一个 component 是怎么写的,甚至在一定程度上我不关心一个 component 能不能被利用,而是更关心一个页面或者 screen 的 layout 是不是平衡、和谐,形成一个 user flow 的 page 和 page 之间的关系是否够强,再进一步,一个系统内部设计风格和语言是否和谐。
这就牵扯到一系列的 - 色彩 - accent color - neutral tone - state colors - 形状 - component - margin, padding - 文字 - 字体使用 - 行距、字号系统 - 字重 - serif? sans serif? - 字体的情感和品牌以及需要的契合 其他的强装饰性元素 - Illustration - Artistic styles ( e.g. 你说到的动画效果具体使用什么样的艺术风格更和品牌贴合?更适合项目的 nature ?等等) 不同类型项目的设计,以上这些东西的占比会不同 不要希望一个 css 能适配所有项目,这个是可以肯定的 我不是设计大牛 只是一个在摸索前端的设计狗 一起进步 如果你想要看一些比较完整、完成度高的设计,可以上 dribbble。不过,请挑选是真正被用于项目的设计,而不要看飞机稿。 最后,动画在我自己的工作这边几乎不需要被考虑,但是如果你想了解动效设计(这的确是非常大公司向的专门技术),可以先从了解动效的基本形式开始,我记得网上有一些很好的概括性 gif。 |
4
shimomiaizo 2018-03-29 10:03:28 +08:00
天,这回复怎么把我的 list 搞成了这样
上一条回复的 list 里,色彩、形状、文字、其他的强装饰性元素 这四个是四个大类 其他的是四大类下的小类 |
5
shimomiaizo 2018-03-29 10:05:07 +08:00 1
仔细想想,会 JS 对于设计师真的是个大的帮助,原因在于懂了 JS 能真正帮助设计师从动态和交互的角度理解设计、从整个系统和使用的角度去看设计,而不是仅仅停留在化静态 screen、依赖于 prototyping tools 的层面(我目前就卡在这里了,哭哭
|
6
pandaaa OP @shimomiaizo 你是设计了?
|
7
pandaaa OP @shimomiaizo 感谢大佬回复这么多,有收获嘿嘿
|
9
shimomiaizo 2018-03-29 10:10:26 +08:00
@iq72 有点意思,这具体怎么个操作?是做一个自己的 design language + animation + component lib 这样的感觉?( design language 我觉得还没到这个程度吧,但 anim + comp lib 可以有
|
10
shimomiaizo 2018-03-29 10:11:19 +08:00
@pandaaa 嗯 设计狗 最近因为一个新项目和公司的资深前端交流很多 然后自己的 side job 在搞 VUE 教程的翻译 必须得学前端了 不然到死都干不到公司给买养老保险的工作了
|
11
pandaaa OP @shimomiaizo 嘿嘿 vue 翻译,大佬你好。
|
12
Microi 2018-03-29 10:19:22 +08:00
我个人看法,学得精比懂得多更重要,直白一点说,前端对于设计有深入的认知(反过来一样)是非必要的。
|
13
murmur 2018-03-29 10:20:21 +08:00
我感觉设计是学不来的 真心需要美学天赋 能模仿或者能抄和有原创设计完全是两个概念
|
15
shimomiaizo 2018-03-29 11:40:14 +08:00
@murmur 这是没错 但培养审美意识 知道什么比什么好 为什么好 以及为什么需要好 是很重要的 这些能成就一个优秀的前端 正如一个懂一些前端的设计师会有长足的进步
|
16
shimomiaizo 2018-03-29 11:41:08 +08:00
@pandaaa 见笑了 只是自己有一丝丝前端底子 然后有一点英语优势 所以想着不如借翻译的机会自己也学一遍 毕竟翻译的话没有跳过任何内容的可能
|
17
leer561 2018-03-29 11:45:21 +08:00
写给大家看的设计书
|
18
murmur 2018-03-29 13:43:45 +08:00
@shimomiaizo 我觉得程序员做久了审美会扭曲,所以有美工还是直接相信或者甩锅给美工比较好
如果要做独立开发者那就没办法了 |
19
shimomiaizo 2018-03-29 16:55:26 +08:00
|
20
fanhaipeng0403 2018-03-29 18:14:26 +08:00
从抄页面开始
|
21
iq72 2018-03-29 20:43:18 +08:00
@pandaaa @shimomiaizo 我也就是一个提议,自己也咩有试过;只是觉得思路挺好的,打这样一个系统也需要两方面的知识;而且 design system 现在也算是比较火的一个话题吧
这是相应的网址 http://atomicdesign.bradfrost.com/table-of-contents/ |