[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fmotion\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":52,"showcases":298,"links":299,"dates":358},"\u002Fexamples\u002Fapps\u002Fmotion\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Motion product screens examples - Nicelydone","Browse Motion screen design examples. Preview the interface screenshots and explore related UI patterns. Use AI to plan your work, automatically","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fc96b2879-faed-4cbb-a80a-1d91a14c0618.png",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Motion design examples","\u002Fexamples\u002Fapps\u002Fmotion",{"label":23,"to":4},"Motion product screens examples",{"title":23,"eyebrow":25,"description":10,"sections":26,"body":27},"SaaS app examples",[],[],{"title":29,"slug":30,"description":31,"logo":32,"url":33,"twitter_username":34,"categories":35},"Motion","motion","Use AI to plan your work, automatically","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fmotion-6fac92db.png","https:\u002F\u002Fwww.usemotion.com","usemotion",[36,40,44,48],{"id":37,"title":38,"slug":39},80,"Artificial Intelligence","artificial-intelligence",{"id":41,"title":42,"slug":43},29,"Task Management","task-management",{"id":45,"title":46,"slug":47},30,"Productivity","productivity",{"id":49,"title":50,"slug":51},101,"Calendar","calendar",[53,77,96,111,124,140,165,193,210,231,249,266],{"uuid":54,"title":29,"description":55,"canonical_path":4,"image":11,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":60,"component_categories":70,"app":75},"c96b2879-faed-4cbb-a80a-1d91a14c0618","Signup screen where the user can create an account using Google, Microsoft, Apple, or a work email address, accompanied by a social proof panel.",3024,1778,"Motion from Motion","screen",[61],{"id":62,"label":63,"slug":64,"rank":65,"group":66},5,"Sign Up","sign-up",0,{"id":67,"label":68,"slug":69},1,"Access & Account","access-and-account",[71],{"id":72,"title":73,"slug":74},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":76},[],{"uuid":78,"title":29,"description":79,"canonical_path":4,"image":80,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":81,"component_categories":92,"app":94},"4e1221a3-3f11-4f43-a48d-6e949131cf11","Signup page where the user can authenticate using Google, Microsoft, Apple, or email, alongside a social proof panel highlighting user volume and partner logos.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F4e1221a3-3f11-4f43-a48d-6e949131cf11.png",[82,84],{"id":62,"label":63,"slug":64,"rank":65,"group":83},{"id":67,"label":68,"slug":69},{"id":85,"label":86,"slug":87,"rank":67,"group":88},130,"Checkout","checkout",{"id":89,"label":90,"slug":91},14,"Payments & Checkout","payments-and-checkout",[93],{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":95},[],{"uuid":97,"title":29,"description":98,"canonical_path":4,"image":99,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":100,"component_categories":107,"app":109},"7e17f18a-7256-4bc3-82b0-89d36cfffcc1","Signup step where the user creates a password for their provided email address to continue account registration.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7e17f18a-7256-4bc3-82b0-89d36cfffcc1.png",[101,105],{"id":67,"label":102,"slug":103,"rank":65,"group":104},"Account Setup","account-setup",{"id":67,"label":68,"slug":69},{"id":62,"label":63,"slug":64,"rank":67,"group":106},{"id":67,"label":68,"slug":69},[108],{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":110},[],{"uuid":112,"title":29,"description":113,"canonical_path":4,"image":114,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":115,"component_categories":120,"app":122},"1867b5e1-c5a7-4796-b546-baf30d03ebdd","Signup step where the user creates a password for their specific email address.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1867b5e1-c5a7-4796-b546-baf30d03ebdd.png",[116,118],{"id":67,"label":102,"slug":103,"rank":65,"group":117},{"id":67,"label":68,"slug":69},{"id":62,"label":63,"slug":64,"rank":67,"group":119},{"id":67,"label":68,"slug":69},[121],{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":123},[],{"uuid":125,"title":29,"description":126,"canonical_path":4,"image":127,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":128,"component_categories":137,"app":138},"18c1016c-1e15-4ac2-a3ef-9615f39af7b7","App loading screen displaying a spinner and a preparing message before entering the workspace.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F18c1016c-1e15-4ac2-a3ef-9615f39af7b7.png",[129],{"id":130,"label":131,"slug":132,"rank":65,"group":133},120,"Loading","loading",{"id":134,"label":135,"slug":136},12,"States & Feedback","states-and-feedback",[],{"slug":30,"title":29,"logo":32,"categories":139},[],{"uuid":141,"title":29,"description":142,"canonical_path":4,"image":143,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":144,"component_categories":158,"app":163},"94265cf4-46e1-43f1-8183-1f80a8cfa4dc","Onboarding step where the user selects a subscription tier between Individual, Business Standard, and Business Pro to start their trial.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F94265cf4-46e1-43f1-8183-1f80a8cfa4dc.png",[145,153],{"id":146,"label":147,"slug":148,"rank":65,"group":149},89,"Pricing","pricing",{"id":150,"label":151,"slug":152},9,"Plans & Limits","plans-and-limits",{"id":154,"label":155,"slug":156,"rank":67,"group":157},88,"Feature Gate","feature-gate",{"id":150,"label":151,"slug":152},[159],{"id":160,"title":161,"slug":162},260,"Badge","badge",{"slug":30,"title":29,"logo":32,"categories":164},[],{"uuid":166,"title":29,"description":167,"canonical_path":4,"image":168,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":169,"component_categories":180,"app":191},"b695632f-349d-4fc0-a324-3f96cbfc9087","Checkout page where the user enters credit card details to start a 7-day free trial of the Team Plan, featuring a timeline of the trial lifecycle.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fb695632f-349d-4fc0-a324-3f96cbfc9087.png",[170,175,177],{"id":171,"label":172,"slug":173,"rank":65,"group":174},91,"Trial","trial",{"id":150,"label":151,"slug":152},{"id":85,"label":86,"slug":87,"rank":67,"group":176},{"id":89,"label":90,"slug":91},{"id":146,"label":147,"slug":148,"rank":178,"group":179},2,{"id":150,"label":151,"slug":152},[181,182,186,190],{"id":160,"title":161,"slug":162},{"id":183,"title":184,"slug":185},240,"Horizontal navigation","horizontal-navigation",{"id":187,"title":188,"slug":189},174,"Card","card",{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":192},[],{"uuid":194,"title":29,"description":195,"canonical_path":4,"image":196,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":197,"component_categories":204,"app":208},"1b87a1cb-73f8-48c9-bf68-80b602f90a33","Checkout page where the user enters payment details to start a 7-day free trial of the Team Plan, with a timeline and feature list in the sidebar.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1b87a1cb-73f8-48c9-bf68-80b602f90a33.png",[198,200,202],{"id":171,"label":172,"slug":173,"rank":65,"group":199},{"id":150,"label":151,"slug":152},{"id":146,"label":147,"slug":148,"rank":67,"group":201},{"id":150,"label":151,"slug":152},{"id":85,"label":86,"slug":87,"rank":178,"group":203},{"id":89,"label":90,"slug":91},[205,206,207],{"id":183,"title":184,"slug":185},{"id":187,"title":188,"slug":189},{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":209},[],{"uuid":211,"title":29,"description":212,"canonical_path":4,"image":213,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":214,"component_categories":224,"app":229},"d5b53aa8-1b2d-44b6-be33-ca9b146f04ab","Checkout screen where the user selects their team size, billing cycle, and enters payment details to start a 7-day free trial.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd5b53aa8-1b2d-44b6-be33-ca9b146f04ab.png",[215,217,219],{"id":171,"label":172,"slug":173,"rank":65,"group":216},{"id":150,"label":151,"slug":152},{"id":146,"label":147,"slug":148,"rank":67,"group":218},{"id":150,"label":151,"slug":152},{"id":220,"label":221,"slug":222,"rank":178,"group":223},131,"Payment Form","payment-form",{"id":89,"label":90,"slug":91},[225,226,227,228],{"id":160,"title":161,"slug":162},{"id":183,"title":184,"slug":185},{"id":187,"title":188,"slug":189},{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":230},[],{"uuid":232,"title":29,"description":233,"canonical_path":4,"image":234,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":235,"component_categories":242,"app":247},"cdc2c2e4-d9df-4201-9042-8d2dfac33015","Checkout page where the user enters payment details to start a 7-day free trial for a Team Plan.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fcdc2c2e4-d9df-4201-9042-8d2dfac33015.png",[236,238,240],{"id":85,"label":86,"slug":87,"rank":65,"group":237},{"id":89,"label":90,"slug":91},{"id":171,"label":172,"slug":173,"rank":67,"group":239},{"id":150,"label":151,"slug":152},{"id":146,"label":147,"slug":148,"rank":178,"group":241},{"id":150,"label":151,"slug":152},[243,244,245,246],{"id":160,"title":161,"slug":162},{"id":183,"title":184,"slug":185},{"id":187,"title":188,"slug":189},{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":248},[],{"uuid":250,"title":29,"description":251,"canonical_path":4,"image":252,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":253,"component_categories":260,"app":264},"ca75a6d7-bd19-474d-8284-a8c416971cb7","Checkout page where the user activates a 7-day free trial by selecting a billing cycle, choosing a seat count, and entering payment details alongside a timeline of the trial phases.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fca75a6d7-bd19-474d-8284-a8c416971cb7.png",[254,256,258],{"id":85,"label":86,"slug":87,"rank":65,"group":255},{"id":89,"label":90,"slug":91},{"id":171,"label":172,"slug":173,"rank":67,"group":257},{"id":150,"label":151,"slug":152},{"id":220,"label":221,"slug":222,"rank":178,"group":259},{"id":89,"label":90,"slug":91},[261,262,263],{"id":183,"title":184,"slug":185},{"id":187,"title":188,"slug":189},{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":265},[],{"uuid":267,"title":29,"description":268,"canonical_path":4,"image":269,"width":56,"height":57,"image_alt":58,"kind":59,"patterns":270,"component_categories":292,"app":296},"f16272e3-6c66-4c53-a09c-39cf30dbec76","Onboarding step where the user selects how they heard about Motion for Teams from a vertical list of radio options.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff16272e3-6c66-4c53-a09c-39cf30dbec76.png",[271,279,287],{"id":272,"label":273,"slug":274,"rank":65,"group":275},74,"Onboarding Checklist","onboarding-checklist",{"id":276,"label":277,"slug":278},7,"Onboarding & Education","onboarding-and-education",{"id":280,"label":281,"slug":282,"rank":67,"group":283},42,"Form","form",{"id":284,"label":285,"slug":286},4,"Data & Analysis","data-and-analysis",{"id":288,"label":289,"slug":290,"rank":178,"group":291},117,"Feedback","feedback",{"id":134,"label":135,"slug":136},[293,294,295],{"id":183,"title":184,"slug":185},{"id":187,"title":188,"slug":189},{"id":72,"title":73,"slug":74},{"slug":30,"title":29,"logo":32,"categories":297},[],[],[300,302,304,306,308,310,312,314,316,318,320,322,325,328,331,334,337,340,342,346,350,354],{"label":86,"to":301},"\u002Fexamples\u002Fscreens\u002Fcheckout",{"label":147,"to":303},"\u002Fexamples\u002Fscreens\u002Fpricing",{"label":172,"to":305},"\u002Fexamples\u002Fscreens\u002Ftrial",{"label":63,"to":307},"\u002Fexamples\u002Fscreens\u002Fsign-up",{"label":102,"to":309},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":221,"to":311},"\u002Fexamples\u002Fscreens\u002Fpayment-form",{"label":155,"to":313},"\u002Fexamples\u002Fscreens\u002Ffeature-gate",{"label":289,"to":315},"\u002Fexamples\u002Fscreens\u002Ffeedback",{"label":281,"to":317},"\u002Fexamples\u002Fscreens\u002Fform",{"label":131,"to":319},"\u002Fexamples\u002Fscreens\u002Floading",{"label":273,"to":321},"\u002Fexamples\u002Fscreens\u002Fonboarding-checklist",{"label":323,"to":324},"Motion marketing pages","\u002Fexamples\u002Fapps\u002Fmotion\u002Fmarketing",{"label":326,"to":327},"Motion user flows","\u002Fexamples\u002Fapps\u002Fmotion\u002Fflows",{"label":329,"to":330},"Motion UI components","\u002Fexamples\u002Fapps\u002Fmotion\u002Fcomponents",{"label":332,"to":333},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":335,"to":336},"Task Management app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Ftask-management",{"label":338,"to":339},"Productivity app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fproductivity",{"label":341,"to":18},"All SaaS app examples",{"label":343,"to":344,"description":345},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":347,"to":348,"description":349},"SaaS marketing page examples","\u002Fexamples\u002Fpages","Browse real SaaS marketing pages grouped by page type, from landing pages to pricing and customer story pages.",{"label":351,"to":352,"description":353},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":355,"to":356,"description":357},"User flow examples from SaaS apps","\u002Fexamples\u002Fflows","Explore user flow examples for sign-up, onboarding, billing, and other SaaS tasks. Compare the order of screens and preview the opening steps from real apps.",{"published_at":359,"updated_at":360},"2025-02-07T17:12:07.000Z","2026-09-13T13:02:39.000Z"]