左耳听风
陈皓
网名“左耳朵耗子”,资深技术专家
180931 人已学习
新⼈⾸单¥98
登录后,你可以任选6讲全文学习
课程目录
已完结/共 119 讲
左耳听风
15
15
1.0x
00:00/00:00
登录|注册

89 | 程序员练级攻略:UI/UX设计

UI Movement
Behance
Pttrns
One Page Love
Awwwards
CSS-Tricks
Medium
The Verge
Marvel团队博客
Smashing Magazine
UI设计灵感
Dribbble设计社区
创意设计作品
移动App设计模式
单页网页设计收集
设计评分网站
Great UI/UX Animations
动画设计指南和文章
品牌动画
Prototypr指南
12个基本原则
CodePen
Facebook设计资源
Salesforce设计系统
IBM设计语言
苹果设计规范
Material UI的工程实现
卡片设计
Build 2018上的分享
部分介绍
概念
设计收集
文章资源
设计收集
Web动画效果设计
其它公司
Material Design
Fluent Design System
Atomic design实践
布拉德·弗罗斯特的博客
布拉德·弗罗斯特的电子书、博客和实验室
HTML元素周期表
界面设计模式
认知与设计:理解UI设计准则
简约至上
拜师
设计工具
文章和资源
网站
Delivery
Develop
Define
Discover
一致性
排版
平衡
配色
小结
相关资源
动画效果设计
设计语言和设计系统
原子设计(Atomic Design)
图书和文章推荐
灵感来源
用户体验的4D步骤
原则和套路
程序员练级攻略:UI/UX设计

该思维导图由 AI 生成,仅供参考

你好,我是陈皓,网名左耳朵耗子。
上面的技术都讲完了,前端还有一个很重要的事就是设计。作为前端人员,我们有必要了解现在的一些知名且流行的设计语言或是一些设计规范或是设计方法,学习它们的设计思想和方法,有助于我们拓宽眼界、与时俱进。我并不觉得这些内容是设计师要学习的,如果你要成为一个前端程序员,那么学习这些设计上的东西可以让你有更好的成长空间。
对于学习设计的新手来说,推荐看看 7 steps to become a UI/UX designer ,这是一篇很不错的让新手入门的文章,非常具有指导性。首先,你得开始学习设计的一些原则和套路,如配色、平衡、排版、一致性等。还有用户体验的 4D 步骤——Discover、Define、Develop 和 Delivery。然后,开始到一些网站上找灵感。接下来,是到不同的网站上读各种文章和资源,开始学习使用设计工具,最后是找人拜师。此外,其中还链接了其它一些不错的文章、网站、博客和工具。我认为,这篇文章是一篇很不错的设计师从入门到精通的练级攻略。
虽然有这么一个速成的教程,但我觉得还是应该系统地学习一下,所以有了下面这些推荐。

图书和文章推荐

先推荐几本书。
Don’t Make Me Think ,这是我看的第一本和设计相关的书。这本书对我的影响也比较深远。这本书践行了自己的理论,整本书短小精悍,语言轻松诙谐,书中穿插大量色彩丰富的屏幕截图、趣味丛生的卡通插图以及包含大量信息的图表,使枯燥的设计原理变得平易近人。
Simple and Usable Web,Mobile,and Interaction Design ,中文版译名为《简约至上》。本书作者贾尔斯(Giles)有 20 多年交互式设计的探索与实践。提出了合理删除、分层组织、适时隐藏和巧妙转移这四个达成简约至上的终极策略,讲述了为什么应该站在主流用户一边,以及如何从他们的真实需求和期望出发,简化设计,提升易用性。
Designing with the Mind in Mind: Simple Guide to Understanding User Interface Design Rules ,中文版译名为《认知与设计:理解 UI 设计准则》。这本书语言清晰明了,将设计准则与其核心的认知学和感知科学高度统一起来,使得设计准则更容易在具体环境中得到应用。涵盖了交互计算机系统设计的方方面面,为交互系统设计提供了支持工程方法。不仅如此,这也是一本人类行为原理的入门书。
Designing Interfaces: Patterns for Effective Interaction Design ,中文版译名为《界面设计模式》。这本书开篇即总结了“与人有关”的各类问题,为读者提供了界面设计总体思路上的指引,帮助读者举一反三。然后,收集并分析了很多常用的界面设计模式,帮助读者理解在实现级别的各种常用解决方案,将它们灵活地运用到自己的设计中。
确认放弃笔记?
放弃后所记笔记将不保留。
新功能上线,你的历史笔记已初始化为私密笔记,是否一键批量公开?
批量公开的笔记不会为你同步至部落
公开
同步至部落
取消
完成
0/2000
荧光笔
直线
曲线
笔记
复制
AI
  • 深入了解
  • 翻译
    • 英语
    • 中文简体
    • 中文繁体
    • 法语
    • 德语
    • 日语
    • 韩语
    • 俄语
    • 西班牙语
    • 阿拉伯语
  • 解释
  • 总结

本文介绍了程序员练级攻略中UI/UX设计的重要性以及相关学习资源。作者强调了前端人员了解设计语言、规范和方法的重要性,并推荐了几本设计相关的书籍和优秀的设计文章。此外,介绍了原子设计方法论的重要性,以及与React.js框架的相关文章。在设计语言和设计系统方面,详细介绍了微软的流畅设计体系和Google的Material Design,并推荐了相关的学习资源和工程实现。文章还提到了苹果、IBM、Salesforce和Facebook等公司的设计语言和资源。总的来说,本文为程序员提供了全面的UI/UX设计学习攻略,涵盖了设计原则、方法论、设计语言和系统等方面的内容,为他们提供了丰富的学习资源和指导。文章内容丰富,涉及了动画效果设计和相关资源,为读者提供了全面的UI/UX设计学习指南,既有理论知识又有实践资源,适合程序员和设计师学习参考。

仅可试看部分内容,如需阅读全部内容,请付费购买文章所属专栏
《左耳听风》
新⼈⾸单¥98
立即购买
登录 后留言

全部留言(14)

  • 最新
  • 精选
  • manx00
    看了这么多的分享,突然想到一个问题,请问左耳朵耗子是怎样存档标记这些资料并在需要的时候信手拈来的?
    2018-08-07
    4
    32
  • 屈超
    大佬,求安卓和IOS的学习路线( •̀∀•́ )
    2018-08-07
    9
  • winterxxx
    哈喽耗子叔,今天在南京见到真人了哈哈
    2018-08-08
    5
  • 原理,思想,方法,基础,兴趣,英语,这是老师的学习利器!
    2019-01-12
    3
  • 靠人品去赢
    请问大家,有没有好的PS使用资料。
    2018-12-26
    1
  • lyjustforfun
    好多😭
    2018-10-08
    1
  • 沫沫(美丽人生)
    陈老师,UED这块有什么好的资料可以推荐吗?我们这块做的是一款2B的软件。多谢啦。
    2018-08-08
    1
  • ydp
    非常好,期待耗子老师在写一篇大数据相关的文章
    2018-08-07
    1
  • 小薛薛
    问个问题,学习很难直接光定向一门技术,可以2-3个切换进行学习吗? 例如 php技术也需要懂些js 数据库
    2018-08-07
    1
  • aoe
    这篇文章学会了,能让很多小姐姐眼前一亮
    2021-09-09
收起评论
显示
设置
留言
14
收藏
沉浸
阅读
分享
手机端
快捷键
回顶部