[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fabstract\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":43,"showcases":346,"links":347,"dates":405},"\u002Fexamples\u002Fapps\u002Fabstract\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Abstract product screens examples - Nicelydone","Browse Abstract screen design examples. Preview the interface screenshots and explore related UI patterns. Design collaboration without the chaos","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_sign-in_2a03b492_nicelydone.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},"Abstract design examples","\u002Fexamples\u002Fapps\u002Fabstract",{"label":23,"to":4},"Abstract 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,"categories":34},"Abstract","abstract","Design collaboration without the chaos","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fabstract-8f937951.png","https:\u002F\u002Fwww.abstract.com\u002F",[35,39],{"id":36,"title":37,"slug":38},8,"Design","design",{"id":40,"title":41,"slug":42},23,"Collaboration","collaboration",[44,72,96,128,148,176,201,224,239,264,298,326],{"uuid":45,"title":29,"description":46,"canonical_path":4,"image":11,"width":47,"height":48,"image_alt":49,"kind":50,"patterns":51,"component_categories":61,"app":70},"7049055c-e0fd-4621-b394-2ee3582bf6bb","Sign-in screen where the user enters their email or username to continue.",3072,1716,"Abstract from Abstract","screen",[52],{"id":53,"label":54,"slug":55,"rank":56,"group":57},4,"Sign In","sign-in",0,{"id":58,"label":59,"slug":60},1,"Access & Account","access-and-account",[62,66],{"id":63,"title":64,"slug":65},174,"Card","card",{"id":67,"title":68,"slug":69},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":71},[],{"uuid":73,"title":29,"description":74,"canonical_path":4,"image":75,"width":47,"height":76,"image_alt":49,"kind":50,"patterns":77,"component_categories":87,"app":94},"f14ec299-4874-4b56-a2b0-89ec1a1bb5e7","Signup page where the user enters their email, name, and password to create a new account, with an option to opt into product news.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_sign-up_76b3109b_nicelydone.png",1962,[78,83],{"id":79,"label":80,"slug":81,"rank":56,"group":82},5,"Sign Up","sign-up",{"id":58,"label":59,"slug":60},{"id":58,"label":84,"slug":85,"rank":58,"group":86},"Account Setup","account-setup",{"id":58,"label":59,"slug":60},[88,92,93],{"id":89,"title":90,"slug":91},227,"Stepper","stepper",{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":95},[],{"uuid":97,"title":29,"description":98,"canonical_path":4,"image":99,"width":47,"height":100,"image_alt":49,"kind":50,"patterns":101,"component_categories":118,"app":126},"f0cbf455-e5b0-4744-b31c-b14d4f55ee90","Onboarding step where the user chooses to either join an existing organization or create a new one with a 30-day trial.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_sign-up_cdb2ab54_nicelydone.png",1746,[102,104,112],{"id":79,"label":80,"slug":81,"rank":56,"group":103},{"id":58,"label":59,"slug":60},{"id":105,"label":106,"slug":107,"rank":58,"group":108},74,"Onboarding Checklist","onboarding-checklist",{"id":109,"label":110,"slug":111},7,"Onboarding & Education","onboarding-and-education",{"id":113,"label":114,"slug":115,"rank":116,"group":117},75,"Setup Wizard","setup-wizard",2,{"id":109,"label":110,"slug":111},[119,120,124,125],{"id":89,"title":90,"slug":91},{"id":121,"title":122,"slug":123},260,"Badge","badge",{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":127},[],{"uuid":129,"title":130,"description":131,"canonical_path":4,"image":132,"width":47,"height":133,"image_alt":134,"kind":50,"patterns":135,"component_categories":141,"app":146},"73fdedf8-a430-4c74-afbb-63c13116b671","Welcome to Notebooks","In-app onboarding document explaining the features of Notebooks with illustrative graphics and a call to action to create a first notebook.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_home-product-logged_8714bd98_nicelydone.png",6042,"Welcome to Notebooks from Abstract",[136],{"id":137,"label":138,"slug":139,"rank":56,"group":140},77,"Welcome","welcome",{"id":109,"label":110,"slug":111},[142],{"id":143,"title":144,"slug":145},169,"Avatar","avatar",{"slug":30,"title":29,"logo":32,"categories":147},[],{"uuid":149,"title":130,"description":150,"canonical_path":4,"image":151,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":152,"component_categories":167,"app":174},"89f4ab1b-3e20-40ad-a978-0312908fa6cd","Rich text notebook editor where the user has opened the status dropdown to change the document's state from work in progress.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_dropdown-other-states_50a40f6f_nicelydone.png",[153,160],{"id":154,"label":155,"slug":156,"rank":56,"group":157},11,"Edit","edit",{"id":116,"label":158,"slug":159},"Actions","actions",{"id":161,"label":162,"slug":163,"rank":58,"group":164},42,"Form","form",{"id":53,"label":165,"slug":166},"Data & Analysis","data-and-analysis",[168,172,173],{"id":169,"title":170,"slug":171},277,"Button group","button-group",{"id":143,"title":144,"slug":145},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":175},[],{"uuid":177,"title":130,"description":178,"canonical_path":4,"image":179,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":180,"component_categories":193,"app":199},"28c5d9cf-1357-4bdb-ba6f-1a794a63cabc","Detail page for a design notebook where the user is creating a new review request via a right-side panel.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_create_03fb1eff_nicelydone.png",[181,188],{"id":182,"label":183,"slug":184,"rank":56,"group":185},110,"Notifications","notifications",{"id":154,"label":186,"slug":187},"Social & Collaboration","social-and-collaboration",{"id":189,"label":190,"slug":191,"rank":58,"group":192},3,"Profile","profile",{"id":154,"label":186,"slug":187},[194,195,196,197,198],{"id":169,"title":170,"slug":171},{"id":121,"title":122,"slug":123},{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":200},[],{"uuid":202,"title":130,"description":203,"canonical_path":4,"image":204,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":205,"component_categories":214,"app":222},"68de4cf7-603d-4490-a893-6253cdefb507","Detail page for a design notebook where the user is adding a decision via a modal overlay, with a review request panel visible in the background.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_create_modals-and-popovers_1da3b9f7_nicelydone.png",[206],{"id":207,"label":208,"slug":209,"rank":56,"group":210},127,"Review Queue","review-queue",{"id":211,"label":212,"slug":213},13,"Workflow & Automation","workflow-and-automation",[215,219,220,221],{"id":216,"title":217,"slug":218},284,"Modal","modal",{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":223},[],{"uuid":225,"title":130,"description":226,"canonical_path":4,"image":227,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":228,"component_categories":233,"app":237},"3377c13e-87c6-4d34-9c1b-2b7265d0aac5","Content editor where the user views a rich-text notebook and opens a side panel to draft a new review request.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_dropdown-other-states_navigation_4da1eb71_nicelydone.png",[229,231],{"id":137,"label":138,"slug":139,"rank":56,"group":230},{"id":109,"label":110,"slug":111},{"id":154,"label":155,"slug":156,"rank":58,"group":232},{"id":116,"label":158,"slug":159},[234,235,236],{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":238},[],{"uuid":240,"title":130,"description":241,"canonical_path":4,"image":242,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":243,"component_categories":254,"app":262},"13b61f56-1dfb-4565-8c6a-b7533866d5e5","Detail page where the user views a notebook document and fills out a form in the right sidebar to request a review from teammates.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_notifications_empty-state_dropdown-other-states_eed9c889_nicelydone.png",[244,252],{"id":245,"label":246,"slug":247,"rank":56,"group":248},121,"Request Access","request-access",{"id":249,"label":250,"slug":251},12,"States & Feedback","states-and-feedback",{"id":182,"label":183,"slug":184,"rank":58,"group":253},{"id":154,"label":186,"slug":187},[255,259,260,261],{"id":256,"title":257,"slug":258},214,"Popover","popover",{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":263},[],{"uuid":265,"title":266,"description":267,"canonical_path":4,"image":268,"width":47,"height":48,"image_alt":269,"kind":50,"patterns":270,"component_categories":291,"app":296},"bb705c58-adf1-4ce5-a081-08a3d20de48b","@bertrandbruandet","Home dashboard where the user can access recent notebooks, view pending review requests, and filter their notebooks by status.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_home-product-logged_75e1590b_nicelydone.png","@bertrandbruandet from Abstract",[271,276,280,287],{"id":272,"label":273,"slug":274,"rank":56,"group":275},41,"Dashboard","dashboard",{"id":53,"label":165,"slug":166},{"id":211,"label":277,"slug":278,"rank":58,"group":279},"Filter & Sort","filter-and-sort",{"id":116,"label":158,"slug":159},{"id":281,"label":282,"slug":283,"rank":116,"group":284},81,"Home","home",{"id":36,"label":285,"slug":286},"Pages & Content","pages-and-content",{"id":109,"label":288,"slug":289,"rank":189,"group":290},"Add & Create","add-and-create",{"id":116,"label":158,"slug":159},[292,293,294,295],{"id":121,"title":122,"slug":123},{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":297},[],{"uuid":299,"title":130,"description":300,"canonical_path":4,"image":301,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":302,"component_categories":320,"app":324},"c39cbfc5-d11f-4d42-8345-a57da1968c0a","Detail page where a user reads a notebook document and reviews a pending approval request in a side drawer.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_detail-page-single-page_a1c2277f_nicelydone.png",[303,305,310,315],{"id":281,"label":282,"slug":283,"rank":56,"group":304},{"id":36,"label":285,"slug":286},{"id":306,"label":307,"slug":308,"rank":58,"group":309},106,"Comments","comments",{"id":154,"label":186,"slug":187},{"id":311,"label":312,"slug":313,"rank":116,"group":314},123,"Approval Flow","approval-flow",{"id":211,"label":212,"slug":213},{"id":316,"label":317,"slug":318,"rank":189,"group":319},22,"Search","search",{"id":116,"label":158,"slug":159},[321,322,323],{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":325},[],{"uuid":327,"title":130,"description":328,"canonical_path":4,"image":329,"width":47,"height":48,"image_alt":134,"kind":50,"patterns":330,"component_categories":340,"app":344},"005a9840-7a46-4636-b123-9a7f865134af","Detail page where a user reads a notebook document and uses a right-hand drawer to approve, request changes, or leave a comment on a peer review.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fabstract_comments_13d4a1bb_nicelydone.png",[331,333,335],{"id":311,"label":312,"slug":313,"rank":56,"group":332},{"id":211,"label":212,"slug":213},{"id":306,"label":307,"slug":308,"rank":58,"group":334},{"id":154,"label":186,"slug":187},{"id":336,"label":337,"slug":338,"rank":116,"group":339},82,"Media Detail","media-detail",{"id":36,"label":285,"slug":286},[341,342,343],{"id":143,"title":144,"slug":145},{"id":63,"title":64,"slug":65},{"id":67,"title":68,"slug":69},{"slug":30,"title":29,"logo":32,"categories":345},[],[],[348,350,352,354,356,358,360,362,364,366,368,370,372,375,378,381,384,387,389,393,397,401],{"label":312,"to":349},"\u002Fexamples\u002Fscreens\u002Fapproval-flow",{"label":307,"to":351},"\u002Fexamples\u002Fscreens\u002Fcomments",{"label":155,"to":353},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":282,"to":355},"\u002Fexamples\u002Fscreens\u002Fhome",{"label":183,"to":357},"\u002Fexamples\u002Fscreens\u002Fnotifications",{"label":80,"to":359},"\u002Fexamples\u002Fscreens\u002Fsign-up",{"label":138,"to":361},"\u002Fexamples\u002Fscreens\u002Fwelcome",{"label":84,"to":363},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":288,"to":365},"\u002Fexamples\u002Fscreens\u002Fadd-and-create",{"label":273,"to":367},"\u002Fexamples\u002Fscreens\u002Fdashboard",{"label":277,"to":369},"\u002Fexamples\u002Fscreens\u002Ffilter-and-sort",{"label":162,"to":371},"\u002Fexamples\u002Fscreens\u002Fform",{"label":373,"to":374},"Abstract marketing pages","\u002Fexamples\u002Fapps\u002Fabstract\u002Fmarketing",{"label":376,"to":377},"Abstract user flows","\u002Fexamples\u002Fapps\u002Fabstract\u002Fflows",{"label":379,"to":380},"Abstract UI components","\u002Fexamples\u002Fapps\u002Fabstract\u002Fcomponents",{"label":382,"to":383},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":385,"to":386},"Collaboration app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcollaboration",{"label":388,"to":18},"All SaaS app examples",{"label":390,"to":391,"description":392},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":394,"to":395,"description":396},"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":398,"to":399,"description":400},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":402,"to":403,"description":404},"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":406,"updated_at":407},"2020-01-23T11:31:21.000Z","2026-09-13T13:02:39.000Z"]