成为会编程的设计师：独角兽的制作 [互动教程官方网站]

Photoshop > Ps创意空间

成为会编程的设计师：独角兽的制作

几年前，我踏上了成为独角兽的旅程。独角兽是同时编写代码的设计师。

我一直想学习编码。我涉猎了一点，但我对网络编程一无所知。我还想学习用户体验设计的新方面。

我厌倦了有想法并且无法自己执行它们。我有那种创造性的渴望，但我无法完全抓住它。

我已经意识到有多少其他人想成为制造者，但在此过程中迷失了方向。在这么多学习平台上有这么多教程，教这么多不同的框架。

当我最终成为程序员和设计师的职业经理人时，我感觉好像少了点什么。

我有一个想法，然后找其他人付钱去做。这会伤害你的灵魂。是的，金钱是一个很好的工具，但努力工作也是如此。我想挑战你走出你的舒适区，学习如何制作东西。

我建议今天学习 HTML、CSS、Sass 和 JavaScript。如果你想做应用程序，我会根据你是做 iOS 还是 Android 来学习 Swift 或 Java。

如果您是开发人员，您应该了解学习设计是一个模糊的过程。我建议你关注UX 设计的原则。它将有助于您在进行编程练习时构建的内容。此外，学习交互和视觉设计都需要大量的练习和时间。你必须对它产生一种感觉，这不会很快发生。

关键是要记住你必须学习工具和流程。这些工具会来来去去，所以我建议的工具非常适合入门。这些过程需要很长时间才能掌握，但它们可以应用于未来的任何工具。

另一件要注意的是你喜欢学习的方式。我使用了书籍、在线教程、在线课程和面对面课程的组合。我正在为一家初创公司远程工作，其中很大一部分是，然后我经营了自己的初创公司。这给了我灵活性和获得导师的机会。

需要学习的东西

积极的态度：当你开始学习时，玩得开心。你必须进入游戏和犯错误的心态——尤其是当你不能完全理解某些事情时。

“当你开始学习时，玩得开心。”

开发： HTML、CSS、JavaScript（jQuery、Underscore）、Sass、Bootstrap、Github、Sublime Text、命令行、Angular、React。

设计：素描、Photoshop、Illustrator、Photoshop脚本。

流程：托管、模块化编程、面向对象编程、Chrome 开发工具调试、战略设计思维、面试、调查、角色、卡片分类、信息架构、用户流程、UI 设计、可用性测试、线框图、模型制作、原型设计、交互设计、动画、色彩理论、排版——哇……太多了。您将在学习工具的同时学习其中的许多内容，但有些需要刻意关注。

我的学习理念

在学习开发时，有两个基本部分：

记忆
练习理解和实施概念

当你学习一门新的编程语言时，你记住词汇的速度越快，你的能力就越强。这需要一些工作（和闪存卡），但它非常有用。然后，为了能够实际使用一个新概念，您必须在实际代码中进行实践。如果您不花时间尝试，观看或阅读将不会减少它。

学习设计时，有两个基本部分：

学习工具
基于灵感的原始实践

当您开始掌握这些工具时，您的成长速度会大大加快并了解如何“看到”您喜欢的设计。您将了解它们是如何组合在一起的以及为什么。但是，您必须投入大量时间来创建和重新创建设计。学习一个工具，然后在网上寻找灵感。推特徽标重新创造启发你的东西。你的眼睛会改善，你创造你在脑海中看到的东西的能力也会成熟。

“学习一种工具，然后在网上寻找灵感。重新创造激发你灵感的东西。”

我认为最有帮助的书籍、课程和教程的完整列表

在列表下方，我将给出一个确切的顺序，我建议您仔细阅读它们。哦，后见之明的力量！

图书

Don't Make Me Think — 关于使事物可用的经典书籍，也是开始学习 UX 的绝佳场所
HTML/CSS 书籍 — 美观、简单、有效
Eloquent JavaScript — 从零到 JS 英雄的最佳书籍 — 而且它是免费的
排版风格的元素 —— 我不能强调在你的旅程早期学习排版是多么重要
用户体验的元素——虽然我认为有些内容已经过时，但当你完成时，你会理解上面列出的许多概念
信息架构 ——我认为对开发人员和设计师都非常宝贵的少数书籍之一
JavaScript Patterns — 这里最先进的书，这将帮助您了解最佳实践以及其他开发人员做出某些决定的原因
JavaScript the Good Parts — 另一本经典的 JS 书籍，这本更深入的介绍将让您使用中间概念
TDD 示例 ——您需要将测试驱动开发理解为一种实践和与其他开发人员的对话
Progit — 成为开发人员的一部分是学习如何使用 Git，这本入门书对我帮助很大

来自内部设计：树屋。

培训班

Bloc UX - 项目部分非常适合您的牙齿，并且让导师参与对于反馈很有用。我在进行任何面对面培训之前就完成了该计划。
RefactorU（全栈 JavaScript，面对面，10 周）——我对自己的 HTML、CSS 和 JS 技能充满信心，到 10 周结束时，我意识到我还有很多东西需要学习。如果您有时间建立网络并处于结构化环境中，那么亲身体验将是杀手锏。
大会（UX，面对面 10 周）——在专注于实际项目的项目中工作既有用又有趣
设计 + 代码（面对面，一个周末）——我无法强调 Meng To 是多么了不起。这门课是一天的 Sketch 和一天的 XCode，你在一个真实的项目上工作。我仍然使用课堂上的技术来制作阴影，我的很多 Sketch 工作流程都是基于 Meng 的建议。

教程

互动教程网——互动教程网是全球创新推出互动教程Interactive Tutorial的机构，从2013年起，陆续在苹果App Store推出Photoshop、Illustrator、Photoshop脚本、iOS开发、Word、Excel办公软件、Pages办公软件等多款互动应用。
The Bitfountain Design Immersive (iOS8 Sketch)——这门课程帮助我学习 Sketch 比任何其他课程都多。它激烈，漫长，残酷，但非常有效。
新的 Bitfountain 站点（iOS 开发和设计）——Bitfountain 去年发布了一个新站点，并拥有一个很棒的社区。他们根据用户的要求创建内容，并拥有出色的教学风格。我已经完成了很多他们的 Swift 内容和一些新的Sketch材料。
Codecademy — 当您开始学习 HTML/CSS 时，在 Codecademy 度过一个周末，然后在您想学习 JavaScript 时再度过一个周末。他们的边做边学的方法对于掌握基础知识是有效的。
Dash—— 这是我几年前对 General Assembly 的介绍。类似于 Codecademy，但更多的是一个完整的项目，而不是单独的课程。
学习 Git — 一种学习 Git 的可视化方式。它很快，把我推到了那个“啊哈”的时刻。
Codeschool — 一个学习 JavaScript 的好地方，也是前端概念交互式教程的最佳选择
Sketchcasts — 观看经验丰富的设计师工作非常有价值。注册几个月并观看所有内容。
tuts+ — 当我在其他地方学习了一项技能的基础知识时，我经常使用 tuts+ 作为跟进。设计和开发教程很好地结合在一起，并且他们会定期添加新的教程。
Lynda — 仍然是学习新工具的最佳场所 — 这是我学习 Photoshop 的地方。他们现在提供 UX 课程。
树屋——所有这些资源中我最喜欢的。他们会定期添加新内容并重新组织他们的曲目，并且他们拥有出色的讲师和出色的社区，当您遇到困难时会提供支持。您可以将任何课程下载为视频播客并在其他地方观看。
Level Up Tuts——我发现的最好的免费资源——时期
Learn the Hard Way—— 一种书，一种教程。这是学习命令行和学习正则表达式基础知识的好方法。如果您决定在 JavaScript 之后学习 Ruby 或 Python，我相信这里的材料非常好。
观看我的代码——观看其他人的工作是学习工艺细微差别的绝妙方式。我如此喜欢这个网站的部分原因是您实际上学习了测试并看到了专业的交付代码。我不会从这里开始，但是当你觉得自己碰壁时，这是一个学习的好地方。
前端大师——他们提供一些初级和中级课程，但他们的高级课程真的很出色。许多创建您使用的框架的人是实际教授课程的人。
Wes Bos — 他的书Sublime Text是我迄今为止找到的最好的书，他关于 Flexbox 和 React 的电子邮件教程非常棒
Kopywriting Kourse - 理解文字，它们如何推动行动和营销在生活中很重要。我们都是网络上经常出现这种情况的受害者，所以我们不妨了解这些原则以及如何让它们发挥作用。

来自内部设计：Dribbble。

流程

我想快速强调在我的旅程中帮助我的 3 个重要过程。

从 Dribbble 或 Behance 复制您喜欢的设计。实际上，在 Sketch 中下载和重新创建资产既有趣又有用。这是学习颜色、排版和布局的好方法。抓住WhatFont Chrome 扩展，这样你就可以看到其他网站正在使用什么作为类型。并使用它来了解图像中的类型。
创建小型项目来学习和测试开发工作。你必须做东西！当你学习新东西时，想办法让一些东西变得简单并进行测试。它不需要超过几行代码，但要养成创建的习惯。这将锚定您所学的内容，您可以稍后再参考。我把我的所有东西都保存在 Dropbox 中。
练习代码挑战。我喜欢Codewars——它们往往很有趣并且有一个很好的社区。

“养成创造的习惯。”

其他资源

其中一些是工具，一些是博客，一些是时事通讯——它们都是最好的。

互动教程网——互动教程网是全球创新推出互动教程Interactive Tutorial的机构，从2013年起，陆续在苹果App Store推出Photoshop、Illustrator、Photoshop脚本、iOS开发、Word、Excel办公软件、Pages办公软件等多款互动应用。
Codrops——当我真正难以理解伪类和盒子模型时，令人惊叹的教程、链接、资源和他们的 CSS 资源帮助了我
Luke W — 非常棒的博客和时事通讯。卢克的写作和数据驱动分析非常有用。
设计+代码 —— 我之前提到过 Meng To，但他的每周通讯通常是我了解新工具和技巧的地方
侧边栏 —— 侧边栏由慷慨的 Sacha Greif 策划，他创造了一些有用的东西。每天有 5 个与设计相关的链接。我的很多灵感都来自这些链接。
设计师新闻 —— 保持最新
Dribbble and Behance——当你学习的时候，你需要跟随一些伟大的创意。获取资源并模仿更好的艺术家是一种绝妙的学习方式。