ui设计师学习多久_如何学习ui设计，我作为数字产品设计师的前两年教给我的是什么

ui设计师学习多久

重点 (Top highlight)

As a Digital Product Designer it is one of your main goals to design valuable, ease-to-use and well-crafted UIs. Two years ago, I started my journey with no formal design background (Computer Science & Media). This post summarizes some of the insights I learned along the way as well as advice and resources, that would have been helpful at the start.

作为数字产品设计师，设计有价值，易于使用和精心设计的UI是您的主要目标之一。 两年前，我开始没有正式设计背景(计算机科学与媒体)的旅程。 这篇文章总结了我在此过程中所学到的一些见识以及建议和资源，这些一开始会很有帮助。

📐钉住图形设计的基础知识 (📐 Nail the basics of graphic design ‍‍‍)

Every discipline has its abstract concepts that are (mostly) easy to understand but hard to actively create in the beginning. For graphic design, there are fundamental concepts like balance, depth, spacing, layout, visual hierarchy, color, grids or typography. There is immense value in spending time to internalize those concepts as they are an essential part of every thoughtfully designed UI.

每门学科都有其抽象概念，这些概念(大多)易于理解，但一开始很难积极创建。 对于图形设计，有一些基本概念，例如平衡，深度，间距，布局，视觉层次，颜色，网格或版式。 花费时间内部化这些概念具有极大的价值，因为它们是每个经过精心设计的UI的重要组成部分。

For me, learning about those design concepts felt impractical at first. It requires experience to transform these abstract concepts into a concrete design. But as you begin to grow as a designer, these basic concepts will pop up more and more and you will find yourself actively looking for them. So, while you do UI design work, try to keep the basic concepts in mind and use them as a tool to evaluate your design. Thereby you can internalize the concepts and learn how to establish them on purpose.

对我而言，首先了解这些设计概念是不切实际的。 将这些抽象概念转换为具体设计需要经验。 但是随着您开始成长为设计师，这些基本概念会越来越多地出现，您会发现自己正在积极寻找它们。 因此，在进行UI设计工作时，请尽量牢记基本概念，并将其用作评估设计的工具。 因此，您可以内化概念并学习如何有目的地建立它们。

There is one skill in UI & graphic design fundamentals that stands out to me: typography. Most web-based applications primarily consist of type. It’s type arranged in a certain way to make the desired functionality accessible. If you want to master UI Design, you have to learn how to use type effectively. Take a look at the products and services you use each day. Most likely, they are all examples of a great use of type. And because type is everywhere, there are learning opportunities all around you: you can pay close attention when creating documents, writing emails or building slides. Learning how to use type effectively is a good starting point to master all the other fundamental concepts of graphic design mentioned above.

UI和图形设计基础知识中的一项技能对我很突出：排版。 大多数基于Web的应用程序主要由类型组成。 它以某种方式排列以使所需功能可访问。 如果您想精通UI Design，则必须学习如何有效使用type 。 查看您每天使用的产品和服务。 它们很可能都是类型大量使用的示例。 而且由于类型无处不在，所以您周围都有学习的机会：创建文档，编写电子邮件或制作幻灯片时，您需要密切注意。 学习如何有效使用类型是掌握上述图形设计的所有其他基本概念的一个很好的起点。

The most practical resource I’ve found to learn more about the basic concepts of UI Design (including graphic design) is the book Refactoring UI by Adam Wathan & Steve Schoger. Read it. Read it again. Maybe even read it a third time. In the book, they cover all the most important basics with concrete examples.

我发现更多地了解UI设计(包括图形设计)的基本概念，最实用的资源是本书 重构UI 由 亚当Wathan 与 史蒂夫Schoger 。 阅读。 再读一遍。 甚至第三次阅读。 在本书中，它们以具体示例涵盖了所有最重要的基础。

🔎消费大量的良好设计并对其进行逆向工程 (🔎 Consume and reverse-engineer a ton of good design)

In order to make delicious food, you must eat delicious food. The quality of ingredients is important but you need to develop a palate capable of discerning good and bad. Without good taste, you can’t make good food. If your sense of taste is lower than that of the customers, how will you impress them? ― Jiro in Jiro Dreams of Sushi

为了制作美味的食物，您必须吃美味的食物。 成分的质量很重要，但是您需要开发一种能够分辨好坏的上颚。 没有好味道，就不会做饭。 如果您的品味低于顾客，您会如何打动他们？ ― 次郎在次郎的寿司梦

Commercial break: Watch Jiro Dreams of Sushi. Jiro Ono is quite an interesting character.

商业休息：观看 Jiro Dreams of Sushi 。 小野次郎是一个很有趣的角色。

When I started, I tried to reinvent the wheel with every UI I built. It is a pattern I recognize in a lot of people who start doing UI design work. Breakthrough ideas do not come from not being inspired by other people’s work. There is a ton of good design out there and there is a lot to learn from it. Look at functional as well as perceptual/visual patterns of great designers. That’s where your creative work begins. And as time passes by, you will start to actively create your own character and style, which will inevitably be a mixture of the designs you’ve consumed.

当我开始时，我尝试用我构建的每个UI重新发明轮子。 我在许多开始进行UI设计工作的人中都认识到这种模式。 突破性的想法并非来自别人工作的启发。 那里有很多优秀的设计，可以从中学到很多东西。 考察优秀设计师的功能以及感知/视觉模式。 这就是您的创意工作开始的地方。 随着时间的流逝，您将开始积极创建自己的角色和风格，这将不可避免地是您所使用的设计的混合体。

Moreover, consuming good design enables you to create your personal collection of sources to draw inspiration from. That is one of the attributes determining your seniority: if you have a collection of patterns in your head, it will speed up your design process and help you to make better-informed assumptions about what kind of solution might be effective.

此外，使用良好的设计可以使您创建自己的资源来源，以汲取灵感。 那是决定您的资历的属性之一：如果您头脑中有各种模式，它将加快您的设计过程，并帮助您就哪种解决方案可能有效做出更明智的假设。

Take a closer look at your favorite applications and try to figure out the reasons behind their decisions:

仔细研究您喜欢的应用程序，并尝试找出其决定背后的原因：

• What makes this UI stand out?
  是什么让这个用户界面脱颖而出？
• What makes their context unique (e.g. users or use case scenarios) and how does this influence their design?
  是什么使他们的上下文独特(例如，用户或用例场景)，这如何影响他们的设计？
• How do they create hierarchy, balance or depth?
  他们如何创建层次结构，平衡或深度？
• How do they use typography and color?
  他们如何使用排版和颜色？
• Which (un-)common patterns do they use?
  他们使用哪些(非)常见模式？
• Which trade-offs did they possibly make (regarding design/product/engineering)?
  他们可能会做出哪些权衡(关于设计/产品/工程)？

Some companies have publicly available Design Systems (e.g. Shopify’s Polaris). Well-crafted Design Systems are great sources of inspiration and learning. Download their Sketch libraries and study them. But be careful: don‘t worship your heroes too much. Apply their ideas to your context and come to your own solution.

一些公司拥有公开可用的设计系统(例如Shopify的Polaris )。 精心设计的设计系统是启发和学习的重要来源。 下载其素描库并进行研究。 但请注意：不要过于崇拜英雄。 将他们的想法应用到您的环境中，并得出自己的解决方案。

🔠学习编写简洁而有用的副本 (🔠 Learn to write concise and helpful copy)

Great UI designers are great communicators and an important part of communication is text. Words play an essential role for good UX. With the right microcopy, you not only make your system’s functionality more accessible but also make it feel more human. A few small words can decide on the success of a system.

优秀的UI设计师是出色的沟通者，而沟通的重要组成部分是文本。 文字对于良好的用户体验起着至关重要的作用。 使用正确的显微镜，您不仅可以使系统的功能更易于访问，还可以使系统更具人性化。 几句话可以决定系统的成功。

Some things I learned along the way:

一路上我学到了一些东西：

• Speak the language of your users (or aim to make it even easier) → Be careful with jargon and slang; do not assume, that everybody knows as much about the application as you do

  说出用户的语言(或使其变得更简单) →小心行话和语； 不要假设，每个人都像您一样了解应用程序

• Use active voice → Turn passive sentences like „This product was bought by you“ into active ones like „You bought this product“

  使用主动语态 →将诸如“您购买了该产品”之类的被动句子转换为诸如“您购买了此产品”之类的主动句

• Get rid of useless words → less is more; make your text easy to scan; every word/sentence in the application should have its purpose

  摆脱无用的言语 →少即是多； 使您的文字易于阅读； 应用程序中的每个单词/句子都应有其目的

• Be consistent → use a consistent vocabulary within your system and also in regard to other systems (due to Jakob‘s Law)

  保持一致 →在您的系统内以及与其他系统之间使用一致的词汇表(由于雅各布定律 )

• Express character → define upfront, what attributes best describe the kind of language you are trying to speak

  表达角色 →预先定义，哪些属性最能描述您想说的语言

• Benefits over features → Communicate the concrete benefit a feature provides to users, rather than describing what the feature does (e.g. label a button “Get free PDF” rather than “Download”)

  功能优势 →传达功能为用户提供的具体好处，而不是描述功能的作用(例如，将按钮标记为“获取免费PDF”而不是“下载”)

Moreover, test your copy. Create alternatives and talk to users. This is the fastest way to learn more about their mental models and get one step closer to words and sentences, that perform.

此外，测试您的副本。 创建替代方案并与用户交谈。 这是最快地了解他们的心理模型，并使所执行的单词和句子更近一步的最快方法。

Keep in mind: write for humans. Especially in corporate applications, I‘ve seen a lot of technical jargon which rather describes what the system does or how it is built rather than being helpful to users (implementation model vs. user model). Bad microcopy is not only one of the biggest issues in badly designed applications, but also one of the easiest and fastest things to fix. (At least to reach an acceptable level.)

请记住：为人类而写。 尤其是在公司应用程序中，我看到了很多技术术语，它们描述了系统的功能或系统的构建方式，而不是对用户有所帮助( 实现模型与用户模型 )。 不良的显微镜检查不仅是设计不良的应用程序中的最大问题之一，而且还是最容易修复的问题之一。 (至少达到可接受的水平。)

on从纸上开始，从文字开始 (📝 Start on paper, start with text)

I’ve wasted a lot of time getting into my screen design tools too early. The more projects I start, the more preparation I do on paper in the form of text and scribbles. It is the foundation for tight feedback loops and moving in the right direction as fast as possible.

我花了很多时间来太早进入我的屏幕设计工具。 我开始的项目越多，我在纸上做的文字和涂鸦形式的准备就越多。 它是紧密的反馈回路并尽可能快地朝正确方向移动的基础。

Before I explore visuals, I take out my textbook/text editor and make a simple list of things that come to my mind regarding the problem I have to solve. Some of my usual questions are:

在探索视觉效果之前，我先取出教科书/文本编辑器，然后简单列出了我要解决的问题。 我的一些常见问题是：

• What is the main purpose of this screen (flow)? What problem am I trying to solve? Is it an actual problem?
  此屏幕(流程)的主要目的是什么？ 我想解决什么问题？ 这是实际问题吗？
• What design goals & metrics am I aiming at? What do I want to achieve?
  我的目标是什么设计目标和指标？ 我想实现什么？
• What do I already know? What research is available?
  我已经知道了什么？ 有哪些研究可用？
• What information needs to be displayed? What’s most important? How does the information relate?
  需要显示什么信息？ 最重要的是什么？ 信息如何关联？
• What assumptions do I make? What could be a small but useful experiment to learn more?
  我要做出什么假设？ 要了解更多信息，可以做一个小型但有用的实验吗？
• Who knows more about the topic than I do? Who solved a similar problem before?
  谁比我更了解这个话题？ 谁以前解决过类似的问题？

Setting design goals at the beginning helps you to keep sanity and to define what’s important. Without setting goals for your UI (e.g. “creating a memorable experience rather than being efficient”) it is hard to evaluate, why your current approach is good or bad. Goals help you to stay objective, rather than drifting into subjective discussions. This is even more important when you ask your team for feedback later on in the process because they will know what you focused on and why.

在开始时设置设计目标可帮助您保持理智并定义重要的内容 。 如果不为您的UI设定目标(例如“创造令人难忘的体验而不是高效”)，就很难评估您当前的方法是好是坏。 目标可帮助您保持客观性，而不是进入主观讨论。 当您在稍后的过程中要求团队提供反馈时，这一点尤为重要，因为他们会知道您关注的重点以及原因。

Moreover, the activity of writing down those things already sparks some ideas about how to solve the problem or which next steps might be useful. It is a way of exploring directions without moving too deep.

此外，写下这些内容的活动已经引发了一些有关如何解决问题或下一步可能有用的想法。 这是一种探索方向而无需深入的方法。

UI Design is way more than just screen design & prototyping tools. Oftentimes, writing down some words on paper and doing analytical work is more important than exploring visuals.

UI设计不只是屏幕设计和原型制作工具。 通常，在纸上写下一些字词并进行分析工作比探索视觉效果更为重要。

🧱创建很多东西(即使不是UI工作) (🧱 Create a lot of stuff (even if it’s not UI work))

In the end, there is still nothing more valuable than getting your reps in. Especially in the beginning. Try to create visuals for as many projects as possible, put them out there and observe reactions.

最终，没有什么比让您的销售代表更有价值的了。尤其是在一开始的时候。 尝试为尽可能多的项目创建视觉效果，将其放置在那里并观察React。

To improve your visual game, you do not have to limit yourself to designing user interfaces. For my first job, I joined the founding team of an Innovation Hub right before their official launch. In the beginning, many tasks required visuals: logos, stickers or other marketing material. I did those side tasks as an instrument to improve my graphic design skills. And the more pure graphic design work I do, the better I become at UI Design due to the underlying design principles mentioned earlier.

为了改善视觉游戏，您不必局限于设计用户界面。 我的第一份工作是在创新中心正式成立之前就加入了创新中心的创始团队。 开始时，许多任务需要视觉效果：徽标，贴纸或其他营销材料。 我做这些附带任务是为了提高我的图形设计技能。 而且，由于前面提到的基本设计原则，我所做的图形设计工作越纯净，我在UI Design上的表现就越好。

Seek opportunities to do UI design or visual work. Volunteer on projects that seem fun. Build a logo for a fictional company. Help your friends with their side projects. Create posters for yourself. Create a lot of stuff with the intention to improve. Every project will help you to learn more about the basic concepts of graphic design, increase your repertoire of great inspiration, write better copy and improve your process.

寻求机会进行UI设计或视觉工作。 在看起来很有趣的项目上担任志愿者。 为一家虚构的公司制作徽标。 帮助您的朋友进行辅助项目。 为自己创建海报。 创造很多东西以求改进。 每个项目都将帮助您更多地了解图形设计的基本概念，增加灵感来源，编写更好的副本并改善流程。

Do not overthink it, just keep creating.

不要想太多，只要继续创造。

一些其他见解 (Some additional insights)

Be aware of the trade-offs you make: Whenever you add something, you also lose something (e.g. hierarchy, balance, flow).

注意您要进行的取舍 ：每当添加某些内容时，您也会丢失某些内容(例如，层次结构，平衡，流程)。

Everything is better with more white space: UI Design isn’t Tetris. Give UI elements room to breathe.

有了更多的空白，一切都会变得更好 ：UI设计不是俄罗斯方块。 给UI元素喘息的空间。

Do not use Lorem Ipsum: Just don’t. Use real data. If you have no real data, think about how you can get real data.

不要使用Lorem Ipsum ：请不要。 使用真实数据。 如果您没有真实数据，请考虑如何获取真实数据。

Think in patterns/systems: Whenever you build something, think about how you might reuse it in other contexts. It establishes consistency and increases development speed which leads to accelerated learning.

在模式/系统中思考 ：每当您构建某些东西时，请考虑如何在其他情况下重用它。 它建立一致性并提高开发速度，从而加快学习速度。

Learn how to use your tools: Spend some time to set shortcuts for your most-used features. Many people click features they use at least 100 times a day. Save yourself.

了解如何使用工具：花一些时间为最常用的功能设置快捷方式。 许多人每天点击至少使用100次的功能。 救你自己。

Create contrast by creating more than one solution: The key to finding good ideas is to know why they are better than alternatives. Always create alternative solutions and evaluate their strengths/weaknesses.

通过创建多个解决方案来形成对比 ：找到好主意的关键是要知道为什么它们比其他方法更好。 始终创建替代解决方案，并评估其优势/劣势。

Fully intuitive might not be the goal: It‘s hard to make something fully intuitive and it ultimately requires you to say „no“ to a lot of other things in the UI. Maybe it‘s enough if the user understands the interaction after clicking it for the first time? The book Intuitive Design goes into more detail on that topic.

完全直观可能不是目标 ：很难使某些内容完全直观，并且最终需要您对UI中的许多其他内容说“不”。 如果用户在第一次单击交互后理解了交互，就足够了吗？ 《 直观设计 》一书对此主题进行了更详细的介绍。

Learn to sell your design: Communication is everything. It is not enough to create awesome UIs, but it is necessary to learn how to communicate your design decisions to stakeholders. Book recommendation: Articulating Design Decisions by Tom Greever.

学习出售您的设计 ：沟通就是一切。 创建出色的UI是不够的，但是有必要学习如何将设计决策传达给利益相关者。 书籍推荐：Tom Greever的“阐明设计决策” 。

Look at your UIs the way your users will use them: Do not evaluate UIs on artboards in your screen design tool. For example, use plugins like Preview in browser to see how users will look at the UI. Keep the context of use in mind.

查看用户使用用户界面的方式 ：不要在屏幕设计工具中评估画板上的用户界面。 例如， 在浏览器中使用诸如Preview之类的插件来查看用户如何看待UI。 牢记使用的上下文。

Keep the team & the product in mind: The UI is just a piece of the big product puzzle. Maybe the full-blown UI is not a sensible next step but a stripped-down version of it. Leave your ego at the door. Do what’s right for the team and the product.

牢记团队和产品 ：UI只是大产品难题的一部分。 完善的UI也许不是明智的下一步，而是精简的版本。 把你的自我留在门口。 做适合团队和产品的事情。

This is an updated version of the article, which was first published on https://www.marcstauffer.xyz/.

这是该文章的更新版本，该文章最初在 https://www.marcstauffer.xyz/上 发布 。

翻译自: https://blog.prototypr.io/how-to-learn-ui-design-what-my-first-two-years-as-a-digital-product-designer-taught-me-af6f2e31fc98

ui设计师学习多久