{"id":15580,"date":"2026-09-25T12:28:13","date_gmt":"2026-09-25T12:28:13","guid":{"rendered":"https:\/\/savethevideo.net\/blog\/?p=15580"},"modified":"2026-09-25T12:40:46","modified_gmt":"2026-09-25T12:40:46","slug":"ui-notes-figma-vs-notion-for-documenting-ui-design-decisions","status":"publish","type":"post","link":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/","title":{"rendered":"UI Notes: Figma vs Notion for Documenting UI Design Decisions"},"content":{"rendered":"<p><strong>Use Figma for notes tied to pixels.<\/strong> Use Notion for notes tied to people, process, and future memory. That is the clean split. If a decision changes what users see, keep it near the design.<\/p>\n<div>\n<p><strong>TLDR:<\/strong> Figma is best for quick UI decisions, visual comments, and design context. Notion is best for deeper records, approvals, meeting notes, and cross-team reading. For example, a product team with 12 people cut repeat Slack questions by <strong>28%<\/strong> after moving final UI decisions into a simple Notion decision log, while keeping design comments in Figma. Use both, but give each one a clear job.<\/p>\n<\/div>\n<h2>Why UI notes matter<\/h2>\n<p>UI notes sound boring. They are not. They are the tiny bits of memory that stop teams from asking, <em>\u201cWait, why did we make this button blue?\u201d<\/em> for the fifth time.<\/p>\n<p>A good UI note explains the reason behind a design choice. It can cover button labels, empty states, spacing, error messages, accessibility rules, and weird edge cases. It saves time. It prevents rework. It keeps product, design, engineering, and support from guessing.<\/p>\n<p>The problem is simple. Notes get scattered. Some live in Figma comments. Some live in Slack. Some hide in meeting docs. Some exist only in one designer\u2019s head. Not great.<\/p>\n<p>So the real question is not <em>\u201cFigma or Notion?\u201d<\/em> It is <strong>\u201cWhich note belongs where?\u201d<\/strong><\/p>\n<img loading=\"lazy\" decoding=\"async\" width=\"1080\" height=\"1532\" src=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg 1080w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system-211x300.jpg 211w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system-722x1024.jpg 722w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system-768x1089.jpg 768w\" sizes=\"auto, (max-width: 1080px) 100vw, 1080px\" \/>\n<h2>Figma is best when the note needs a visual home<\/h2>\n<p>Figma wins when the decision is close to the interface. It is fast. It is visual. It lets people point at the exact thing they mean.<\/p>\n<p>This is a big deal. Saying \u201cthe card title needs less space\u201d in a document is vague. Saying it on top of the actual card in Figma is clear. No detective work needed.<\/p>\n<p>Use Figma for notes like:<\/p>\n<ul>\n<li><strong>Spacing decisions:<\/strong> \u201cUse 24 px between sections on desktop.\u201d<\/li>\n<li><strong>Component behavior:<\/strong> \u201cThis dropdown closes after one choice.\u201d<\/li>\n<li><strong>State notes:<\/strong> \u201cShow this message when the list is empty.\u201d<\/li>\n<li><strong>Copy tied to layout:<\/strong> \u201cKeep label under 18 characters.\u201d<\/li>\n<li><strong>Accessibility hints:<\/strong> \u201cError text must stay visible after focus moves.\u201d<\/li>\n<\/ul>\n<p>Figma also helps engineers. They can inspect the design and read notes in the same place. That reduces back and forth. Nobody wants a 16-message thread about a tooltip.<\/p>\n<p>But Figma notes can become messy. Comments get resolved. Frames get renamed. Drafts sit beside final screens. It drives me crazy that one small comment can feel obvious on Monday and impossible to find by Friday.<\/p>\n<p>Figma is great for working notes. It is not always great for long-term memory.<\/p>\n<h2>Notion is best when the note needs a shelf life<\/h2>\n<p>Notion wins when the decision needs to be found later. It is better for structure. It is better for summaries. It is better for people who do not live inside design files.<\/p>\n<p>Think of Notion as the team notebook. It tells the story. It holds the \u201cwhy.\u201d It records who agreed, when they agreed, and what tradeoffs came with the choice.<\/p>\n<p>Use Notion for notes like:<\/p>\n<ul>\n<li><strong>Decision logs:<\/strong> \u201cWe chose tabs instead of filters because users compare categories often.\u201d<\/li>\n<li><strong>Research links:<\/strong> \u201c6 of 10 test users missed the secondary action.\u201d<\/li>\n<li><strong>Release notes:<\/strong> \u201cCheckout redesign shipped in version 3.4.\u201d<\/li>\n<li><strong>Approval records:<\/strong> \u201cLegal approved this consent copy on March 12.\u201d<\/li>\n<li><strong>Design principles:<\/strong> \u201cUse plain language for all error messages.\u201d<\/li>\n<\/ul>\n<p>Notion is also easier for product managers, writers, support teams, and stakeholders. They can read a page without opening a giant design file. Nice.<\/p>\n<p>Still, Notion can grow into a junk drawer. Expect to waste time on duplicate pages if nobody owns the system. \u201cFinal final UI notes\u201d is not a strategy. It is a cry for help.<\/p>\n<img loading=\"lazy\" decoding=\"async\" width=\"1080\" height=\"720\" src=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/a-close-up-of-a-paper-with-writing-on-it-notion-document-decision-log-team-notes.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/a-close-up-of-a-paper-with-writing-on-it-notion-document-decision-log-team-notes.jpg 1080w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/a-close-up-of-a-paper-with-writing-on-it-notion-document-decision-log-team-notes-300x200.jpg 300w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/a-close-up-of-a-paper-with-writing-on-it-notion-document-decision-log-team-notes-1024x683.jpg 1024w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/a-close-up-of-a-paper-with-writing-on-it-notion-document-decision-log-team-notes-768x512.jpg 768w\" sizes=\"auto, (max-width: 1080px) 100vw, 1080px\" \/>\n<h2>The simple rule: pixels in Figma, reasons in Notion<\/h2>\n<p>Here is the easiest split.<\/p>\n<ul>\n<li><strong>Put the note in Figma<\/strong> if it explains something visible on the screen.<\/li>\n<li><strong>Put the note in Notion<\/strong> if it explains a decision, policy, meeting, or history.<\/li>\n<li><strong>Use both<\/strong> when the choice is important and easy to forget.<\/li>\n<\/ul>\n<p>Example time.<\/p>\n<p>Your team changes a \u201cContinue\u201d button to \u201cReview order.\u201d That exact label belongs in Figma. Put the note near the button. Add a short reason, like, <em>\u201cUsers thought Continue meant payment starts now.\u201d<\/em><\/p>\n<p>Then add the final decision to Notion. Include the test result. Add the date. Add the owner. Link back to the Figma frame. Now the note has context and a home.<\/p>\n<p>This is boring in the best way. Boring systems get used.<\/p>\n<h2>How to document UI decisions in Figma<\/h2>\n<p>Keep Figma notes short. People scan them while building. They do not want a novel next to a modal.<\/p>\n<p>A good Figma note has three parts:<\/p>\n<ol>\n<li><strong>What changed:<\/strong> \u201cPrimary button label is now \u2018Save changes.\u2019\u201d<\/li>\n<li><strong>Why it changed:<\/strong> \u201cUsers did not know if changes saved on close.\u201d<\/li>\n<li><strong>Any rule:<\/strong> \u201cUse this label on all settings forms.\u201d<\/li>\n<\/ol>\n<p>Use annotations for stable notes. Use comments for open questions. Do not mix them too much. A comment sounds temporary. An annotation sounds like guidance.<\/p>\n<p>Also, name your frames clearly. \u201cCheckout v7 maybe final\u201d is pain in text form. Use names like \u201cCheckout, approved, Apr 2026.\u201d Simple beats clever.<\/p>\n<h2>How to document UI decisions in Notion<\/h2>\n<p>Notion needs a repeatable format. Without one, every page becomes a snowflake. Pretty, but annoying.<\/p>\n<p>Try this tiny template:<\/p>\n<ul>\n<li><strong>Decision:<\/strong> What did we choose?<\/li>\n<li><strong>Reason:<\/strong> Why did we choose it?<\/li>\n<li><strong>Evidence:<\/strong> What data, test, or feedback supports it?<\/li>\n<li><strong>Impact:<\/strong> Which screens, users, or teams are affected?<\/li>\n<li><strong>Status:<\/strong> Proposed, approved, shipped, or replaced.<\/li>\n<li><strong>Links:<\/strong> Figma frame, ticket, research, or release note.<\/li>\n<\/ul>\n<p>This format makes old choices easier to trust. It also helps new teammates. They can learn the product without pulling five people into meetings.<\/p>\n<h2>When Figma gets annoying<\/h2>\n<p>Figma can hide history. Resolved comments vanish from daily view. Explorations pile up. One file may hold ten versions of the same flow. Then someone asks which one is real. Great. More archaeology.<\/p>\n<p>Figma is also not ideal for broad reading. A support lead may not want to open a design file just to check the reason for a label change. They need a clean page. Not a canvas full of arrows.<\/p>\n<p>So use Figma for the active design layer. Do not force it to become the whole company brain.<\/p>\n<h2>When Notion gets annoying<\/h2>\n<p>Notion can separate notes from the thing they describe. A page may say \u201cUpdate tooltip behavior,\u201d but not show the tooltip. Then readers need to open links, hunt for frames, and guess what changed.<\/p>\n<p>Notion pages can also get too long. A decision log with 90 entries is technically useful. It is also a wall. Add filters. Add status tags. Add owners. Your future self will be less grumpy.<\/p>\n<img loading=\"lazy\" decoding=\"async\" width=\"1080\" height=\"720\" src=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/youtube-application-screengrab-youtube-workflow-video-links-content-team-approval-process.jpg\" class=\"attachment-full size-full\" alt=\"\" srcset=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/youtube-application-screengrab-youtube-workflow-video-links-content-team-approval-process.jpg 1080w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/youtube-application-screengrab-youtube-workflow-video-links-content-team-approval-process-300x200.jpg 300w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/youtube-application-screengrab-youtube-workflow-video-links-content-team-approval-process-1024x683.jpg 1024w, https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/09\/youtube-application-screengrab-youtube-workflow-video-links-content-team-approval-process-768x512.jpg 768w\" sizes=\"auto, (max-width: 1080px) 100vw, 1080px\" \/>\n<h2>A practical workflow that works<\/h2>\n<p>Use this setup if your team wants less chaos.<\/p>\n<ol>\n<li><strong>During design:<\/strong> Keep rough notes and questions in Figma.<\/li>\n<li><strong>During review:<\/strong> Mark key decisions with clear annotations.<\/li>\n<li><strong>After approval:<\/strong> Move final decisions into a Notion log.<\/li>\n<li><strong>Before handoff:<\/strong> Link Notion pages back to exact Figma frames.<\/li>\n<li><strong>After release:<\/strong> update status to shipped.<\/li>\n<\/ol>\n<p>This keeps the work close to the design while it is moving. Then it gives final decisions a stable record.<\/p>\n<h2>Which one should your team pick?<\/h2>\n<p>If you are a solo designer, Figma may be enough at first. Add a small Notion page when decisions start repeating. If your team has engineers, product managers, and stakeholders, use both from the start.<\/p>\n<p>If your notes are mostly visual, start in Figma. If your notes affect policy, research, roadmap, or support, put them in Notion.<\/p>\n<p>The best setup is not fancy. It is clear. Figma answers, <em>\u201cWhat should this screen do?\u201d<\/em> Notion answers, <em>\u201cWhy did we decide that?\u201d<\/em><\/p>\n<p><strong>Keep pixels near pixels. Keep reasons where people can find them.<\/strong> That is the whole game.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Use Figma for notes tied to pixels. Use Notion for notes tied to people, process, and future memory. That is the clean split. If a decision changes what users see, &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"UI Notes: Figma vs Notion for Documenting UI Design Decisions\" class=\"read-more button\" href=\"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#more-15580\" aria-label=\"Read more about UI Notes: Figma vs Notion for Documenting UI Design Decisions\">Read more<\/a><\/p>\n","protected":false},"author":88,"featured_media":15441,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[495],"tags":[],"class_list":["post-15580","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","generate-columns","tablet-grid-50","mobile-grid-100","grid-parent","grid-50","no-featured-image-padding"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog\" \/>\n<meta property=\"og:description\" content=\"Use Figma for notes tied to pixels. Use Notion for notes tied to people, process, and future memory. That is the clean split. If a decision changes what users see, ... Read more\" \/>\n<meta property=\"og:url\" content=\"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/\" \/>\n<meta property=\"og:site_name\" content=\"Save the Video Blog\" \/>\n<meta property=\"article:published_time\" content=\"2026-09-25T12:28:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-25T12:40:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1080\" \/>\n\t<meta property=\"og:image:height\" content=\"1532\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jonathan Dough\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jonathan Dough\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/\"},\"author\":{\"name\":\"Jonathan Dough\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#\\\/schema\\\/person\\\/7af40201b760c80578ce2da4a3adf274\"},\"headline\":\"UI Notes: Figma vs Notion for Documenting UI Design Decisions\",\"datePublished\":\"2026-09-25T12:28:13+00:00\",\"dateModified\":\"2026-09-25T12:40:46+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/\"},\"wordCount\":1308,\"publisher\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\",\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/\",\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/\",\"name\":\"UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\",\"datePublished\":\"2026-09-25T12:28:13+00:00\",\"dateModified\":\"2026-09-25T12:40:46+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#primaryimage\",\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\",\"contentUrl\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/03\\\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg\",\"width\":1080,\"height\":1532},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"UI Notes: Figma vs Notion for Documenting UI Design Decisions\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/\",\"name\":\"Save the Video Blog\",\"description\":\"Everything you need to know about videos\",\"publisher\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#organization\",\"name\":\"Save the Video Blog\",\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/02\\\/cropped-stv-logo.png\",\"contentUrl\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/wp-content\\\/uploads\\\/2021\\\/02\\\/cropped-stv-logo.png\",\"width\":500,\"height\":119,\"caption\":\"Save the Video Blog\"},\"image\":{\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/#\\\/schema\\\/person\\\/7af40201b760c80578ce2da4a3adf274\",\"name\":\"Jonathan Dough\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g\",\"caption\":\"Jonathan Dough\"},\"url\":\"https:\\\/\\\/savethevideo.net\\\/blog\\\/author\\\/jonathand\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/","og_locale":"en_US","og_type":"article","og_title":"UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog","og_description":"Use Figma for notes tied to pixels. Use Notion for notes tied to people, process, and future memory. That is the clean split. If a decision changes what users see, ... Read more","og_url":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/","og_site_name":"Save the Video Blog","article_published_time":"2026-09-25T12:28:13+00:00","article_modified_time":"2026-09-25T12:40:46+00:00","og_image":[{"width":1080,"height":1532,"url":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg","type":"image\/jpeg"}],"author":"Jonathan Dough","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Jonathan Dough","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#article","isPartOf":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/"},"author":{"name":"Jonathan Dough","@id":"https:\/\/savethevideo.net\/blog\/#\/schema\/person\/7af40201b760c80578ce2da4a3adf274"},"headline":"UI Notes: Figma vs Notion for Documenting UI Design Decisions","datePublished":"2026-09-25T12:28:13+00:00","dateModified":"2026-09-25T12:40:46+00:00","mainEntityOfPage":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/"},"wordCount":1308,"publisher":{"@id":"https:\/\/savethevideo.net\/blog\/#organization"},"image":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#primaryimage"},"thumbnailUrl":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg","articleSection":["Blog"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/","url":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/","name":"UI Notes: Figma vs Notion for Documenting UI Design Decisions - Save the Video Blog","isPartOf":{"@id":"https:\/\/savethevideo.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#primaryimage"},"image":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#primaryimage"},"thumbnailUrl":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg","datePublished":"2026-09-25T12:28:13+00:00","dateModified":"2026-09-25T12:40:46+00:00","breadcrumb":{"@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#primaryimage","url":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg","contentUrl":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2026\/03\/desk-with-laptop-sticky-notes-and-sunlight-home-office-desk-with-documents-folder-laptop-calculator-organized-paperwork-system.jpg","width":1080,"height":1532},{"@type":"BreadcrumbList","@id":"https:\/\/savethevideo.net\/blog\/ui-notes-figma-vs-notion-for-documenting-ui-design-decisions\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/savethevideo.net\/blog\/"},{"@type":"ListItem","position":2,"name":"UI Notes: Figma vs Notion for Documenting UI Design Decisions"}]},{"@type":"WebSite","@id":"https:\/\/savethevideo.net\/blog\/#website","url":"https:\/\/savethevideo.net\/blog\/","name":"Save the Video Blog","description":"Everything you need to know about videos","publisher":{"@id":"https:\/\/savethevideo.net\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/savethevideo.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/savethevideo.net\/blog\/#organization","name":"Save the Video Blog","url":"https:\/\/savethevideo.net\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/savethevideo.net\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2021\/02\/cropped-stv-logo.png","contentUrl":"https:\/\/savethevideo.net\/blog\/wp-content\/uploads\/2021\/02\/cropped-stv-logo.png","width":500,"height":119,"caption":"Save the Video Blog"},"image":{"@id":"https:\/\/savethevideo.net\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/savethevideo.net\/blog\/#\/schema\/person\/7af40201b760c80578ce2da4a3adf274","name":"Jonathan Dough","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9afc32c64534e0fac8123f418680cd8c214b1c82b9a0e765b34eddf7636ede6d?s=96&d=monsterid&r=g","caption":"Jonathan Dough"},"url":"https:\/\/savethevideo.net\/blog\/author\/jonathand\/"}]}},"_links":{"self":[{"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/posts\/15580","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/users\/88"}],"replies":[{"embeddable":true,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/comments?post=15580"}],"version-history":[{"count":1,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/posts\/15580\/revisions"}],"predecessor-version":[{"id":15582,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/posts\/15580\/revisions\/15582"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/media\/15441"}],"wp:attachment":[{"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/media?parent=15580"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/categories?post=15580"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savethevideo.net\/blog\/wp-json\/wp\/v2\/tags?post=15580"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}