<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:atom="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/" version="2.0">
    <channel>
        
        <title>
            <![CDATA[ Yaxing Li - freeCodeCamp.org ]]>
        </title>
        <description>
            <![CDATA[ freeCodeCamp 是一个免费学习编程的开发者社区，涵盖 Python、HTML、CSS、React、Vue、BootStrap、JSON 教程等，还有活跃的技术论坛和丰富的社区活动，在你学习编程和找工作时为你提供建议和帮助。 ]]>
        </description>
        <link>https://www.freecodecamp.org/chinese/news/</link>
        <image>
            <url>https://cdn.freecodecamp.org/universal/favicons/favicon.png</url>
            <title>
                <![CDATA[ Yaxing Li - freeCodeCamp.org ]]>
            </title>
            <link>https://www.freecodecamp.org/chinese/news/</link>
        </image>
        <generator>Eleventy</generator>
        <lastBuildDate>Sun, 24 May 2026 19:37:52 +0000</lastBuildDate>
        <atom:link href="https://www.freecodecamp.org/chinese/news/author/yaxing/rss.xml" rel="self" type="application/rss+xml" />
        <ttl>60</ttl>
        
            <item>
                <title>
                    <![CDATA[ 统计学入门——数据科学领域最需要了解的统计学基础概念 ]]>
                </title>
                <description>
                    <![CDATA[ 你可能听说过，统计学是数据科学的入门门槛，是打开数据科学的钥匙。 可能你还听说过，想学数据科学，必须先学统计。 这时候你也许会迟疑，“我不是理工科背景，没有相关数学基础，我是不是要把统计学的相关知识学习完，才算入门了数据科学啊？“ 有些人会告诉你：“是的！你必须先学习统计学。” 而我的回答是：在开始数据科学之前，你不需要学习所有的统计学（尽管你需要掌握一些基础知识）。 你可以边学边做，而不是浪费时间在数据科学之前先修统计学（也就是说，随着你对数据科学知识的进一步了解，你同时可以学到更多的统计学概念）。 话虽如此，了解一些统计学基础知识，还是很有必要的。确实可以这样说，统计学是打开数据科学的钥匙，因为它会让你对数据更为敏感，知道如何处理它们。 在这篇文章中，我将介绍一些入门数据科学所必须的统计学概念。我将尽量用简单的语言来介绍，即使你不是理工科出身，我相信你听完以后也会十分兴奋，迫不及待想进入数据科学领域。让我们开始吧。 什么是统计学？ 根据经济学家和抽样方法先驱阿瑟-里昂-鲍利（Arthur Lyon Bowley）的说法，统计学是： > “对调查事件的量化描述，并将之与 ]]>
                </description>
                <link>https://www.freecodecamp.org/chinese/news/top-statistics-concepts-to-know-before-getting-into-data-science/</link>
                <guid isPermaLink="false">6375f35e7cdd940712f7c762</guid>
                
                    <category>
                        <![CDATA[ 统计数据 ]]>
                    </category>
                
                    <category>
                        <![CDATA[ 数据科学 ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Yaxing Li ]]>
                </dc:creator>
                <pubDate>Thu, 17 Nov 2022 08:45:59 +0000</pubDate>
                <media:content url="https://chinese.freecodecamp.org/news/content/images/2022/11/who-s-denilo-3ECPkzvwlBs-unsplash.jpeg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p data-test-label="translation-intro">
        <strong>原文：</strong> <a href="https://www.freecodecamp.org/news/top-statistics-concepts-to-know-before-getting-into-data-science/" target="_blank" rel="noopener noreferrer" data-test-label="original-article-link">Statistics for Beginners – Top Stats Concepts to Know Before Getting into Data Science</a>
      </p><!--kg-card-begin: markdown--><p>你可能听说过，统计学是数据科学的入门门槛，是打开数据科学的钥匙。</p>
<p>可能你还听说过，想学数据科学，必须先学统计。 这时候你也许会迟疑，“我不是理工科背景，没有相关数学基础，我是不是要把统计学的相关知识学习完，才算入门了数据科学啊？“ 有些人会告诉你：“是的！你必须先学习统计学。”</p>
<p>而我的回答是：在开始数据科学之前，你不需要学习所有的统计学（尽管你需要掌握一些基础知识）。</p>
<p>你可以边学边做，而不是浪费时间在数据科学之前先修统计学（也就是说，随着你对数据科学知识的进一步了解，你同时可以学到更多的统计学概念）。</p>
<p>话虽如此，了解一些统计学基础知识，还是很有必要的。确实可以这样说，统计学是打开数据科学的钥匙，因为它会让你对数据更为敏感，知道如何处理它们。</p>
<p>在这篇文章中，我将介绍一些入门数据科学所必须的统计学概念。我将尽量用简单的语言来介绍，即使你不是理工科出身，我相信你听完以后也会十分兴奋，迫不及待想进入数据科学领域。让我们开始吧。</p>
<h1 id="">什么是统计学？</h1>
<p>根据经济学家和抽样方法先驱阿瑟-里昂-鲍利（Arthur Lyon Bowley）的说法，统计学是：</p>
<blockquote>
<p>“对调查事件的量化描述，并将之与其他事件进行联系。”</p>
</blockquote>
<p>这句话的意思是，统计学帮助我们理解数据，并向他人传达数据得出的结果。</p>
<p>统计方法（即在处理统计数据时所采用的技术方法）分为两种类型：</p>
<ol>
<li>描述统计</li>
<li>推断统计</li>
</ol>
<p><strong>描述统计</strong>是统计学的一大分支，它协助我们通过数值或图形可视化来总结数据。</p>
<p>描述统计帮助我们识别和理解数据中的一些关键属性。它包含如中心极限、离散、箱形图、直方图等概念，我们将在下文讨论这些概念。</p>
<p><strong>推断统计</strong>是统计学的另一大分支，它帮助我们根据收集到的数据做出决策或预测。</p>
<p>推断统计是在描述性统计的基础上，更进一步的推理判断。它包括诸如假设、概率等概念。</p>
<h1 id="">数据科学入门必备统计学概念</h1>
<p>既然你现在已经熟悉了统计学的定义，让我们来看看在统计学中需要知道的一些相关概念，这些概念将带你入门统计学。</p>
<p>其中最基本的概念包括：</p>
<h2 id="">什么是对象？</h2>
<p>对象是我们想要观测的具体事物。它可以是一个人，一个动物，或其他东西。它也被称为观测点。</p>
<h2 id="">什么是总体？</h2>
<p>总体指的是我们感兴趣的（也就是我们想观察的）整个对象集，比如一个国家的全体女性人数。</p>
<h2 id="">什么是样本？</h2>
<p>现实情况下，观察一个总体几乎不可能（因为它费时费力）。</p>
<p>比如：你希望观测世界上所有女性数量，但进行这种观测成本很大。所以，在统计学中，我们有一种叫做样本的东西，它是总体的一部分或子集。我们可以利用样本对全部人口做出判断（推断统计）。</p>
<h2 id="">什么是参数？</h2>
<p>参数是描述总体特征的度量。比如，你正在观测一个国家的人口，你发现90%的居民为男性，10%为女性。数值90%和10%是整个人口的性别度量（描述统计）。它就是总体特征的一个参数。</p>
<h2 id="">什么是统计量？</h2>
<p>统计量（不要与统计学混淆）是描述样本特征的度量。如前所述，我们没法观测总体，只能观测样本，统计量就是对样本特征的数值度量。</p>
<p>希望现在你对什么是总体、样本、统计量和参数有了基本了解。让我们来看看另一个我们都很熟悉的概念："<strong>数据</strong>"。</p>
<p><strong>数据</strong>代表了事件信息，也就是说，它向我们传达了一个事实。它可以被分为两类：</p>
<ol>
<li>定量数据。</li>
<li>定性数据。</li>
</ol>
<h2 id="">什么是定量数据？</h2>
<p>它也被称为数值数据。它是一种可以计数或计量数值的数据。定量数据可以进一步分为两种类型：</p>
<p><strong>定量离散数据</strong>：它可以计数但不能精确计量， 比如计数鞋店中的鞋子个数。</p>
<p><strong>定量连续数据</strong>：这是一种基于精确计量的数值数据。例如，测量一个玻璃缸的重量。</p>
<h2 id="">什么是定性数据？</h2>
<p>它是代表类别或数据组的各种数据。它也被称为类别数据。它通常是特征、名字或其他东西的名称分类。</p>
<p>常见的例子包括人名，狗的品种等等。然而，有一些数据看起来像数值数据，但也被归为类别数据。</p>
<p>例如，假设你想根据年龄对某一群人进行分组，发现最低和最高年龄分别是10岁和60岁。然后你把年龄分成5个类别（10-20岁，21-30岁，31-40岁，41-50岁，51-60岁），并给每个类别分配数值，其中1代表10-20岁，2代表21-30岁，以此类推。</p>
<p>在这种情况下，数值将被作为定性数据而不是定量数据来处理。随着不断深入数据科学，你将学会如何处理类别数据。</p>
<p>了解了数据分类，现在我们来看看定量和定性数据在统计学中是如何计量的。统计学依据数据的计量尺度将数据划分为4类，它们分别是：</p>
<ol>
<li>名义数据</li>
<li>有序数据</li>
<li>间隔数据</li>
<li>比率数据</li>
</ol>
<p>定性数据可以用以下方式计量：</p>
<p><strong>名义数据</strong>：名义数据是无序的分类数据，也就是说，它们不能被排序。</p>
<p>每一组数据都代表一个分类，比如颜色。蓝色没有任何理由排在黄色之前。在处理名义数据时，每组数据都必须作为一个独立的分类来处理。</p>
<p><strong>有序数据</strong>：有序数据是有顺序的分类数据。当数据被排序后，就有了先后顺序。像优秀、良好、满意和不满意这样的调查回答就是一个例子。将优秀排在良好之上符合现实需要。</p>
<p>定量数据可以用以下方式计量：</p>
<p><strong>间隔数据</strong>：间隔数据是指有排序的数值数据，并且可以进行测量（比如，数据之间可以相减）。温度计的读数就是一个间隔数据例子。</p>
<p>例如，你可以测量摄氏4度和10度之间的差值，10度比4度高6度。间隔刻度数据有两个特点：</p>
<ol>
<li>它没有一个起点（也就是说，它不从零开始，可以有一个低于零的温度值）</li>
<li>无法计算出它们的比例。比如，80摄氏度比20摄氏度高4倍，这不符合逻辑，因为它们没有一个起点。</li>
</ol>
<p><strong>比率数据</strong>：比率数据具有间隔数据可以被排序和计量的特点，但比率数据有一个共同的起点，所以能计算它们之间的比率。</p>
<p>比如考试成绩分别为20、68、90或80分。我们可以给它排序，计算差值，并找到数值之间的比率，比如80分比20分高4倍。</p>
<p>现在我们已经介绍了数据的基本概念，接下来我们看看第一大类统计方法（描述统计）如何处理数据。</p>
<p>如前所述，描述统计需要用数字或图形来总结数据。让我们来看看在处理数据时，你会经常用到的一些最典型的数字和图形。</p>
<h2 id="vsvs">平均数 vs 中位数 vs 众数 --- 它们有什么区别？</h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/06/Visualisation_mode_median_mean.svg" alt="Visualisation_mode_median_mean" width="600" height="400" loading="lazy"></p>
<p>上图解释了平均数、中位数和众数的区别。众数是最高点，中位数是中间点，而平均数是均值。</p>
<h3 id="">什么是平均数？</h3>
<p>当我们有一组像4，5，6，7，10这样的数值数据时，这组数据中的每个值都被称为一个数据点。我们可能想找到这组数据的平均值。</p>
<p>平均值本质上就是一组数据的平均数，计算方法是所有数据点的总和除以数据点的总个数。</p>
<p>上面的数据集的总和是32，数据点的总个数是5，所以平均数，也就是平均值，是6.4。</p>
<p>平均数只存在于定量数据上，定性数据没有平均数。</p>
<h3 id="">什么是中位数？</h3>
<p>给定一组数值，我们可能想找到位于中间位置的数值，中位数就是最中间的数据点，中位数也只存在于定量数据。</p>
<h3 id="">什么是众数？</h3>
<p>众数是最高频出现的数据点（也就是出现次数最多的数值）。定量数据和定性数据都有众数。</p>
<h2 id="">什么是离群值？</h2>
<p>离群值是指与其他数据点显著不同的异常数据点。离群值会导致我们得出错误的结论。下面就是一个典型的例子。</p>
<p>假设你有一台机器能计算每天进入超市的顾客数。它某一周值为20、23、26、27、302。我们可以判断302就是一个离群值，因为它与其他数值有很大的差别。</p>
<p>离群值可能是由突然的变化、机器故障或其他情况造成的。它们的出现会导致错误结论。例如，如果想知道平均超市顾客访问量，数值302就可能具有误导性，让我们认为平均访问量是75。</p>
<h2 id="">什么是标准差？</h2>
<p>标准差是一种描述性数值，表明数据点与平均值的偏离程度。它被用来确定数据的分布情况。</p>
<p>标准差越接近于零，数据点就越趋近于平均值。</p>
<p>标准差是一种非常重要的描述性统计。它能告诉我们数据集的离散程度。下图是一张数据正态分布图，X轴以标准差为刻度。</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/06/1920px-Standard_deviation_diagram.svg.png" alt="1920px-Standard_deviation_diagram.svg" width="600" height="400" loading="lazy"></p>
<p>从上图可以看出，34.1% + 34.1% = 68.2% 的所有观测值都在一个标准差之内，或1σ（读作一个西格玛）。</p>
<p>加上13.6%+13.6%=27.2%的观测值在两个标准差之内，或2σ，以此类推。</p>
<p>不知道你是否听说过六西格玛这个工程学概念。它表示在质量保证过程中要考虑到六个标准差的可能性。这意味着除了最最极端的异常值之外，你要考虑到所有的情况。准确地说，是所有可能性的99.99966%。</p>
<p>现在我们已经掌握了一些以数字进行描述统计的方法，接下来让我们来看看一些常见的图形描述方法。</p>
<h2 id="">什么是柱状图？</h2>
<p>柱状图用于类别数据的可视化。用它可以来展示每组数据的频数（即一个类别中数据点出现的次数）。如图所示：</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2022/06/download-1.png" alt="download-1" width="600" height="400" loading="lazy"></p>
<h2 id="">什么是直方图？</h2>
<p>直方图与柱状图类似，用以展示数据组的频数。但与柱状图不同的是，它展示了定量连续数据组的频数，这些连续数据组也被称为区间或组距。</p>
<p>直方图是非常有效的可视化图形，可以帮助展示定量数据的分布。你可以在<a href="https://www.cuemath.com/data/histograms/">这里</a>读到更多关于直方图的信息。</p>
<!--kg-card-end: markdown--><figure class="kg-card kg-image-card"><img src="https://chinese.freecodecamp.org/news/content/images/2022/11/image-2.png" class="kg-image" alt="image-2" width="600" height="400" loading="lazy"></figure><!--kg-card-begin: markdown--><h2 id="">什么是箱型图？</h2>
<p>另一个非常棒的数据描述图表就是箱型图。</p>
<p>箱型图可以直观地查看是否存在离散点，它还展示了诸如最小区间值、第一四分位数，中位数，第三四分位数和最大区间值等数字。箱型图如图所示：</p>
<figure class="kg-card kg-card-image kg-card-hascaption">
    <img src="https://www.freecodecamp.org/news/content/images/2022/06/OutliersAnomalies--1-.png" alt="图片由 Ibrahim Ogunbiyi 提供" class="kg-image" width="600" height="400" loading="lazy">
    <figcaption>图片由 Ibrahim Ogunbiyi 提供</figcaption>
</figure>
<p>让我们来来看看上图都代表了什么意思。</p>
<p><strong>最小区间值</strong>：最小区间值并不是最小值。它等于 ( Q1 -1.5*IQR) 。</p>
<ul>
<li>Q1是第一四分位数。</li>
<li>IQR是第三四分位数和第一四分位数的差值。</li>
</ul>
<p>最小区间界定了正常数据点的范围，它可以帮助我们发现那些小于正常范围的离散点。</p>
<p>举个例子，假设我们的数据点是像这样分布[345, 402, 295, 386, 10]。我们可以判断数据点10是一个离群点，因为它远低于其他观察值。</p>
<p><strong>第一四分位数</strong>告诉我们25%的数据点低于这个数值，75%的数据点高于这个数值。它也被称为第25百分位数。</p>
<p><strong>第二四分位数</strong>告诉我们50%的数据点低于该数值，其余50%高于该数值。它也被称为第50百分位数。</p>
<p><strong>第三四分位数</strong>告诉我们75%的数据点低于该数值，其余25%高于该数值。它也被称为第75百分位数。</p>
<p><strong>最大区间值</strong>，和最小区间值一样，也不是数据集中的最高值。它的计算公式是（Q3+1.5*IQR）。</p>
<ul>
<li>Q3 是第三四分位数。</li>
<li>IQR是第三四分位数和第一四分位数的差值。</li>
</ul>
<p>最大区间值可以帮助我们发现那些远高于其他观察值的离散点。</p>
<p>比如，假设我们的数据点是像这样分布[645, 40, 25, 38, 42]。我们可以确定645是一个离散点，因为它是远远高于其他观察值。</p>
<p>总结完不同类型的数据图形展示后，让我们进入最后一个话题：</p>
<h2 id="">什么是定量变量之间的相关性？</h2>
<p><strong>变量</strong>是代表任何一组数值的统称，时常表示为表格中的一列。</p>
<p>如果一个变量中的数值变化引起另一个变量中的数值变化，我们就称这两个变量具有相关性。</p>
<p>为了度量两个定量变量之间的相关性，我们常常用卡尔-皮尔逊公式来计算，其结果在-1和+1之间。</p>
<p>如果相关值接近1，表明这两个变量正相关（也就是说，当一个变量数值增加时，另一个变量数值也会增加）。如果数值接近-1，表明这两个变量负相关（即随着一个变量数值增加，另一个变量数值减少）。最后，如果相关值为0，则两个变量之间没有相关性。</p>
<p>你可以在<a href="https://chinese.freecodecamp.org/news/top-statistics-concepts-to-know-before-getting-into-data-science/(https://www.statisticshowto.com/probability-and-statistics/correlation-coefficient-formula/)">这里</a>阅读更多关于相关性和卡尔-皮尔逊公式的知识。</p>
<h2 id="">什么是散点图？</h2>
<p>我们可以通过散点图来表示定量变量之间的相关性，如下图所示。</p>
<figure class="kg-card kg-card-image kg-card-hascaption">
    <img src="https://www.freecodecamp.org/news/content/images/2022/06/scatter-ice-cream1.svg" alt="图片来源：散点（XY）图（mathsisfun.com）" class="kg-image" width="600" height="400" loading="lazy">
    <figcaption>图片来源：散点（XY）图（mathsisfun.com）</figcaption>
</figure>
<p>想要了解更多散点图内容，可以点击<a href="https://byjus.com/maths/scatter-plot/#:~:text=Scatter%20plots%20are%20the%20graphs,plotted%20on%20the%20Y%2Daxis.">这里</a>。</p>
<h1 id="">结论：学无止境</h1>
<p>在本教程中，我们已经探讨了一些基本的统计学概念，这些概念将帮助你更有效地处理数据。</p>
<p>但学无止境---还有一些基本的统计学概念我们没有涉及，你必须自己去学习。这只是一个开始，你可以通过查阅在线资源或教科书进行更深入地学习。</p>
<p>非常感谢你阅读本文。请将本文分享给那些也想涉足数据科学的初学者。</p>
<!--kg-card-end: markdown--> ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ UI/UX 设计指南：什么是 UI 设计师？与 UX 设计师有何不同？ ]]>
                </title>
                <description>
                    <![CDATA[ 你可曾注意到用户界面设计（UI）和用户体验设计（UX）的区别？ 不少人都有这种疑问。 当下设计潮流和设计工具日新月异、推陈出新。前端开发越来越受到重视 [https://2020.stateofcss.com/en-US/] ，而越来越多的前端开发者也开始涉足 UI/UX 设计。UI设计和UX设计常常被他们混为一谈。两者有本质上的区别，初学者应该充分了解两者区别。 鉴于此，我和来自Creative Tim [https://creative-tim.com] 的团队伙伴做了很多研究，为大家提供了这份综合指南，展示了这两个大领域的核心内容与区别：  1. UI设计——界面外观如何  2. UX设计—— 产品效果如何  3. UI设计和UX设计有何主要区别?  4. UI设计师和UX设计师分别做什么?  5. 将UI和UX工作混淆有什么弊端?  6. UI/UX设计师如何协作?  7. UI/UX设计师收入水平如何?  8. 如何成为一名UI/UX专家？哪里找到相应的设计课程或教程？  9. 你应该专攻哪一个领域？UI还是UX设计？ 1.UI 设计---界面外观如何？ UI关 ]]>
                </description>
                <link>https://www.freecodecamp.org/chinese/news/ui-ux-design-guide/</link>
                <guid isPermaLink="false">631896795826d307a3f9c1c5</guid>
                
                    <category>
                        <![CDATA[ UI ]]>
                    </category>
                
                    <category>
                        <![CDATA[ UX ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Yaxing Li ]]>
                </dc:creator>
                <pubDate>Wed, 07 Sep 2022 04:16:00 +0000</pubDate>
                <media:content url="https://chinese.freecodecamp.org/news/content/images/2022/09/cover.jpeg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p data-test-label="translation-intro">
        <strong>原文：</strong> <a href="https://www.freecodecamp.org/news/ui-ux-design-guide/" target="_blank" rel="noopener noreferrer" data-test-label="original-article-link">UI/UX Design Guide: What Are UI Designers, and How Are They Different Than UX Designers?</a>
      </p><!--kg-card-begin: markdown--><p>你可曾注意到用户界面设计（UI）和用户体验设计（UX）的区别？</p>
<p>不少人都有这种疑问。</p>
<p>当下设计潮流和设计工具日新月异、推陈出新。<a href="https://2020.stateofcss.com/en-US/">前端开发越来越受到重视</a>，而越来越多的前端开发者也开始涉足 UI/UX 设计。UI设计和UX设计常常被他们混为一谈。两者有本质上的区别，初学者应该充分了解两者区别。</p>
<p>鉴于此，我和来自<a href="https://creative-tim.com">Creative Tim</a>的团队伙伴做了很多研究，为大家提供了这份综合指南，展示了这两个大领域的核心内容与区别：</p>
<ol>
<li><a href="#uidesignhowthingslook"><strong>UI设计——界面外观如何</strong></a></li>
<li><a href="#uxdesignhowthingswork"><strong>UX设计—— 产品效果如何</strong></a></li>
<li><a href="#whatarethekeydifferencesbetweenuianduxdesign"><strong>UI设计和UX设计有何主要区别?</strong></a></li>
<li><a href="#whatdouiuxdesignersdo"><strong>UI设计师和UX设计师分别做什么?</strong></a></li>
<li><a href="#whatarethedisadvantagesofacombineduiuxrole"><strong>将UI和UX工作混淆有什么弊端?</strong></a></li>
<li><a href="#howdouiuxdesignersworktogether"><strong>UI/UX设计师如何协作?</strong></a></li>
<li><a href="#whatarethesalariesofuianduxdesigners"><strong>UI/UX设计师收入水平如何?</strong></a></li>
<li><a href="#howdoyoubecomeauioruxexpertwhatkindofdesigncoursestutorialsshouldyoutake"><strong>如何成为一名UI/UX专家？哪里找到相应的设计课程或教程？</strong></a></li>
<li><a href="#whichshouldyouspecializeinuioruxdesign"><strong>你应该专攻哪一个领域？UI还是UX设计？</strong></a></li>
</ol>
<h2 id="1ui">1.UI 设计---界面外观如何？</h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/quote-martin-leblac-1.jpg" alt="Image with the quote &quot;A User interface is like a joke. If you have to explain it, it's not that good.&quot; — Martin LeBlac" width="600" height="400" loading="lazy"></p>
<p>UI关注软件图形界面，包括按钮、布局、动画、转场、微交互等。简而言之，UI关于界面外观。</p>
<p>UI设计包括以下界面:</p>
<ul>
<li><strong><a href="https://en.wikipedia.org/wiki/Graphical_user_interface">用户图形界面 (GUI)</a></strong>: GUI设计用户与系统控制工具之间的视觉交互。电脑桌面就是一种GUI。</li>
<li><strong><a href="https://en.wikipedia.org/wiki/Voice_user_interface">语音控制界面 (VUI)</a></strong>: VUI设计用户与系统的语音交互。三星的Bixby和苹果的Siri智能助手就是VUI例子。</li>
<li><strong><a href="https://en.wikipedia.org/wiki/Gesture_recognition">手势识别界面</a></strong>: 这种界面主要面向与虚拟现实（VR）以及其他基于手势的系统交互。用户面对的是3D空间。这是我们创建的可编辑<a href="https://www.creative-tim.com/product/soft-ui-dashboard-pro">Soft UI VR控制面板</a>。</li>
</ul>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/soft-vr-2-1.gif" alt="Example of a gesture-based interface." width="600" height="400" loading="lazy"></p>
<p><a href="https://demos.creative-tim.com/soft-ui-dashboard-pro/pages/dashboards/default.html">来源</a></p>
<ul>
<li>优秀的UI设计，需要考虑以下几点：
<ul>
<li>设计致力于帮助用户以最小的努力完成任务。</li>
<li>设计赏心悦目，令人愉悦。</li>
<li>设计传达企业或组织品牌价值。</li>
</ul>
</li>
</ul>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/10-design-pinciples-1.jpg" alt="A list of principles for good design." width="600" height="400" loading="lazy"></p>
<h2 id="2ux"><strong>2. UX设计---产品效果如何？</strong></h2>
<p>UX设计关注用户与系统全生态的交互。符合逻辑的导航和自然丝滑的体验都属于UX范畴。简而言之，UX设计使用户拥有积极的体验。</p>
<p>UX设计流程主要包含以下步骤：</p>
<ul>
<li><strong>交互设计</strong>涉及用户如何使用系统交互组件（包括页面转场、动画、按钮等），以便完成任务。</li>
<li><strong>用户研究</strong>涉及广泛的调研，包括从新老用户收集意见反馈， 理解用户需求，并根据调研结果进行设计。</li>
<li><strong>信息架构</strong>涉及信息内容的组织安排。为了便于用户完成任务，UX设计师需要厘清不同内容的类别关系，合理安排内容层级。</li>
</ul>
<p>优秀的UX设计，需要达到以下标准：</p>
<ul>
<li>产品易上手，易于理解。</li>
<li>产品能解决用户问题。</li>
<li>产品能满足不同用户群体的需求。</li>
<li>产品能为用户带来积极体验，使用户轻松操作各项功能。</li>
</ul>
<h3 id=""><strong>认知偏差</strong></h3>
<p>优秀的UX设计师需要时刻注意人类与生俱来的认知偏差。这些偏差会影响用户的使用体验。许多营销策略就是利用了这些认知偏差：:</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/Cognitive_bias_codex_en.svg" alt="A codex of cognitive biases" width="600" height="400" loading="lazy"></p>
<p><a href="https://upload.wikimedia.org/wikipedia/commons/6/65/Cognitive_bias_codex_en.svg">来源</a></p>
<h2 id="3uiux"><strong>3. UI设计和UX设计有何主要区别？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/ui-vs-ux-1.jpg" alt="Image of a branching walking path and dirt path." width="600" height="400" loading="lazy"></p>
<p>UI设计和UX设计这两个词常常被混淆使用。</p>
<p>尽管终端产品同时获益于这两种设计方法，但它们两者的设计过程却大相径庭。</p>
<p>UX设计关注用户解决问题的全旅程，而UI设计则注重产品的外观。</p>
<p>以下是UX和UI设计的主要区别：</p>
<ul>
<li><strong>关注点不同</strong>：UI设计师的主要关注点是终端产品的视觉呈现，所以他们制作的是高保真的产品原型。UX设计师则更关注终端产品的目的和功能，以及产品的内在逻辑。此外，UI设计师处理产品的微观设计细节，UX设计师则更关注宏观的项目管理和分析。</li>
<li><strong>原型细节程度不同</strong>：UI设计师设计彩色的产品原型，而UX设计师只绘制黑白的产品草图。</li>
<li><strong>使用工具不同</strong>：UI设计师使用 <a href="https://www.sketch.com/">Sketch</a>、<a href="https://www.flinto.com/">Flinto</a>、 <a href="https://principleformac.com/">Principle</a>等绘图工具，以及<a href="https://www.invisionapp.com/">InVision</a>等设计协作工具。UX设计师使用线框图工具，比如 <a href="https://www.mockplus.com/">Mockplus</a>。</li>
<li><strong>艺术成分不同</strong>：UI设计师需要在设计中加入艺术成分，因为产品关系到终端用户的视听体验。而UX设计师需要更多的社会属性，因为他们需要理解用户想要获得何种体验。</li>
</ul>
<p>这是同款产品UX线框图（左）和UI设计图（右）：</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/soft-ui-design-system-1.jpg" alt="A simple UX design wireframe and a hi-fi UI prototype for the same web page." width="600" height="400" loading="lazy"></p>
<p><a href="https://www.creative-tim.com/product/soft-ui-design-system-pro">来源</a></p>
<h2 id="uiux"><strong>UI设计师和UX设计师分别做什么？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/table-1.jpg" alt="A table showing the differences between UI and UX designers." width="600" height="400" loading="lazy"></p>
<p>想成为<strong>UI设计师</strong>需具备以下技能：</p>
<ul>
<li>适应敏捷工作模式。</li>
<li>能够绘制交互流程图、线框图、原型图等。</li>
<li>熟悉 <a href="https://www.invisionapp.com/">InVision</a>、 <a href="https://www.sketch.com/">Sketch</a> 、<a href="https://www.photoshop.com/">Photoshop</a> 、<a href="https://www.figma.com/">Figma</a> 等绘图工具。关于选择哪款绘图工具，可参看我们的这篇文章：<a href="https://www.freecodecamp.org/news/adobe-xd-vs-sketch-vs-figma-vs-invision/">InVision vs Sketch vs Figma vs Photoshop</a>。</li>
<li>能够使用HTML5、CSS3和JavaScript三种前端语言。</li>
<li>能够完成从构思到交付视觉设计整套流程。</li>
<li>与UX设计师、开发、测试人员和产品经理合作，为产品从设计到生产提供视觉创意。</li>
<li>通过设计将公司的品牌和风格传达给用户。</li>
<li>通过用户分析和研究，改进产品外观效果。</li>
<li>根据不同设备尺寸，进行产品响应式设计，保证产品交互动画的一致性。</li>
</ul>
<p>想成为优秀的<strong>UX设计师</strong>需具备以下技能：</p>
<ul>
<li>适应敏捷工作模式。</li>
<li>对用户体验过程有深刻的理解。</li>
<li>能够使用原型设计工具，如 <a href="https://www.adobe.com/creativecloud.html">Adobe Creative Suite</a>、<a href="https://www.sketch.com/">Sketch</a>、<a href="https://www.invisionapp.com/">InVision</a>、<a href="https://www.axure.com/">Axure</a>等。</li>
<li>解决问题的能力，以及保持对设计、人、生活和技术的好奇心。</li>
<li>对相关利益方的管理和保持与客户的互动。</li>
<li>创建流程图、线框图、网站地图、原型图及其他用户体验交付产品。</li>
<li>与开发人员、产品经理、UI设计师、外部利益相关方和测试工程师紧密合作，根据市场动态、用户反馈和技术限制来迭代设计。</li>
<li>分析客户需求、竞争对手、产品结构，制定产品体验策略。</li>
<li>为移动端、网络端、桌面端和其他硬件终端创造无缝式的设计和交互策略。</li>
</ul>
<h2 id="5uiux"><strong>5. 将UI和UX工作混淆有什么弊端？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/Artboard--4--1.jpg" alt="A concept seat belt design from the 1960s which went around people's necks." width="600" height="400" loading="lazy"></p>
<p>同时承担 UI/UX 的角色有点像同时戴着两顶不同的帽子。</p>
<p>尽管许多组织都将UI/UX当作相同工种，但其实两者需要不同的技能。两者的关注点、思维方式和产品原型设计方法都大相径庭。</p>
<p>将两个角色混淆就要求设计师不断地在概念和视觉之间不断切换。这不仅十分困难，还消耗了向两方面各自投入的时间精力。</p>
<h2 id="6uiux"><strong>6. UI/UX设计师如何协作？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/Artboard-Copy-4--1--1.jpg" alt="Designers working together." width="600" height="400" loading="lazy"></p>
<p>尽管UI/UX设计师技能要求不同，但他们需要通力合作，为用户提供最佳体验。</p>
<p>UI设计需要具有美感，但如果没有一个好的UX设计，它的导航可能笨拙混乱。另一方面，一个产品的用户体验就算完美无缺，但如果没有一个好看的用户界面，就吸引不了用户。</p>
<p>任何前端开发和设计过程都应该从了解用户需求开始。UX和UI设计师应该与开发者、产品经理和老板一道，共同确定最终产品的功能、外观和效果。</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/quote-steve-jobs-1.jpg" alt="A quote from Steve Jobs that reads, &quot;Design is not just what it looks like and feels like. Design is how it works.&quot;" width="600" height="400" loading="lazy"></p>
<p>UX设计师通常参与产品设计的早期阶段，因为他们需要设计活动，帮助用户解决问题。这些活动包括用户分析和项目管理等。</p>
<p>之后，UI设计师根据UX设计师提供的草图进行美学和交互设计。</p>
<p>可以这样说，UI设计师和UX设计师携手并进，共同创造产品。即使有人身兼两职，也必须遵循不同的设计准则。</p>
<h2 id="7uiux"><strong>7. UI/UX设计师收入水平如何？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/ux-salary-1.jpg" alt="A map showing different UI/UX designer salaries in different parts of the world." width="600" height="400" loading="lazy"></p>
<p>UI设计师在全世界的平均收入为5万元，美国的平均工资为9.1万，德国为5.7万，法国为4.7万，英国为6.7万。</p>
<p>UX设计师的收入略高，全球平均为5.2万。美国的UX设计师平均收入为10.2万，德国为5.3万，法国为4.9万，英国为6.8万。(来源： <a href="http://www.glassdoor.com/">Glassdoor</a>)</p>
<p>注：上面列出的所有工资都是该地区的平均水平，并且以美元为单位。</p>
<h2 id="8uiux"><strong>8. 如何成为一名UI/UX专家？哪里找到相应的设计课程或教程？</strong></h2>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/tutorials--1--1.jpg" alt="Animated people using laptops." width="600" height="400" loading="lazy"></p>
<p>要想成为一名UI/UX专家，首先要对UI/UX设计非常感兴趣。确认了自己的兴趣，就应该找到相应资源，并参加设计课程，为就业市场做好准备。</p>
<p>有一些在线课程可以帮助你入门UI设计， 如 <a href="https://careerfoundry.com/en/courses/become-a-ui-designer/">UI设计课程</a> 和<a href="https://learnui.design/">学习UI设计</a>。</p>
<p>对于UX设计，可以选择网上自学，报名网络课程。你可以参考这里介绍的<a href="https://uxplanet.org/30-best-online-course-websites-to-learn-ui-ux-updated-6b104762731a">学习UI/UX的最佳在线课程</a>，里面介绍了哪些网站提供免费课程，以及课程评价。</p>
<p>还有许多大学公开的UX设计<a href="https://www.interaction-design.org/courses">付费课程</a>，或者来自<a href="https://online.rmit.edu.au/course/sc-user-experience-design-dtr105">在线大学</a>的课程。同样可以参考这里介绍的<a href="https://uxplanet.org/30-best-online-course-websites-to-learn-ui-ux-updated-6b104762731a">学习UI/UX的最佳在线课程</a>，里面介绍了哪些网站提供免费课程，以及课程评价。</p>
<p>假设你已经具备了成为UI/UX设计师所需的一些技能。在这种情况下，你也可以看看诸如<a href="ttps://uxdesign.cc/10-essential-cognitive-behavior-patterns-for-ux-design-7f0cc2e00d31">UX设计行为模式</a>、<a href="https://uxdesign.cc/65-ux-methods-and-when-to-use-them-73e70c742d12">常用用户体验方法</a>、<a href="https://dribbble.com/tags/article">世界上最好的设计师的启发式图形设计</a>、以及<a href="https://uxdesign.cc/5-academic-research-papers-every-designer-should-read-f24b170db295">设计师应该阅读的学术研究论文</a>等文章。</p>
<h3 id="9uiux"><strong>9. 你应该专攻哪一个领域？UI还是UX设计？</strong></h3>
<p>专攻UI还是UX设计既取决于个人偏好，也要看自身特定技能组合。</p>
<p>然而，有大量的公司招聘身兼两职的UI/UX设计师。</p>
<p>虽然这两者的角色和职责各不相同，但UI/UX设计仍是一片蓝海，因此最好对两者都有足够的了解。</p>
<p>虽然两者很难平衡，但身兼两职当然报酬也更高，也利于提升自己在公司的重要性。</p>
<p>尽管如此，在两个角色之间来回切换十分困难，最好还是专攻一个领域。</p>
<p>比如，你有艺术细胞，了解色彩组合搭配，知道如何提升产品视觉美感，那你更适合UI设计。</p>
<p>而如果你善于管理用户和相关利益方，具备出色的分析能力，并且了解如何改善用户体验，那么UX设计会更适合你。</p>
<p><img src="https://www.freecodecamp.org/news/content/images/2021/07/quote-joe-sparano-1.jpg" alt="A quote from Joe Sparano that reads, &quot;Good design is obvious. Great design is transparent.&quot;" width="600" height="400" loading="lazy"></p>
<h2 id="10"><strong>10. 结语</strong></h2>
<p>UI和UX设计都需要理解用户。</p>
<p>只要同用户有同理心，前端开发和设计并非十分复杂--有很多现成的组件、工具和套件可以使设计更高效。</p>
<p><a href="https://www.creative-tim.com/">Creative Tim</a>为你提供了大量的免费、优质、可编辑的UI工具，如模板、仪表板和设计体系。</p>
<p>如果想用手绘组件的方式绘制插图，请关注Creative Tim的产品：<a href="https://iradesign.io/">IRA Design</a>。</p>
<p>欢迎在<a href="https://twitter.com/CreativeTim">Twitter</a>上联系我们。</p>
<!--kg-card-end: markdown--> ]]>
                </content:encoded>
            </item>
        
    </channel>
</rss>
