[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Funiverse\u002Fflows":3,"content-store-meta":-1,"i-custom:bookmark":340},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":47,"showcases":299,"links":300,"dates":337},"\u002Fexamples\u002Fapps\u002Funiverse\u002Fflows","detail","flows",true,{"title":9,"description":10,"og_image":11},"Universe user flows examples - Nicelydone","Explore Universe user flow examples. Preview the opening screens and steps for each task. Design Custom Sites with No Code","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F31118b87-2c20-4f5f-9862-1bdb712a9ed7.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},"Universe design examples","\u002Fexamples\u002Fapps\u002Funiverse",{"label":23,"to":4},"Universe user flows 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},"Universe","universe","Design Custom Sites with No Code","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fa1f738aa-4481-4f65-b6d7-49d68fb8a925.png","https:\u002F\u002Funiver.se",[35,39,43],{"id":36,"title":37,"slug":38},7,"Web Development","web-development",{"id":40,"title":41,"slug":42},8,"Design","design",{"id":44,"title":45,"slug":46},96,"No code","no-code",[48,65,88,112,125,150,175,195,218,241,261,279],{"uuid":49,"title":50,"canonical_path":4,"kind":51,"patterns_count":40,"categories":52,"screens":56,"app":64},"eebe8eea-1378-4de4-99a1-ffd102959b6c","Signing in","flow",[53],{"id":54,"title":50,"slug":55},61,"sign-in",[57],{"uuid":58,"title":59,"description":60,"image":11,"image_alt":61,"width":62,"height":63},"31118b87-2c20-4f5f-9862-1bdb712a9ed7","Sign In | Universe","User authentication Login page","Sign In | Universe from Universe",3024,1780,{"slug":30,"title":29,"logo":32},{"uuid":66,"title":67,"canonical_path":4,"kind":51,"patterns_count":68,"categories":69,"screens":73,"app":87},"bf129f05-b17a-4343-aa52-7f3b2db01d2a","Signing up",6,[70],{"id":71,"title":67,"slug":72},103,"signing-up",[74,80,84],{"uuid":75,"title":76,"description":77,"image":78,"image_alt":79,"width":62,"height":63},"5e1ebc08-4fdf-4ea1-ba22-ba15459179ac","Sign Up | Universe","Account creation Authentication","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F5e1ebc08-4fdf-4ea1-ba22-ba15459179ac.png","Sign Up | Universe from Universe",{"uuid":81,"title":76,"description":82,"image":83,"image_alt":79,"width":62,"height":63},"ba67d892-c9f0-4341-badd-c2573c35234b","Account creation","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fba67d892-c9f0-4341-badd-c2573c35234b.png",{"uuid":85,"title":76,"description":82,"image":86,"image_alt":79,"width":62,"height":63},"df986e82-e61b-4d6a-b0c4-215a1600e5df","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fdf986e82-e61b-4d6a-b0c4-215a1600e5df.png",{"slug":30,"title":29,"logo":32},{"uuid":89,"title":90,"canonical_path":4,"kind":51,"patterns_count":91,"categories":92,"screens":96,"app":111},"19d0c3ea-0396-43ca-87ee-208c71cf040f","Onboarding",35,[93],{"id":94,"title":90,"slug":95},45,"onboarding",[97,102,106],{"uuid":98,"title":29,"description":99,"image":100,"image_alt":101,"width":62,"height":63},"f931d230-d273-4e22-a91d-98548e7ee303","Onboarding step where the user searches for a unique website domain address to claim.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff931d230-d273-4e22-a91d-98548e7ee303.png","Universe from Universe",{"uuid":103,"title":29,"description":104,"image":105,"image_alt":101,"width":62,"height":63},"849f7244-c7e5-426c-8226-c4f94484452e","Onboarding step where the user searches for a unique website domain name to register.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F849f7244-c7e5-426c-8226-c4f94484452e.png",{"uuid":107,"title":29,"description":108,"image":109,"image_alt":101,"width":62,"height":110},"f1646e67-2f27-4265-a242-a51e09316ffb","Search page where the user browses available domain names and their prices to select one for their new website.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff1646e67-2f27-4265-a242-a51e09316ffb.png",5704,{"slug":30,"title":29,"logo":32},{"uuid":113,"title":114,"canonical_path":4,"kind":51,"patterns_count":68,"categories":115,"screens":120,"app":124},"b8823b2c-7806-4cc7-ae28-8b1f6433c7da","Searching for domain",[116],{"id":117,"title":118,"slug":119},43,"Searching","search",[121,122,123],{"uuid":98,"title":29,"description":99,"image":100,"image_alt":101,"width":62,"height":63},{"uuid":103,"title":29,"description":104,"image":105,"image_alt":101,"width":62,"height":63},{"uuid":107,"title":29,"description":108,"image":109,"image_alt":101,"width":62,"height":110},{"slug":30,"title":29,"logo":32},{"uuid":126,"title":127,"canonical_path":4,"kind":51,"patterns_count":128,"categories":129,"screens":134,"app":149},"665c63b6-40ce-4a39-85d4-9d9eefcbe6bd","Selecting template",12,[130],{"id":131,"title":132,"slug":133},82,"Selecting","select",[135,140,145],{"uuid":136,"title":29,"description":137,"image":138,"image_alt":101,"width":62,"height":139},"a009c366-c7d7-4e1a-9832-28719fb01093","Template selection","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa009c366-c7d7-4e1a-9832-28719fb01093.png",19144,{"uuid":141,"title":29,"description":142,"image":143,"image_alt":101,"width":62,"height":144},"e64b73c3-dc66-431a-a2be-522413854605","Onboarding step where the user selects a starting template, filtering options by commerce capability, purpose, vibe, and color.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe64b73c3-dc66-431a-a2be-522413854605.png",3826,{"uuid":146,"title":29,"description":147,"image":148,"image_alt":101,"width":62,"height":144},"645066d7-9eff-4da2-b05d-f16a5aac71ed","Onboarding step where the user filters and selects a starting website template by purpose, vibe, or color.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F645066d7-9eff-4da2-b05d-f16a5aac71ed.png",{"slug":30,"title":29,"logo":32},{"uuid":151,"title":152,"canonical_path":4,"kind":51,"patterns_count":128,"categories":153,"screens":158,"app":174},"ed2dc5c8-63d8-4ef8-aca0-756fac49d228","Editing site content",[154],{"id":155,"title":156,"slug":157},60,"Editing","edit",[159,166,170],{"uuid":160,"title":161,"description":162,"image":163,"image_alt":164,"width":62,"height":165},"4b949f07-8e3c-487e-a051-8355e2c08df6","Edit Page Home","Design editor where the user is building a grid-based website for an indie film premiere, with floating tools to add blocks and a top bar to publish.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F4b949f07-8e3c-487e-a051-8355e2c08df6.png","Edit Page Home from Universe",1982,{"uuid":167,"title":161,"description":168,"image":169,"image_alt":164,"width":62,"height":165},"2bf6b7cb-f3e8-4d57-a45f-9a62d4dfcd48","WYSIWYG editor","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F2bf6b7cb-f3e8-4d57-a45f-9a62d4dfcd48.png",{"uuid":171,"title":161,"description":172,"image":173,"image_alt":164,"width":62,"height":165},"3835b38d-8705-48b7-8e25-571b7816151f","Design editor where the user is modifying a text block on a grid-based canvas for an indie film premiere website.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F3835b38d-8705-48b7-8e25-571b7816151f.png",{"slug":30,"title":29,"logo":32},{"uuid":176,"title":177,"canonical_path":4,"kind":51,"patterns_count":36,"categories":178,"screens":183,"app":194},"5161fbca-64f2-453f-8afa-421fe20a4d88","Creating site",[179],{"id":180,"title":181,"slug":182},28,"Creating","create",[184,190],{"uuid":185,"title":186,"description":187,"image":188,"image_alt":189,"width":62,"height":63},"3e2a300d-2dec-4f87-b5fe-5a0d97e4b3db","Sites | Universe","List view where the user manages their created websites and can start a new project.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F3e2a300d-2dec-4f87-b5fe-5a0d97e4b3db.png","Sites | Universe from Universe",{"uuid":191,"title":29,"description":192,"image":193,"image_alt":101,"width":62,"height":63},"e1ad9eff-5742-4cbb-aeaa-22c6c9457485","Search page where the user looks for an available custom domain name to attach to their new website.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe1ad9eff-5742-4cbb-aeaa-22c6c9457485.png",{"slug":30,"title":29,"logo":32},{"uuid":196,"title":197,"canonical_path":4,"kind":51,"patterns_count":198,"categories":199,"screens":204,"app":217},"652fc1db-2b90-4915-988e-e98fdcbf675a","Setting up canvas",17,[200],{"id":201,"title":202,"slug":203},67,"Customizing","customize",[205,209,213],{"uuid":206,"title":161,"description":207,"image":208,"image_alt":164,"width":62,"height":63},"95a8c175-b0ab-4dde-ac2e-41e076ca479b","Design editor canvas showing an empty grid layout with options to add rows and publish the site.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F95a8c175-b0ab-4dde-ac2e-41e076ca479b.png",{"uuid":210,"title":161,"description":211,"image":212,"image_alt":164,"width":62,"height":63},"18284f6c-497d-4fa1-8f0d-443191b067c9","Design editor canvas where the user builds a page layout using a central grid system and floating toolbars.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F18284f6c-497d-4fa1-8f0d-443191b067c9.png",{"uuid":214,"title":161,"description":215,"image":216,"image_alt":164,"width":62,"height":63},"fea4095d-16dc-4691-8da2-cbe4be7f731f","Design editor canvas where the user configures grid layout properties like columns, background, and content resizing via a floating popover menu.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ffea4095d-16dc-4691-8da2-cbe4be7f731f.png",{"slug":30,"title":29,"logo":32},{"uuid":219,"title":220,"canonical_path":4,"kind":51,"patterns_count":221,"categories":222,"screens":227,"app":240},"a4f7ea1c-21bd-4975-99b2-e221e9aa96e4","Adding content blocks",14,[223],{"id":224,"title":225,"slug":226},80,"Adding","add",[228,232,236],{"uuid":229,"title":161,"description":230,"image":231,"image_alt":164,"width":62,"height":63},"1ab976f4-e97e-480e-858f-2e02fba06977","Design editor where the user selects a new block type like text, image, or video to add to their page canvas.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1ab976f4-e97e-480e-858f-2e02fba06977.png",{"uuid":233,"title":161,"description":234,"image":235,"image_alt":164,"width":62,"height":63},"baa4359d-7258-4966-ac5b-a25743cf3495","Design editor where the user selects a new content block like text, image, or video from a modal overlay to add to their page grid.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fbaa4359d-7258-4966-ac5b-a25743cf3495.png",{"uuid":237,"title":161,"description":238,"image":239,"image_alt":164,"width":62,"height":63},"f5e5d678-b75c-4510-a3f7-f93db4175b61","Design editor canvas where the user is picking a new block type from a central menu while a floating text-properties inspector is open on the right.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ff5e5d678-b75c-4510-a3f7-f93db4175b61.png",{"slug":30,"title":29,"logo":32},{"uuid":242,"title":243,"canonical_path":4,"kind":51,"patterns_count":244,"categories":245,"screens":247,"app":260},"91ecd72e-beee-4ab6-8d2c-14ae858c36dd","Editing text content",11,[246],{"id":155,"title":156,"slug":157},[248,252,256],{"uuid":249,"title":161,"description":250,"image":251,"image_alt":164,"width":62,"height":63},"04a63905-1b80-41a5-a258-f9173b5af98d","Grid Navigation bar Data management Table Editor","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F04a63905-1b80-41a5-a258-f9173b5af98d.png",{"uuid":253,"title":161,"description":254,"image":255,"image_alt":164,"width":62,"height":63},"1476d2ae-ef2c-4af8-8727-b27b6f068f34","Grid Content management Data management Data entry Table Editor","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1476d2ae-ef2c-4af8-8727-b27b6f068f34.png",{"uuid":257,"title":161,"description":258,"image":259,"image_alt":164,"width":62,"height":63},"441a0609-a764-4af2-abe7-10f5015e081e","Design editor where the user styles text inside a grid layout using a floating property inspector.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F441a0609-a764-4af2-abe7-10f5015e081e.png",{"slug":30,"title":29,"logo":32},{"uuid":262,"title":263,"canonical_path":4,"kind":51,"patterns_count":128,"categories":264,"screens":266,"app":278},"c8c7a404-6ea4-4db1-8ec5-6ae146627f76","Styling content",[265],{"id":201,"title":202,"slug":203},[267,271,275],{"uuid":268,"title":161,"description":269,"image":270,"image_alt":164,"width":62,"height":63},"96b8557a-3649-43ad-9d37-3c78a9e11f07","Design editor where the user customizes text styling, font, size, and alignment within a grid-based canvas.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F96b8557a-3649-43ad-9d37-3c78a9e11f07.png",{"uuid":272,"title":161,"description":273,"image":274,"image_alt":164,"width":62,"height":63},"381047fb-b9af-456d-b812-8dd9a56635ff","Website builder canvas where the user is editing text styles via a floating inspector panel.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F381047fb-b9af-456d-b812-8dd9a56635ff.png",{"uuid":276,"title":161,"description":168,"image":277,"image_alt":164,"width":62,"height":63},"0e5e3573-a89c-46a1-a9c8-0de5e52b0cb7","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F0e5e3573-a89c-46a1-a9c8-0de5e52b0cb7.png",{"slug":30,"title":29,"logo":32},{"uuid":280,"title":281,"canonical_path":4,"kind":51,"patterns_count":282,"categories":283,"screens":285,"app":298},"2e4c19fc-20cc-4134-b02a-4d3048a1014d","Building navigation",21,[284],{"id":155,"title":156,"slug":157},[286,290,294],{"uuid":287,"title":161,"description":288,"image":289,"image_alt":164,"width":62,"height":63},"9edc0b2d-50a4-4c14-adde-020cb6fe75be","Design editor canvas where the user constructs a page layout using a grid system and can publish the result.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F9edc0b2d-50a4-4c14-adde-020cb6fe75be.png",{"uuid":291,"title":161,"description":292,"image":293,"image_alt":164,"width":62,"height":63},"a9fdf787-4e2b-4895-9f9d-6a8fa0affb44","Design editor where the user constructs a page layout by filling cells in a large grid, with options to add rows and publish the result.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa9fdf787-4e2b-4895-9f9d-6a8fa0affb44.png",{"uuid":295,"title":161,"description":296,"image":297,"image_alt":164,"width":62,"height":63},"68eb1590-3aa5-49be-8e24-e84e1054cc7c","Page builder canvas where the user constructs a layout using a grid system and interacts with an open context menu to add or delete rows.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F68eb1590-3aa5-49be-8e24-e84e1054cc7c.png",{"slug":30,"title":29,"logo":32},[],[301,304,307,310,313,316,319,321,325,329,333],{"label":302,"to":303},"Universe product screens","\u002Fexamples\u002Fapps\u002Funiverse\u002Fscreens",{"label":305,"to":306},"Universe marketing pages","\u002Fexamples\u002Fapps\u002Funiverse\u002Fmarketing",{"label":308,"to":309},"Universe UI components","\u002Fexamples\u002Fapps\u002Funiverse\u002Fcomponents",{"label":311,"to":312},"Web Development app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fweb-development",{"label":314,"to":315},"Design app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdesign",{"label":317,"to":318},"No code app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fno-code",{"label":320,"to":18},"All SaaS app examples",{"label":322,"to":323,"description":324},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":326,"to":327,"description":328},"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":330,"to":331,"description":332},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":334,"to":335,"description":336},"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":338,"updated_at":339},"2026-01-31T20:30:43.000Z","2026-09-13T13:02:39.000Z",{"left":341,"top":341,"width":342,"height":342,"rotate":341,"vFlip":343,"hFlip":343,"body":344},0,20,false,"\u003Cg fill=\"none\">\u003Cpath d=\"M9.7334 2.41699H10.2666C11.3987 2.41699 12.2028 2.41737 12.832 2.46875C13.4526 2.51945 13.8371 2.61637 14.1416 2.77148C14.7531 3.08307 15.2509 3.57988 15.5625 4.19141C15.7176 4.49587 15.8136 4.88039 15.8643 5.50098C15.9157 6.13035 15.916 6.93496 15.916 8.06738V15.1338C15.916 15.6634 15.9153 16.0086 15.8926 16.2578C15.879 16.4067 15.8598 16.4744 15.8525 16.4971C15.8095 16.5461 15.7506 16.576 15.6855 16.5811C15.6634 16.5734 15.5976 16.5486 15.4697 16.4697C15.2568 16.3384 14.9804 16.1313 14.5566 15.8135L11.4102 13.4541C11.1193 13.236 10.8105 12.9878 10.4453 12.8916C10.1533 12.8147 9.84573 12.8147 9.55371 12.8916C9.18862 12.9879 8.88057 13.2361 8.58984 13.4541L5.44336 15.8135C5.01942 16.1314 4.74231 16.3384 4.5293 16.4697C4.40092 16.5489 4.33537 16.5735 4.31348 16.5811C4.24875 16.5759 4.18941 16.5468 4.14648 16.498C4.13942 16.4762 4.12019 16.4085 4.10645 16.2578C4.08375 16.0086 4.08301 15.6634 4.08301 15.1338V8.06738C4.08301 6.93498 4.08335 6.13034 4.13477 5.50098C4.18547 4.88035 4.28236 4.49588 4.4375 4.19141C4.74906 3.58004 5.24605 3.08305 5.85742 2.77148C6.16189 2.61635 6.54637 2.51946 7.16699 2.46875C7.79636 2.41734 8.60099 2.41699 9.7334 2.41699Z\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linejoin=\"round\"\u002F>\u003C\u002Fg>"]