[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fplaybook\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":55,"showcases":296,"links":297,"dates":352},"\u002Fexamples\u002Fapps\u002Fplaybook\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Playbook product screens examples - Nicelydone","Browse Playbook screen design examples. Preview the interface screenshots and explore related UI patterns. One place for all the best design thinking","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_sign-up_modals-and-popovers_035a9195_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},"Playbook design examples","\u002Fexamples\u002Fapps\u002Fplaybook",{"label":23,"to":4},"Playbook 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},"Playbook","playbook","One place for all the best design thinking","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fplaybook-9f70a0d7.png","https:\u002F\u002Faskplaybook.com",[35,39,43,47,51],{"id":36,"title":37,"slug":38},8,"Design","design",{"id":40,"title":41,"slug":42},25,"Marketing","marketing",{"id":44,"title":45,"slug":46},15,"Media and Entertainment","media-and-entertainment",{"id":48,"title":49,"slug":50},47,"Customer Service","customer-service",{"id":52,"title":53,"slug":54},30,"Productivity","productivity",[56,97,119,132,148,158,171,204,219,252,265,280],{"uuid":57,"title":58,"description":59,"canonical_path":4,"image":11,"width":60,"height":61,"image_alt":62,"kind":63,"patterns":64,"component_categories":82,"app":95},"8579c353-efff-4d3e-8cde-159933fa2547","Get your first Product Design job Collection - Playbook","Guide collection page where a modal prompts the user to sign up via email, Twitter, or Facebook in order to follow the product design content.",3072,1654,"Get your first Product Design job Collection - Playbook from Playbook","screen",[65,74],{"id":66,"label":67,"slug":68,"rank":69,"group":70},5,"Sign Up","sign-up",0,{"id":71,"label":72,"slug":73},1,"Access & Account","access-and-account",{"id":75,"label":76,"slug":77,"rank":71,"group":78},14,"Follow","follow",{"id":79,"label":80,"slug":81},2,"Actions","actions",[83,87,91],{"id":84,"title":85,"slug":86},258,"Header","header",{"id":88,"title":89,"slug":90},284,"Modal","modal",{"id":92,"title":93,"slug":94},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":96},[],{"uuid":98,"title":99,"description":100,"canonical_path":4,"image":101,"width":60,"height":61,"image_alt":102,"kind":63,"patterns":103,"component_categories":109,"app":117},"ac0b1eed-6d0e-42ef-899a-da3874e4973f","Playbook - Achieve your career goals","Landing page where a central modal prompts the user to sign in to the design community using email, Twitter, or Facebook.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_sign-in_modals-and-popovers_64339001_nicelydone.png","Playbook - Achieve your career goals from Playbook",[104],{"id":105,"label":106,"slug":107,"rank":69,"group":108},4,"Sign In","sign-in",{"id":71,"label":72,"slug":73},[110,111,115,116],{"id":84,"title":85,"slug":86},{"id":112,"title":113,"slug":114},174,"Card","card",{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":118},[],{"uuid":120,"title":99,"description":121,"canonical_path":4,"image":122,"width":60,"height":61,"image_alt":102,"kind":63,"patterns":123,"component_categories":126,"app":130},"32a63642-cc34-4482-b88e-b795a2dbd70d","Signup overlay where the user can join the platform using email, Twitter, or Facebook.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_sign-up_modals-and-popovers_f0a7fddf_nicelydone.png",[124],{"id":66,"label":67,"slug":68,"rank":69,"group":125},{"id":71,"label":72,"slug":73},[127,128,129],{"id":112,"title":113,"slug":114},{"id":88,"title":89,"slug":90},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":131},[],{"uuid":133,"title":29,"description":134,"canonical_path":4,"image":135,"width":60,"height":61,"image_alt":136,"kind":63,"patterns":137,"component_categories":144,"app":146},"1394d6ae-1556-4374-a69c-41e0fde12625","Signup page where the user creates a new account by providing an email and confirming a password.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_sign-up_d0999dc0_nicelydone.png","Playbook from Playbook",[138,140],{"id":66,"label":67,"slug":68,"rank":69,"group":139},{"id":71,"label":72,"slug":73},{"id":71,"label":141,"slug":142,"rank":71,"group":143},"Account Setup","account-setup",{"id":71,"label":72,"slug":73},[145],{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":147},[],{"uuid":149,"title":29,"description":150,"canonical_path":4,"image":151,"width":60,"height":61,"image_alt":136,"kind":63,"patterns":152,"component_categories":155,"app":156},"bc345449-d083-40ed-a3df-4f36ca3b658b","Sign-in screen where the user authenticates with their email and password.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_sign-in_e010862c_nicelydone.png",[153],{"id":105,"label":106,"slug":107,"rank":69,"group":154},{"id":71,"label":72,"slug":73},[],{"slug":30,"title":29,"logo":32,"categories":157},[],{"uuid":159,"title":29,"description":160,"canonical_path":4,"image":161,"width":60,"height":61,"image_alt":136,"kind":63,"patterns":162,"component_categories":167,"app":169},"1ef9e838-c7c4-4cdd-8226-09f381400856","Password recovery screen where the user enters their email address to initiate a reset link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_password-reset_19d2b8a0_nicelydone.png",[163],{"id":79,"label":164,"slug":165,"rank":69,"group":166},"Forgot Password","forgot-password",{"id":71,"label":72,"slug":73},[168],{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":170},[],{"uuid":172,"title":173,"description":174,"canonical_path":4,"image":175,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":177,"component_categories":188,"app":202},"3ae897cc-96b8-44b2-ade5-2b8845ced333","Playbook - Onboarding","Onboarding step where the user provides personal information like name, username, gender, location, and bio to set up their profile.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_7d4f3dee_nicelydone.png","Playbook - Onboarding from Playbook",[178,180],{"id":71,"label":141,"slug":142,"rank":69,"group":179},{"id":71,"label":72,"slug":73},{"id":181,"label":182,"slug":183,"rank":71,"group":184},3,"Profile","profile",{"id":185,"label":186,"slug":187},11,"Social & Collaboration","social-and-collaboration",[189,193,197,201],{"id":190,"title":191,"slug":192},240,"Horizontal navigation","horizontal-navigation",{"id":194,"title":195,"slug":196},169,"Avatar","avatar",{"id":198,"title":199,"slug":200},227,"Stepper","stepper",{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":203},[],{"uuid":205,"title":173,"description":206,"canonical_path":4,"image":207,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":208,"component_categories":213,"app":217},"eeb95deb-26fc-405c-811e-2eb4c7a7801b","Onboarding step where the user provides their personal information, including name, username, gender, location, and bio.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_cd76af07_nicelydone.png",[209,211],{"id":71,"label":141,"slug":142,"rank":69,"group":210},{"id":71,"label":72,"slug":73},{"id":181,"label":182,"slug":183,"rank":71,"group":212},{"id":185,"label":186,"slug":187},[214,215,216],{"id":194,"title":195,"slug":196},{"id":198,"title":199,"slug":200},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":218},[],{"uuid":220,"title":173,"description":221,"canonical_path":4,"image":222,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":223,"component_categories":245,"app":250},"f0a3fb13-bfdc-40e5-9b56-d4d37ea95b78","Onboarding step where the user provides their professional information, including job title and company, to complete their profile.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_e9beb08a_nicelydone.png",[224,232,234,241],{"id":225,"label":226,"slug":227,"rank":69,"group":228},74,"Onboarding Checklist","onboarding-checklist",{"id":229,"label":230,"slug":231},7,"Onboarding & Education","onboarding-and-education",{"id":181,"label":182,"slug":183,"rank":71,"group":233},{"id":185,"label":186,"slug":187},{"id":235,"label":236,"slug":237,"rank":79,"group":238},42,"Form","form",{"id":105,"label":239,"slug":240},"Data & Analysis","data-and-analysis",{"id":185,"label":242,"slug":243,"rank":181,"group":244},"Edit","edit",{"id":79,"label":80,"slug":81},[246,247,248,249],{"id":190,"title":191,"slug":192},{"id":194,"title":195,"slug":196},{"id":198,"title":199,"slug":200},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":251},[],{"uuid":253,"title":173,"description":254,"canonical_path":4,"image":255,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":256,"component_categories":259,"app":263},"74a6ad73-b21d-4513-a98e-5a4607eddd55","Onboarding step where the user provides their professional information, including job title, role type, and company.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_1c429f5f_nicelydone.png",[257],{"id":71,"label":141,"slug":142,"rank":69,"group":258},{"id":71,"label":72,"slug":73},[260,261,262],{"id":194,"title":195,"slug":196},{"id":198,"title":199,"slug":200},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":264},[],{"uuid":266,"title":173,"description":267,"canonical_path":4,"image":268,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":269,"component_categories":274,"app":278},"30dc78eb-d0ec-4375-8285-c898b9179365","Onboarding step where the user provides their professional information, featuring an autocomplete dropdown for selecting their company.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_d87dda9d_nicelydone.png",[270,272],{"id":71,"label":141,"slug":142,"rank":69,"group":271},{"id":71,"label":72,"slug":73},{"id":181,"label":182,"slug":183,"rank":71,"group":273},{"id":185,"label":186,"slug":187},[275,276,277],{"id":194,"title":195,"slug":196},{"id":198,"title":199,"slug":200},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":279},[],{"uuid":281,"title":173,"description":282,"canonical_path":4,"image":283,"width":60,"height":61,"image_alt":176,"kind":63,"patterns":284,"component_categories":289,"app":294},"be0a05ea-49bd-47fa-8687-3efde6ad2b32","Onboarding step where the user provides their professional info like job title, company type, and company size.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fplaybook_onboarding_dccde5d9_nicelydone.png",[285,287],{"id":225,"label":226,"slug":227,"rank":69,"group":286},{"id":229,"label":230,"slug":231},{"id":71,"label":141,"slug":142,"rank":71,"group":288},{"id":71,"label":72,"slug":73},[290,291,292,293],{"id":190,"title":191,"slug":192},{"id":194,"title":195,"slug":196},{"id":198,"title":199,"slug":200},{"id":92,"title":93,"slug":94},{"slug":30,"title":29,"logo":32,"categories":295},[],[],[298,300,302,304,306,308,310,312,314,316,319,322,325,328,331,334,336,340,344,348],{"label":141,"to":299},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":182,"to":301},"\u002Fexamples\u002Fscreens\u002Fprofile",{"label":67,"to":303},"\u002Fexamples\u002Fscreens\u002Fsign-up",{"label":226,"to":305},"\u002Fexamples\u002Fscreens\u002Fonboarding-checklist",{"label":106,"to":307},"\u002Fexamples\u002Fscreens\u002Fsign-in",{"label":242,"to":309},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":76,"to":311},"\u002Fexamples\u002Fscreens\u002Ffollow",{"label":164,"to":313},"\u002Fexamples\u002Fscreens\u002Fforgot-password",{"label":236,"to":315},"\u002Fexamples\u002Fscreens\u002Fform",{"label":317,"to":318},"Playbook marketing pages","\u002Fexamples\u002Fapps\u002Fplaybook\u002Fmarketing",{"label":320,"to":321},"Playbook user flows","\u002Fexamples\u002Fapps\u002Fplaybook\u002Fflows",{"label":323,"to":324},"Playbook UI components","\u002Fexamples\u002Fapps\u002Fplaybook\u002Fcomponents",{"label":326,"to":327},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":329,"to":330},"Marketing app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmarketing",{"label":332,"to":333},"Media and Entertainment app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmedia-and-entertainment",{"label":335,"to":18},"All SaaS app examples",{"label":337,"to":338,"description":339},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":341,"to":342,"description":343},"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":345,"to":346,"description":347},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":349,"to":350,"description":351},"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":353,"updated_at":354},"2017-08-07T21:59:12.000Z","2026-09-13T13:02:39.000Z"]