与 Una Kravets 的访谈

Una Kravets 是一位前端 开发人员、作家 和 演讲者，在 IBM Design 的云平台团队工作。 她与人合办了一个名为 Toolsday 的播客，热爱旅行，偶尔还会做 书法。 您可以在互联网上找到她 @una。

我有幸在一个阳光明媚的星期天与 Una Kravets 进行了交谈，我非常兴奋地做这件事，因为我是她作品的超级粉丝。 如果您不太熟悉她的工作，以下是一些很棒的链接供您查看

http://alistapart.com/article/finessing-fecolormatrix
http://una.im/CSSgram
http://una.im/svg-icons
http://una.im/classy-css
http://una.im/bokeh
http://una.im/3d-effect
http://una.im/bokeh
https://github.com/una/personal-goals

以下是与 Una 的访谈内容。 我从她那里学到了很多东西，并希望在这里分享这些智慧。

---

Sarah Drasner： 当我想到你的时候，我会想到一个给 CSS 社区带来新鲜空气的人。 你似乎总是带着支持你调查的良好数据来问：“等等，我们是不是把孩子和洗澡水一起倒掉了？” 您发布了一系列材料——从 CSS 滤镜等内容的创造性实现，到“嘿，让我们对什么是它以及如何使用它保持理性”。 这真的太棒了。

Una Kravets： 我很高兴你注意到了这一点。 在我心中，我只是想说“随便吧，让我们创造性地设计网页。 让我们把它向前推进，其他事情以后再担心”。 但在我的脑海里，我已经学会了控制这种想法，变得更加务实。

在工作中，我已经在组件库（用于 Watson 和 Bluemix）上工作了一年多了。 除了担心浏览器兼容性之外，组件库还带来了一个非常大的问题需要解决。 一方面，您可以创建一个完全语义化的系统，使用 mixin 和 extend，这将产生最小的文件大小和漂亮的代码，但也包含很多假设。 因此，您不能说，“好吧，每个人都会使用 Sass”，因为并非每个人都可能熟悉它。 我们了解到，我们需要退一步，考虑一下用户——为那些可能没有 Sass 经验的人提供 CSS，对于那些有经验的人，我们需要考虑如何构建一个易于上手的系统。

SD： 是的，很多非常优秀的服务器端工程师使用这些类型的组件库，但还有代码库的维护。 这些是不同的角色，但在某些时候，您必须决定初级工程师是否无法参与维护部分。 如果您要以某种方式编写 mixin 和 extend，您会将工作稍微隔离到 Sass 专家以及那些对使用标记更舒适的人。

UK： 我认为这一点很重要。 此外，很多时候人们在开发领域听到这些新术语，就会有点担心，因为人们谈论它们越多，就越像是每个人都在使用它们，而你落后了。 但实际上，人们只是在谈论新事物，因为它们是新的。 这种区分很有意义，因为它让你意识到，不必立即掌握所有答案，可以花点时间去理解人们为什么要使用某样东西，而不是因为它是“新热点”就跳进去。

SD： 是的，我知道这是一个很好的做法。 当您看到所有新事物出现时，会有一些焦虑。 您必须花时间审查技术，然后才能冒险将其投入生产并无限期地维护它。

您最近一直在做很多工程工作，但似乎以前您做了很多设计。 您是否已经放弃了设计？

UK： 我一直很难回答这个问题——我仍然在设计，虽然没有以前那么多，而且不是传统意义上的视觉设计。 我几乎只通过代码进行设计，因为我发现直接在浏览器中进行设计要快得多，如果没必要，我不喜欢在额外的步骤上浪费时间。 有时我会先做一个草图，然后在屏幕上完成剩下的部分。

SD： 我个人很喜欢你在 Twitter 上发布的书法作品。 你最近做的那个很不错的是哪一个？ 那是在你学习 React 的时候。

在 React 中分享方法及其范围 #codecalligraphy #reactjs pic.twitter.com/dt9A8xK5Di

— Una 🇺🇦 (@Una) 2015 年 12 月 27 日

UK： 哦，我做了一个关于 props 以及它们如何在项目之间传递的 React 作品，最近还做了一个关于 ES2015 字符串模板的作品，以及另一个关于默认参数的作品。 我在一年前真的很想学习书法，所以我在当地一家艺术画廊参加了一个书法课，结果是罗马书法课。 我认为这很酷，但这不是我想学习的东西，所以我从 SkillShare 和 YouTube 上学习了其他东西。

🖋 #CodeCalligraphy: ES2015 默认参数 💌https://#/PAuqgZb98L

另一个我从 Sass 中认识的便利功能 😛 pic.twitter.com/2bl88Y7Xv2

— Una 🇺🇦 (@Una) 2016 年 2 月 13 日

SD： 将两者结合起来很好，因为一些概念可能很枯燥。 制作技术图表很困难，因为找到可视化概念的最佳方式很困难。 一旦你做到了，我认为它不仅对你来说会更清晰，对于其他人来说也会更容易理解。 你觉得这个过程有启发吗？

UK： 当然。 很难找到以高级方式解释复杂主题的文章。

SD： 我最喜欢你的一篇文章是关于 Sass extend 的那篇。

UK： 你喜欢吗？ 我知道发布它会让一些人对我不满，因为很多开发人员对 extend 以及如何构建 CSS 有自己的意见。 我记得是星期五发布的，当时心想：“嗯，这绝对是发布这篇文章的最佳时间”，[笑声]，然后我准备出去，同时等待着愤怒的评论涌入。

SD： 我认为这篇文章很棒，因为之前有一些文章特别批评使用 extend，因此很多人完全放弃了它们。

UK： 哦，是的。

SD： 因此，当您为它们辩护时，它重新审视了这一前提，说实话，这是我一直以来的想法。

UK： extend 是有其原因的。 在我即将发布的一篇文章中，我谈论了 ES2015 类，以及它们在使用 class 构造函数中的 super() 来引入父类的 JavaScript 方法时如何类似于 Sass @extend。 然后继续讨论了另外 5 个可以很好地转换的概念。

编者注： Una 已经 发表了这篇文章。

SD： 这听起来像一篇很棒的文章。 我一定会读的。

UK： 太棒了！

SD： 是的，我的意思是，这是一个很好的观点。

您还在 IBM 工作吗？

UK： 是的！ 看到公司文化自从我加入以来发生了转变，真是太酷了。 特别是看到前端开发社区发展壮大并找到其在设计工作室中的位置，真是令人兴奋。

SD： 您是否觉得自己是推动这一想法的群体中的一员？

UK： 是的。 我以前在一家名为 Viget 的公司工作，我非常喜欢这家公司，前端开发人员会举行知识分享会议，在午餐时一起观看技术会议视频。 这是一个赶上进度和学习新事物的途径。 当我开始在 IBM 工作时，我真的很怀念这种知识分享，所以我想，为什么不把它变成现实呢？ 从 2014 年 10 月到现在，几乎每周我们都会邀请一位演讲者或者观看一个视频。 已经举办了 40 多场来自不同同事的独特演讲，其中大多数人以前从未进行过演讲。 它让人们有机会练习演讲、制作幻灯片和教学，同时也让其他人有机会学习。

SD： 嗯，这真酷。 这似乎也促进了那些可能偶然对某些事情感兴趣但没有学习更多途径的人的成长。

UK： 它让人们意识到他们可能甚至没有意识到存在的东西，以及在某个主题上向谁寻求更多信息。 我们已经举办过关于 React、Ember、性能监控、网页音频 API 和 SVG 动画的演讲。 我们已经举办过关于一切的演讲！ 这是一个人们可以借此机会深入研究他们感兴趣的主题的地方，并且作为补充，他们现在已经为城里的聚会准备了演示文稿！

SD： 哦，太棒了。 这是否意味着指导是您现在正在做的一部分？

UK： 在办公室里，我一直是 Sass 的首选人。 这已经持续了，我一直帮助不同的团队解答前端问题，并帮助设计师开始使用 GitHub。 不过，在工作之外，我会收到邮件。 人们会向我征求建议，我诚实地尽力尽快回复他们，因为我知道我以前也是那个向线上激励我的人发送邮件的女孩。 我会说：“我真的很喜欢你在这方面的作品。 我是学生。 你能给我一些建议吗？ 我应该读什么书？ 我应该看什么视频？” 我认为那些发送这些邮件并努力伸出援手的人将在未来取得成功，因为他们在付出额外的努力，并且让自己脱颖而出。

SD： 是的，我不知道你是否听说过最近的 Shop Talk Show 节目，其中 Chris [Coyier] 和 Dave [Rupert] 回顾了旧问题，其中一个问题是：“我如何参与其中？ 我如何了解更多关于网页社区的信息？” 这个问题来自现在已经是网页社区成员的人。

UK: 我听到他在读它。他们说，“我想他现在没事了。”[两人都笑了]。

SD: 我记得，即使当他们说出这个名字时，我也在想，等等，我知道这个名字。所以，是的，我认为这是真的。我认为，尤其是在这个社区里，热情是成功的一半。

现在，由于你如此活跃，人们可能经常要求你发言。你就像火箭一样蹿升了。

UK: 这正是它所代表的。这就像过山车一样，我不想停下来，因为我有很多想法，而且人们真的会听。这让我可以将我周末的时间花在网上，思考如何让浏览器设计变得更好。

SD: 绝对！这也引出了我的下一个问题：你如何找到时间平衡你的工作生活、热情的网络生活以及所有会议。你经常为了参加会议而旅行。这与你的工作和整体平衡是如何协调的？

UK: 哦，姑娘[笑]，你必须学会挤时间。这很难。并不容易。

我认为去年我花了更多时间专注于我的职业生涯，确保自己做出了好的工作，然后回家并确保我在工作之外也做出了好的工作。听起来很糟糕，但我不能太过于批评它，因为我认为每个人都需要这种专注于构建事物，直到他们意识到“好吧，也许你需要退一步了”的经验。

我经常使用清单来确保我做到了所有我想做的事情。如果我不写下来，我可能会忘记。事实上，我把它们放在一个 GitHub 仓库里，非常公开。

SD: 是的，是的，我查看过那里。我也做类似的事情，但我的方法是模拟的，而不是公开的。你以这种方式使用 GitHub 作为工具真是太棒了。

UK: 没错。我的意思是，无论对你来说什么最方便。对我来说，终端就是我的家。我只是在终端里整理好一切，然后发布到网上。但把事情写下来非常重要，这是我确保自己能抽出时间做这些事情的方法。今年我花了更多时间专注于平衡：如果我花了 X 时间工作，我必须用 X 时间来平衡在奥斯汀闲逛，这是一个非常酷的城市，或者做一些与代码无关的事情。我在电脑屏幕之外获得了许多演讲灵感，所以优先考虑抽出一些时间远离电脑屏幕是件好事。

SD: 太棒了。当你说你现在只在浏览器中设计时，我想你仍然在寻找能够激励你的东西，只是改变了输出方式。

你如何找到灵感？你是否发现，你的灵感来源对于这种输出方式是相同的？你仍然在看 Dribbble 和 CodePen 吗？你做了些什么才能开始着手这些事情？

UK: 我喜欢从互联网和电脑屏幕之外寻找灵感。在艺术方面，我真的喜欢那些有粗犷边缘，而不是 Web 2.0 一切都很完美和扁平化的审美的东西，我认为这种审美仍然主导着互联网。我尝试做的就是让事物具有一点纹理，而这正是你在自然界中所看到的东西。

它是自然的。自然界中没有完美的东西。自然界中没有扁平的东西。所以，我想这就是我最近的灵感来源。

SD: 这可能对你使用 散景 过滤器以及你其他 Sass 实验有很大的帮助。

UK: 是的，这些东西就像做草图一样。我把它们扔进浏览器，看看它们在那里如何运作。我做了这个旅行网站。它位于 travels.surge.sh，它融合了我旅行写作、我在当地拍摄的照片以及 CSS 实验。我实际上是在浏览器中将它们组合在一起，然后对它们应用滤镜和混合模式，从而设计了其中的每一个布局。

SD: 我甚至不知道这个网站！你如何抽出时间做所有这些？

UK: 好吧，我创建了这个网站，用于测试我在演讲中提到的几个概念。这是我的示例网站。我最喜欢的一个是 柏林 的那个。如果你调整它的大小，你可以看到不同的混合模式是如何交互的。这正是我真正喜欢它们的方面。你永远无法真正知道，当用户交互发挥作用时，你会得到什么。

我理解，每一次不同的艺术运动都是对之前运动的一种反应——扁平化设计是对 CSS3 以及浏览器允许我们使用的功能的一种反应。浏览器在图形渲染方面越来越好了，所以我认为我们将看到回归独特纹理和表现力布局的转变，这就是我为什么喜欢说 #ArtTheWeb。

SD: 这是一个很棒的号召和对未来的展望。能够推动边界，看看你能走多远，然后稍微退回来，这真是太棒了。

UK: 我完全同意你的观点。我认为浏览器将会做到这一点，而且你必须推动边界才能让它们做到这一点。我最喜欢的例子之一是 Lea Verou 一直在推动圆锥形渐变，这也是她在会议上谈论的内容。她呼吁观众采取行动，让浏览器厂商知道这项功能的需求量很大。浏览器厂商想要实施你将使用的功能，所以你必须尝试使用它们，并给出用例示例，以实现该功能的实施。

SD: 是的，我认为 Sara Soueidan 对 clip-path 做了同样的事情。她发出了一封号召，它为微软 Edge 带来了大量的投票，现在他们将发布这项功能。我认为，我们对这些事情的控制权比我们想象的要多。

所以，最后一个问题，关于真正让我感兴趣的事情。我看到了你关于 3D 眼镜的 文章。你能告诉我们关于整个过程，以及它是如何进行的吗？

UK: 我还没有在演讲中介绍过它！我计划在即将举行的会议上展示它。你指的是我写的一篇关于立体图像，或者说红蓝 3D 效果的博文。基本上，你可以使用混合暗化和亮化混合模式来对复制的图像进行颜色处理，然后将它们分层以相互抵消，并在图像的两侧创建红色和蓝色色调的阴影。然后，你可以使用变换将图像以模仿眼睛距离的方式向后推，就像你为了帮助 3D 图像效果而做的那样。这绝对取决于屏幕，所以请记住这一点，但是如果你戴上 3D 眼镜（传统的红色和蓝色塑料眼镜），你就能看到 3D 图像。然后，使用 CSS 动画，你就可以在你的浏览器中使用 Dev Tools 进行动画，如果你愿意的话。这就是我为什么喜欢在浏览器中设计的原因——它是一个非常棒的沙盒环境。我只是开始随意地进行这项工作，但它看起来很酷，所以让我们看看它会如何进行。我写了一个关于几种不同效果的博文系列。

SD: 我看过其中一些，真是太棒了。真是太激动了。我有点难过，因为我没有参加你的演讲，所以也许我可以看到它！期待着它，还有你正在创作的其他文章！感谢你抽出时间和我交谈。

UK: 当然！我很乐意。