<?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[ 产品设计 - 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[ 产品设计 - freeCodeCamp.org ]]>
            </title>
            <link>https://www.freecodecamp.org/chinese/news/</link>
        </image>
        <generator>Eleventy</generator>
        <lastBuildDate>Tue, 26 May 2026 20:24:23 +0000</lastBuildDate>
        <atom:link href="https://www.freecodecamp.org/chinese/news/tag/product-design/rss.xml" rel="self" type="application/rss+xml" />
        <ttl>60</ttl>
        
            <item>
                <title>
                    <![CDATA[ 写作为何有助于产品设计 ]]>
                </title>
                <description>
                    <![CDATA[ 在我创建和设计产品，如APP应用程序、网站和图形制作工具 [http://gfxmaker.com/] 时，通常会遇到两类人：一类是偏好定性叙述的人，另一类是偏好数据和分析的人。 第一类人习惯基于用户主观反馈和观点去构建产品开发框架。第二类人对第一类人的方法持谨慎态度。第二类人希望应用“Excel模型”根据数字来倒推工作。 为便于区分，我们就称第一类人为“storyteller”（讲故事的人），第二类人为“quant”（量化员）。 这两类人都想要设立有意义的产品愿景 [https://instasize.com/blog/5-tips-for-taking-great-product-images] ，了解用户，然后创建出大规模的工具。两者的用意都很好，只是在如何利用洞察做决策方面，采用了不同方法。 另外，他们收集、分析和部署这些洞察的方式也不同。 暂停片刻，问问自己你更像哪类人呢？storyteller还是quant？或许会对你有用。 无论你的答案是什么，我相信有一种将两者统一结合起来的方法，帮助他们在追求创建更优质更构思周密产品的路途中找到共通点。 那就是通过写作。  ]]>
                </description>
                <link>https://www.freecodecamp.org/chinese/news/how-writing-can-lead-to-better-product-design/</link>
                <guid isPermaLink="false">63fdfc6c0687e3060be26da7</guid>
                
                    <category>
                        <![CDATA[ 产品设计 ]]>
                    </category>
                
                    <category>
                        <![CDATA[ 写作 ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Narcissus91 ]]>
                </dc:creator>
                <pubDate>Mon, 27 Feb 2023 02:16:00 +0000</pubDate>
                <media:content url="https://chinese.freecodecamp.org/news/content/images/2023/02/604adcf9a7946308b7687147.jpeg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p data-test-label="translation-intro">
        <strong>原文：</strong> <a href="https://www.freecodecamp.org/news/how-writing-can-lead-to-better-product-design/" target="_blank" rel="noopener noreferrer" data-test-label="original-article-link">How Writing Can Lead to Better Product Design</a>
      </p><!--kg-card-begin: markdown--><p>在我创建和设计产品，如APP应用程序、网站和<a href="http://gfxmaker.com/">图形制作工具</a>时，通常会遇到两类人：一类是偏好定性叙述的人，另一类是偏好数据和分析的人。</p>
<p>第一类人习惯基于用户主观反馈和观点去构建产品开发框架。第二类人对第一类人的方法持谨慎态度。第二类人希望应用“Excel模型”根据数字来倒推工作。</p>
<p>为便于区分，我们就称第一类人为“storyteller”（讲故事的人），第二类人为“quant”（量化员）。</p>
<p>这两类人都想要设立有意义的<a href="https://instasize.com/blog/5-tips-for-taking-great-product-images">产品愿景</a>，了解用户，然后创建出大规模的工具。两者的用意都很好，只是在如何利用洞察做决策方面，采用了不同方法。</p>
<p>另外，他们收集、分析和部署这些洞察的方式也不同。</p>
<p>暂停片刻，问问自己你更像哪类人呢？storyteller还是quant？或许会对你有用。</p>
<p>无论你的答案是什么，我相信有一种将两者统一结合起来的方法，帮助他们在追求创建更优质更构思周密产品的路途中找到共通点。</p>
<p>那就是通过写作。</p>
<h2 id="">为什么写作对产品设计至关重要</h2>
<p>写作被定义为一种记录连贯词汇并构成文本的书面活动或技能。学习写作要从基础原则开始：你必须学习字母表，学习如何将字母组成单词。</p>
<p>然后，这些单词又被放在一起组成句子。</p>
<p>句子组合在一起又能开始表达更深的含义。</p>
<p>写作是一种成因机制。它让我们深入思考自己想要表达的内容和动机。</p>
<p>写作帮助我们专注于最重要的东西。</p>
<p>而且，如果做得好的话，写作可以减少困惑。</p>
<p>有多少次你在看产品演示文稿时，是因为演讲者的质量（无论好坏）而相信产品优点的？例如，一个有吸引力的观点可以掩盖对用户来说真正重要的东西，并影响用户的判断。</p>
<p>亚马逊创始人杰夫·贝佐斯（Jeff Bezos）曾经写道：</p>
<blockquote>
<p>“Powerpoint式的演讲文稿在某种程度上允许掩饰观点，抹平任何相对重要性的感觉，忽略观点之间的关联性。”</p>
</blockquote>
<p>写作促使我们明白真正重要的东西：一个论点的力度和条理性，以及论点如何被论据支持或证实。</p>
<p><a href="https://crustlab.com/">产品开发</a>本质上是杂乱的。因为很多时候，产品即使看起来很简单，本质上却很复杂。</p>
<p>软硬件都是如此。我们认为理所当然的日常物品中就存在着巨大的复杂性。</p>
<p>汉莎航空声称，波音制造747-8需要600万个零件。</p>
<p>一辆简单的汽车整车可能有30,000个零件。</p>
<p>据估计，Android操作系统的代码量有1200-1500万行。</p>
<p>大型强子对撞机使用了5000万条线。</p>
<p>不包括后端代码， Facebook（前端和各种<a href="https://www.ideazinc.com/top-20-amazing-landing-pages-reviewed/">登录页面</a>）的代码量就有7000万行。</p>
<p>结构清晰的叙述性文本（与项目符号或纯文本相比）能够帮助作者或产品设计师阐释论点背后的“原因”。</p>
<p>积极有力的写作促使人们进行更多的反思，更好地理解什么是最重要的，以及事物（零件、人员、计划、预算、产品）之间的关系。</p>
<p>最后，写作有助于创造一个公平的竞争环境。</p>
<p>很多时候，观点（以及因解释的方式或主体不同）会造成偏见。想象一下，当你收到一份宣传产品功能或上市计划的备忘录，你对作者一无所知，不知道作者的背景、角色或团队。</p>
<p>你所能做的就是评估作者文字的质量、持续性和清晰度。这样可能会带来更好的商业结果和产品设计决策。</p>
<h2 id="">如何提高写作水平</h2>
<p>写作是一种通过练习可以提高的技能。我记得五年级的时候，我母亲坐在我旁边，用红墨水笔批改我为完成家庭作业写的一篇作文。</p>
<p>编辑文字并不容易。当时写作不好玩，二十多年后，它也不总是有趣。但是，通过打磨，我们可以拥抱写作，并写得越来越好。</p>
<p>“熟能生巧”这句老话当然不适用于我。尽管这样，通过强迫自己经常写作，我还是能够有所提高。</p>
<p>如果你正在创建产品并想要通过书面文字分享你的愿景，赢得内部利益相关者，<a href="https://www.cloudtalk.io/blog/types-of-call-centers">助力更有效地沟通</a>，那么从今天开始，你可以从这几件事开始着手。</p>
<h3 id="">创建一个大纲</h3>
<p>首先，你可以拿出一张纸或打开一个在线文档，对于你想要表达的内容，开始创建一个大纲。以“为什么”为出发点来创建大纲。</p>
<p>你可以通过大纲来打磨你的想法，勾勒你的产品愿景。</p>
<h3 id="">尝试不同的写作类型</h3>
<p>第二，你可以尝试不同有趣的写作方式来表达你的产品。</p>
<p>例如，你可以撰写一篇新闻稿。如果你是《纽约时报》的一名技术版块撰稿记者，会如何评价你的产品？</p>
<p>编写一篇具有未来感的新闻简报很有趣，让创造性思维活跃起来，并且思考他人会如何看待自己创建的产品也是一种令人愉悦的方式。</p>
<h3 id="">快速记下一些常见问题</h3>
<p>第三，你可以通过起草和完成“常见问题”（FAQ）来提高你的产品写作技能。人们对你的产品有什么不理解，为什么不理解？试着思考和回复用户的这些问题。</p>
<p>写FAQ有两方面的好处，一是可以提高你的写作水平，二是你能更深入理解产品的哪些方面可能对用户来说是难以理解的。有了这种洞察，你可以预先解决这些问题。</p>
<h2 id="">将写作和产品设计结合起来</h2>
<p>在这篇文章开头，我描述了“storytellers” 和 “quants”。在根据信息（数据、数字、反馈、<a href="https://resources.credly.com/blog/degree-inflation-hiring">证书</a>等）作出结论和进行推断方面，这两类人代表着两种不同的处理方式。</p>
<p>写作可以将“storytellers”和“quants”结合起来，并为思想表达提供一个公平的竞争环境。</p>
<p>写作有助于我们避免过早优化。</p>
<p>今天写作可能对你来说是一个挑战，但它值得练习。如果你需要指点才能开始，那就试试概述<a href="https://www.savingjunkie.com/best-gig-economy-apps/">零工经济</a>的未来或者<a href="https://www.resourcifi.com/blog/latest-trends-in-mobile-app-design-2020-2021/">移动应用程序</a>的未来趋势。</p>
<p>如果你还没有写你的产品未来状态，你应该开始了。它将有助于磨砺你的思维，让你产出更好的结果。</p>
<p>最终，产品未来状态应该成为每个产品创建者的北极星指标。</p>
<!--kg-card-end: markdown--> ]]>
                </content:encoded>
            </item>
        
            <item>
                <title>
                    <![CDATA[ 如何在 Figma 中调整元素大小 ]]>
                </title>
                <description>
                    <![CDATA[ 原文：How to Resize Elements in Figma [https://www.freecodecamp.org/news/how-to-resize-elements-in-figma/]，作者： Ijelekhai Faith Olohijere [https://www.freecodecamp.org/news/author/ijelekhai/] 在这篇文章中，我们将学习在 Figma 中调整元素和群组大小的几种不同方法（除了默认的方法外）。我们还将学习如何在不移动框架内元素的情况下调整框架的大小。 在 Figma 中，除了默认方法外，还有其他方法可以调整元素的大小。因此，如果使用默认方法不能得到你所需要的结果，请不要着急。 首先我们来看看默认方法，以便你熟悉它，然后我们再看看调整元素和组的其他方法。 如何在 Figma 中调整大小 - 默认方法 在 Figma 中调整大小的默认方法是点击并拖动。要用默认方法调整一个元素的大小，你只需选择你的对象，并使用任何一个转换控件，调整其大小，直到你满意为止。 这样做时，按住键盘上的 SHIFT 键将有助于调整 ]]>
                </description>
                <link>https://www.freecodecamp.org/chinese/news/how-to-resize-elements-in-figma/</link>
                <guid isPermaLink="false">6268a8ed395ec5063718ace9</guid>
                
                    <category>
                        <![CDATA[ Figma ]]>
                    </category>
                
                    <category>
                        <![CDATA[ 产品设计 ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Chengjun.L ]]>
                </dc:creator>
                <pubDate>Wed, 27 Apr 2022 04:10:00 +0000</pubDate>
                <media:content url="https://chinese.freecodecamp.org/news/content/images/2022/04/pexels-pixabay-163822.jpeg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>原文：<a href="https://www.freecodecamp.org/news/how-to-resize-elements-in-figma/">How to Resize Elements in Figma</a>，作者：<a href="https://www.freecodecamp.org/news/author/ijelekhai/">Ijelekhai Faith Olohijere</a></p><p>在这篇文章中，我们将学习在 Figma 中调整元素和群组大小的几种不同方法（除了默认的方法外）。我们还将学习如何在不移动框架内元素的情况下调整框架的大小。</p><p>在 Figma 中，除了默认方法外，还有其他方法可以调整元素的大小。因此，如果使用默认方法不能得到你所需要的结果，请不要着急。</p><p>首先我们来看看默认方法，以便你熟悉它，然后我们再看看调整元素和组的其他方法。</p><h2 id="-figma-">如何在 Figma 中调整大小 - 默认方法</h2><p>在 Figma 中调整大小的默认方法是点击并拖动。要用默认方法调整一个元素的大小，你只需选择你的对象，并使用任何一个转换控件，调整其大小，直到你满意为止。</p><p>这样做时，按住键盘上的 SHIFT 键将有助于调整比例。</p><figure class="kg-card kg-image-card kg-width-wide"><img src="https://www.freecodecamp.org/news/content/images/2022/04/-BE1B5C7A-6409-4FD0-A33B-FAF508AF4283-.png" class="kg-image" alt="-BE1B5C7A-6409-4FD0-A33B-FAF508AF4283-" width="600" height="400" loading="lazy"></figure><p>有时，默认方法可能对某些元素不起作用。在这些情况下，点击和拖动可能会导致对象被扭曲。那么，你可以怎么做呢？</p><h2 id="-figma--1">如何在 Figma 中用属性调整对象的大小</h2><p>要真正精确地调整一个对象的大小，请进入位于文件右上方的属性检查器，找到高度和宽度字段，输入你选择的数值。你也可以用鼠标光标拖动这些数值。你总是可以用这种方法来获得你所需要的确切比例，比如 140×140、100×50，等等。</p><p>记住，你在属性字段中输入的任何数值都会反映在你的框架中，所以，选择不会扭曲你的框架的比例很重要。例如，一个150 x 20的元素很可能看起来失真。</p><p>你可以随时试验各种数值，直到你把元素的大小调整到你满意的程度。这一切都取决于你自己的需求。</p><figure class="kg-card kg-image-card kg-width-wide"><img src="https://www.freecodecamp.org/news/content/images/2022/04/-95A14028-657E-4B03-9C85-7D4847874ED8--1.png" class="kg-image" alt="-95A14028-657E-4B03-9C85-7D4847874ED8--1" width="600" height="400" loading="lazy"></figure><h2 id="-figma--2">如何在 Figma 中使用缩放工具调整物体的大小</h2><p>Figma 缩放工具位于屏幕的左上角。要使用缩放工具，请选择你的框架，点击缩放工具，并使用缩放控制拖动。</p><p>这个工具在你处理调整图标的大小时特别有用。有些图标在你试图调整它们的大小时，会变得不成形。缩放工具有助于确保你的元素或框架的元素不被扭曲。</p><p>缩放适用于文本对象、框架、组件等。你可以随时使用缩放工具来调整元素的大小。</p><figure class="kg-card kg-image-card kg-width-wide"><img src="https://www.freecodecamp.org/news/content/images/2022/04/-1C7FE77E-7A92-4633-88BC-CC1EC9A36F35--1.png" class="kg-image" alt="-1C7FE77E-7A92-4633-88BC-CC1EC9A36F35--1" width="600" height="400" loading="lazy"></figure><h2 id="-figma--3">如何在 Figma 中用键盘快捷键调整对象的大小</h2><p>要用键盘快捷键调整对象的大小，请选择该对象，按住 CTRL，并使用方向键来调整对象的大小。你可以一次增加或减少 1px 的宽度或高度。你可以在任何情况下使用键盘快捷键。</p><figure class="kg-card kg-image-card kg-width-wide"><img src="https://www.freecodecamp.org/news/content/images/2022/04/278540_VideoBannerHotkeyHighlight-CtrlShiftArrows_Web_082818.png" class="kg-image" alt="278540_VideoBannerHotkeyHighlight-CtrlShiftArrows_Web_082818" width="600" height="400" loading="lazy"></figure><p>提示：同时按住键盘上的 SHIFT 键可以加快调整大小的速度，每次调整 10px。</p><h2 id="-figma--4">如何在 Figma 中调整大小而不移动框架内的对象</h2><p>有时，在试图调整包含输入字段的框架的大小时，你会发现一些对象由于受到限制而随框架一起移动。</p><p>当然，这并不是我们想要的结果。要在调整大小时忽略一个元素的约束，请在拖动时按住 CTRL。另外，在拖动时按住 Ctrl + Alt 将按比例调整元素的大小。</p><figure class="kg-card kg-image-card kg-width-wide"><img src="https://www.freecodecamp.org/news/content/images/2022/04/-4F83A341-FA5A-4948-8E2D-E961C5361301-.png" class="kg-image" alt="-4F83A341-FA5A-4948-8E2D-E961C5361301-" width="600" height="400" loading="lazy"></figure><h2 id="-"><strong>小结</strong></h2><p>知道如何调整元素的大小可以真正帮助你为你的设计创建赏心悦目的框架。</p><p>祝你在 Figma 设计之旅上好运！</p> ]]>
                </content:encoded>
            </item>
        
    </channel>
</rss>
