[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fwith":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"app":34,"examples":45,"showcases":46,"links":320,"dates":352},"\u002Fexamples\u002Fapps\u002Fwith","detail","apps",true,{"title":9,"description":10,"og_image":11},"With design examples - Nicelydone","Explore With UI design examples. A virtual office for your remote team.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_sign-in_cb7bf818_nicelydone.png",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":4},"With design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":33},"SaaS app examples",[24],{"title":25,"links":26},"Explore With",[27,30],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Fwith\u002Fscreens",{"label":31,"to":32},"marketing pages","\u002Fexamples\u002Fapps\u002Fwith\u002Fmarketing",[],{"title":35,"slug":36,"description":37,"logo":38,"url":39,"categories":40},"With","with","A virtual office for your remote team.","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fwith-c7410535.png","https:\u002F\u002Fwith.so\u002F",[41],{"id":42,"title":43,"slug":44},23,"Collaboration","collaboration",[],[47,317],{"family":48,"examples":49},"screens",[50,74,92,105,122,149,168,194,218,244,266,282],{"uuid":51,"title":35,"description":52,"canonical_path":29,"image":11,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":57,"component_categories":67,"app":72},"f35ecdf6-a6aa-4236-89f5-2c10a06b020e","Sign-in screen where the user enters their email address to authenticate, featuring a large decorative key illustration on the right.",3072,1654,"With from With","screen",[58],{"id":59,"label":60,"slug":61,"rank":62,"group":63},4,"Sign In","sign-in",0,{"id":64,"label":65,"slug":66},1,"Access & Account","access-and-account",[68],{"id":69,"title":70,"slug":71},175,"Button","button",{"slug":36,"title":35,"logo":38,"categories":73},[],{"uuid":75,"title":35,"description":76,"canonical_path":29,"image":77,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":78,"component_categories":88,"app":90},"b93d82ed-8cdd-4c21-a75c-0e325a316a64","Sign-up screen where the user enters their name and email to join the early access program, featuring a large thematic illustration.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_sign-up_d0c1e464_nicelydone.png",[79,84],{"id":80,"label":81,"slug":82,"rank":62,"group":83},5,"Sign Up","sign-up",{"id":64,"label":65,"slug":66},{"id":64,"label":85,"slug":86,"rank":64,"group":87},"Account Setup","account-setup",{"id":64,"label":65,"slug":66},[89],{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":91},[],{"uuid":93,"title":35,"description":94,"canonical_path":29,"image":95,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":96,"component_categories":102,"app":103},"418416d2-baef-45ec-9c02-519a75d625d0","Verification screen where the user is instructed to check their email for a confirmation link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_sign-up_16e06517_nicelydone.png",[97],{"id":98,"label":99,"slug":100,"rank":62,"group":101},6,"Verification","verification",{"id":64,"label":65,"slug":66},[],{"slug":36,"title":35,"logo":38,"categories":104},[],{"uuid":106,"title":35,"description":107,"canonical_path":29,"image":108,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":109,"component_categories":118,"app":120},"ee152f07-19a1-4b09-a97a-dbd90aa8b5db","Onboarding step where the user names their new room, with a pre-filled suggestion provided.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_create_onboarding_94cef08f_nicelydone.png",[110],{"id":111,"label":112,"slug":113,"rank":62,"group":114},75,"Setup Wizard","setup-wizard",{"id":115,"label":116,"slug":117},7,"Onboarding & Education","onboarding-and-education",[119],{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":121},[],{"uuid":123,"title":35,"description":124,"canonical_path":29,"image":125,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":126,"component_categories":145,"app":147},"eefa2738-e0ec-4dee-a9bc-cefc9e994582","Onboarding step where the user invites teammates by entering an email address, with an option to skip.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_team_onboarding_1d5fe5a7_nicelydone.png",[127,135,143],{"id":128,"label":129,"slug":130,"rank":62,"group":131},133,"Invite Teammates","invite-teammates",{"id":132,"label":133,"slug":134},2,"Actions","actions",{"id":136,"label":137,"slug":138,"rank":64,"group":139},104,"Team Management","team-management",{"id":140,"label":141,"slug":142},10,"Settings & Admin","settings-and-admin",{"id":64,"label":85,"slug":86,"rank":132,"group":144},{"id":64,"label":65,"slug":66},[146],{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":148},[],{"uuid":150,"title":35,"description":151,"canonical_path":29,"image":152,"width":53,"height":54,"image_alt":55,"kind":56,"patterns":153,"component_categories":160,"app":166},"33d9d03f-de4e-4e03-bc50-0afd33d7ba5b","Onboarding step where the user invites teammates by entering their email addresses, viewing a list of pending invites below.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_team_onboarding_44571e44_nicelydone.png",[154,156,158],{"id":128,"label":129,"slug":130,"rank":62,"group":155},{"id":132,"label":133,"slug":134},{"id":111,"label":112,"slug":113,"rank":64,"group":157},{"id":115,"label":116,"slug":117},{"id":136,"label":137,"slug":138,"rank":132,"group":159},{"id":140,"label":141,"slug":142},[161,165],{"id":162,"title":163,"slug":164},169,"Avatar","avatar",{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":167},[],{"uuid":169,"title":35,"description":170,"canonical_path":29,"image":171,"width":53,"height":172,"image_alt":55,"kind":56,"patterns":173,"component_categories":182,"app":192},"834c59de-1d10-4229-95a8-16f14341829e","Home screen where the user can create a new virtual room or join their existing rooms.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_home-product-logged_ac65ecca_nicelydone.png",1726,[174],{"id":175,"label":176,"slug":177,"rank":62,"group":178},81,"Home","home",{"id":179,"label":180,"slug":181},8,"Pages & Content","pages-and-content",[183,187,191],{"id":184,"title":185,"slug":186},240,"Horizontal navigation","horizontal-navigation",{"id":188,"title":189,"slug":190},174,"Card","card",{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":193},[],{"uuid":195,"title":196,"description":197,"canonical_path":29,"image":198,"width":53,"height":172,"image_alt":199,"kind":56,"patterns":200,"component_categories":208,"app":216},"45763b2f-61ff-4efc-b4f0-451e9bf7d156","With interface screen","Home screen where the user can create a new room or access support, feedback, and legal links via an open user menu.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_navigation_dropdown-other-states_ab7d5e86_nicelydone.png","Interface screen from With",[201,203],{"id":175,"label":176,"slug":177,"rank":62,"group":202},{"id":179,"label":180,"slug":181},{"id":204,"label":205,"slug":206,"rank":64,"group":207},94,"Account Settings","account-settings",{"id":140,"label":141,"slug":142},[209,213,214,215],{"id":210,"title":211,"slug":212},260,"Badge","badge",{"id":184,"title":185,"slug":186},{"id":188,"title":189,"slug":190},{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":217},[],{"uuid":219,"title":35,"description":220,"canonical_path":29,"image":221,"width":53,"height":172,"image_alt":55,"kind":56,"patterns":222,"component_categories":238,"app":242},"51577ba8-bc9a-46ff-9951-e6ec18aebae1","Home screen where the user can create a new room or manage their existing room, with options to invite members, rename, or delete the space.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_actions_dropdown-other-states_60624b36_nicelydone.png",[223,225,227,232],{"id":175,"label":176,"slug":177,"rank":62,"group":224},{"id":179,"label":180,"slug":181},{"id":128,"label":129,"slug":130,"rank":64,"group":226},{"id":132,"label":133,"slug":134},{"id":228,"label":229,"slug":230,"rank":132,"group":231},11,"Edit","edit",{"id":132,"label":133,"slug":134},{"id":233,"label":234,"slug":235,"rank":236,"group":237},9,"Delete","delete",3,{"id":132,"label":133,"slug":134},[239,240,241],{"id":184,"title":185,"slug":186},{"id":188,"title":189,"slug":190},{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":243},[],{"uuid":245,"title":35,"description":246,"canonical_path":29,"image":247,"width":53,"height":172,"image_alt":55,"kind":56,"patterns":248,"component_categories":259,"app":264},"073dcdef-c73d-4ddc-bb08-2e11bcfd8ad4","List view where a confirmation modal requires the user to type the name of a design room to permanently delete it.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_delete_modals-and-popovers_acc97108_nicelydone.png",[249,257],{"id":250,"label":251,"slug":252,"rank":62,"group":253},114,"Confirmation","confirmation",{"id":254,"label":255,"slug":256},12,"States & Feedback","states-and-feedback",{"id":233,"label":234,"slug":235,"rank":64,"group":258},{"id":132,"label":133,"slug":134},[260,261,262,263],{"id":210,"title":211,"slug":212},{"id":184,"title":185,"slug":186},{"id":188,"title":189,"slug":190},{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":265},[],{"uuid":267,"title":268,"description":269,"canonical_path":29,"image":270,"width":53,"height":172,"image_alt":271,"kind":56,"patterns":272,"component_categories":278,"app":280},"b234ec78-b8b6-43a1-a5a6-9f8e410e19c8","Bertrand's room ","Onboarding step where the user is prompted to grant microphone and camera access to their browser before proceeding.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_settings_20c766c5_nicelydone.png","Bertrand's room  from With",[273],{"id":274,"label":275,"slug":276,"rank":62,"group":277},121,"Request Access","request-access",{"id":254,"label":255,"slug":256},[279],{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":281},[],{"uuid":283,"title":284,"description":285,"canonical_path":29,"image":286,"width":53,"height":172,"image_alt":287,"kind":56,"patterns":288,"component_categories":308,"app":315},"3025d433-c6e3-4a87-8246-f119e581d8bd","Bertrand's room","Pre-call lobby where the user sets their display name, tests their camera and microphone, and previews their avatar before entering a virtual room.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fwith_create_3d7d2da9_nicelydone.png","Bertrand's room from With",[289,291,298,303],{"id":64,"label":85,"slug":86,"rank":62,"group":290},{"id":64,"label":65,"slug":66},{"id":292,"label":293,"slug":294,"rank":64,"group":295},58,"Media Editor","media-editor",{"id":80,"label":296,"slug":297},"Media & Tools","media-and-tools",{"id":299,"label":300,"slug":301,"rank":132,"group":302},61,"Video Player","video-player",{"id":80,"label":296,"slug":297},{"id":304,"label":305,"slug":306,"rank":236,"group":307},77,"Welcome","welcome",{"id":115,"label":116,"slug":117},[309,313,314],{"id":310,"title":311,"slug":312},277,"Button group","button-group",{"id":162,"title":163,"slug":164},{"id":69,"title":70,"slug":71},{"slug":36,"title":35,"logo":38,"categories":316},[],{"family":318,"examples":319},"pages",[],[321,323,325,328,331,334,336,340,344,348],{"label":322,"to":29},"With product screens",{"label":324,"to":32},"With marketing pages",{"label":326,"to":327},"With user flows","\u002Fexamples\u002Fapps\u002Fwith\u002Fflows",{"label":329,"to":330},"With UI components","\u002Fexamples\u002Fapps\u002Fwith\u002Fcomponents",{"label":332,"to":333},"Collaboration app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fcollaboration",{"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},"2021-03-17T20:48:35.000Z","2026-09-13T13:02:39.000Z"]