[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Flovable\u002Fflows":3,"content-store-meta":-1,"i-custom:bookmark":323},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":47,"showcases":300,"links":301,"dates":320},"\u002Fexamples\u002Fapps\u002Flovable\u002Fflows","detail","flows",true,{"title":9,"description":10,"og_image":11},"Lovable user flows examples - Nicelydone","Explore Lovable user flow examples. Preview the opening screens and steps for each task. Create apps and websites by chatting with AI","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fa58fb24d-0fa0-4677-9c25-6c3fd51e730f.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},"Lovable design examples","\u002Fexamples\u002Fapps\u002Flovable",{"label":23,"to":4},"Lovable 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},"Lovable","lovable","Create apps and websites by chatting with AI","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002F371498a3-d8de-4908-8af8-e73a603ffa34.png","https:\u002F\u002Flovable.dev",[35,39,43],{"id":36,"title":37,"slug":38},80,"Artificial Intelligence","artificial-intelligence",{"id":40,"title":41,"slug":42},7,"Web Development","web-development",{"id":44,"title":45,"slug":46},96,"No code","no-code",[48,73,93,115,139,157,179,196,212,235,255,277],{"uuid":49,"title":50,"canonical_path":4,"kind":51,"patterns_count":52,"categories":53,"screens":57,"app":72},"a6795f5f-3b88-43e8-bb2f-16b0429dba06","Onboarding","flow",6,[54],{"id":55,"title":50,"slug":56},45,"onboarding",[58,64,68],{"uuid":59,"title":29,"description":60,"image":11,"image_alt":61,"width":62,"height":63},"a58fb24d-0fa0-4677-9c25-6c3fd51e730f","Onboarding step where the user selects between a light and dark appearance theme before continuing.","Lovable from Lovable",3024,1758,{"uuid":65,"title":29,"description":66,"image":67,"image_alt":61,"width":62,"height":63},"1d52011b-d309-46eb-9818-ac7872370738","Onboarding step where the user enters their full name to set up their profile.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1d52011b-d309-46eb-9818-ac7872370738.png",{"uuid":69,"title":29,"description":70,"image":71,"image_alt":61,"width":62,"height":63},"5ee7f7d3-ea50-4615-861d-1dffa093c9e2","Account setup","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F5ee7f7d3-ea50-4615-861d-1dffa093c9e2.png",{"slug":30,"title":29,"logo":32},{"uuid":74,"title":75,"canonical_path":4,"kind":51,"patterns_count":52,"categories":76,"screens":77,"app":92},"fe5dc6bc-d2b8-46d7-a3b8-1e2a131b3fd2","Discovering connectors",[],[78,84,88],{"uuid":79,"title":80,"description":81,"image":82,"image_alt":83,"width":62,"height":63},"395b7638-5487-4686-9b10-d687155c33a9","Home | Lovable","Workspace settings","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F395b7638-5487-4686-9b10-d687155c33a9.png","Home | Lovable from Lovable",{"uuid":85,"title":80,"description":86,"image":87,"image_alt":83,"width":62,"height":63},"86f896e6-3f89-4a54-af58-4b4780810e53","Workspace settings Integration setup","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F86f896e6-3f89-4a54-af58-4b4780810e53.png",{"uuid":89,"title":80,"description":90,"image":91,"image_alt":83,"width":62,"height":63},"7a4dfd6c-0beb-43e6-8513-642c8f4d9001","Dashboard with a modal overlay where the user searches and browses third-party integrations like Google Docs, HubSpot, and Slack.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7a4dfd6c-0beb-43e6-8513-642c8f4d9001.png",{"slug":30,"title":29,"logo":32},{"uuid":94,"title":95,"canonical_path":4,"kind":51,"patterns_count":96,"categories":97,"screens":102,"app":114},"69647673-8e6a-4330-ab91-48aac2944b63","Creating portfolio project",8,[98],{"id":99,"title":100,"slug":101},20,"Creating project","create-project",[103,107,110],{"uuid":104,"title":29,"description":105,"image":106,"image_alt":61,"width":62,"height":63},"9ca71b78-5dfd-42d4-9b3d-d364e0f45d07","Conversational interface","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F9ca71b78-5dfd-42d4-9b3d-d364e0f45d07.png",{"uuid":108,"title":29,"description":105,"image":109,"image_alt":61,"width":62,"height":63},"181991b7-d0d0-474c-9462-d217e98ba23d","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F181991b7-d0d0-474c-9462-d217e98ba23d.png",{"uuid":111,"title":29,"description":112,"image":113,"image_alt":61,"width":62,"height":63},"d6342f72-84e9-40fe-ab9b-3ead5db535d4","Conversational UI","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd6342f72-84e9-40fe-ab9b-3ead5db535d4.png",{"slug":30,"title":29,"logo":32},{"uuid":116,"title":117,"canonical_path":4,"kind":51,"patterns_count":96,"categories":118,"screens":123,"app":138},"cefc5d6c-1d2b-47fc-81a6-9ba333d10145","Editing portfolio project",[119],{"id":120,"title":121,"slug":122},60,"Editing","edit",[124,130,134],{"uuid":125,"title":126,"description":127,"image":128,"image_alt":129,"width":62,"height":63},"0a6cf3d6-e03a-4430-89a3-162a798a542b","Portfolio Showcase - Lovable","AI generation interface where the user prompts an assistant to build and refine a portfolio website, viewing the live preview alongside the conversation history.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F0a6cf3d6-e03a-4430-89a3-162a798a542b.png","Portfolio Showcase - Lovable from Lovable",{"uuid":131,"title":126,"description":132,"image":133,"image_alt":129,"width":62,"height":63},"80421025-e8b9-4a71-b3f9-2791f82825c4","AI-powered application builder where the user prompts an assistant to generate and refine a portfolio website, viewing the live result in a side-by-side preview.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F80421025-e8b9-4a71-b3f9-2791f82825c4.png",{"uuid":135,"title":126,"description":136,"image":137,"image_alt":129,"width":62,"height":63},"9eb615b8-156d-4a2e-9cf1-3b0e05d29c7a","AI app builder where the user prompts an assistant to generate and refine a portfolio website, with a live preview alongside the chat.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F9eb615b8-156d-4a2e-9cf1-3b0e05d29c7a.png",{"slug":30,"title":29,"logo":32},{"uuid":140,"title":141,"canonical_path":4,"kind":51,"patterns_count":40,"categories":142,"screens":143,"app":156},"accaa121-8920-4592-a0ee-29393ec5f230","Previewing responsive site",[],[144,148,152],{"uuid":145,"title":126,"description":146,"image":147,"image_alt":129,"width":62,"height":63},"3754a956-d5bd-4577-b036-da1b2833bfe4","AI generation interface where the user prompts an assistant to build and modify a portfolio website with a live preview.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F3754a956-d5bd-4577-b036-da1b2833bfe4.png",{"uuid":149,"title":126,"description":150,"image":151,"image_alt":129,"width":62,"height":63},"cbf149bb-3204-44c4-9ec0-686fffb8c760","AI generation interface where the user prompts an assistant to add smooth scrolling to a portfolio website and views the live preview.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fcbf149bb-3204-44c4-9ec0-686fffb8c760.png",{"uuid":153,"title":126,"description":154,"image":155,"image_alt":129,"width":62,"height":63},"1fc54a19-6c3b-40a6-9cdd-34dcff6ab881","Chat interface","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1fc54a19-6c3b-40a6-9cdd-34dcff6ab881.png",{"slug":30,"title":29,"logo":32},{"uuid":158,"title":159,"canonical_path":4,"kind":51,"patterns_count":52,"categories":160,"screens":165,"app":178},"34c17ee8-aa58-4b66-a3ae-142ef69a9505","Configuring cloud services",[161],{"id":162,"title":163,"slug":164},71,"Settings","settings",[166,170,174],{"uuid":167,"title":126,"description":168,"image":169,"image_alt":129,"width":62,"height":63},"969f97cf-4409-4d68-a04c-8f698261f808","Dashboard overview for a project's cloud services, featuring navigation to AI, logs, and secrets, along with a prominent prompt to enable a managed Supabase backend.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F969f97cf-4409-4d68-a04c-8f698261f808.png",{"uuid":171,"title":126,"description":172,"image":173,"image_alt":129,"width":62,"height":63},"b978072d-f100-497d-917d-3897c3d3ec15","Settings page where the user can enable Lovable AI for their project through a managed gateway.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fb978072d-f100-497d-917d-3897c3d3ec15.png",{"uuid":175,"title":126,"description":176,"image":177,"image_alt":129,"width":62,"height":63},"ce173996-6471-412b-bf89-3196a55a1125","Project dashboard","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fce173996-6471-412b-bf89-3196a55a1125.png",{"slug":30,"title":29,"logo":32},{"uuid":180,"title":181,"canonical_path":4,"kind":51,"patterns_count":96,"categories":182,"screens":184,"app":195},"f8888de1-2e77-4472-a502-ded6af944975","Configuring app users",[183],{"id":162,"title":163,"slug":164},[185,189,192],{"uuid":186,"title":126,"description":187,"image":188,"image_alt":129,"width":62,"height":63},"6a9af337-da87-4274-bb7e-ae63067f8a42","User management","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F6a9af337-da87-4274-bb7e-ae63067f8a42.png",{"uuid":190,"title":126,"description":187,"image":191,"image_alt":129,"width":62,"height":63},"26808461-e43d-4de3-8e3a-d377fda860e5","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F26808461-e43d-4de3-8e3a-d377fda860e5.png",{"uuid":193,"title":126,"description":187,"image":194,"image_alt":129,"width":62,"height":63},"89661385-6606-498f-b56c-48891295c019","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F89661385-6606-498f-b56c-48891295c019.png",{"slug":30,"title":29,"logo":32},{"uuid":197,"title":198,"canonical_path":4,"kind":51,"patterns_count":52,"categories":199,"screens":203,"app":211},"c93d3f29-e01f-45c0-9a36-71dc5fe0dd0c","Configuring authentication",[200],{"id":52,"title":201,"slug":202},"Securing account","secure-account",[204,205,208],{"uuid":193,"title":126,"description":187,"image":194,"image_alt":129,"width":62,"height":63},{"uuid":206,"title":126,"description":187,"image":207,"image_alt":129,"width":62,"height":63},"716a0027-e7be-43be-a906-a447595b48e7","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F716a0027-e7be-43be-a906-a447595b48e7.png",{"uuid":209,"title":126,"description":187,"image":210,"image_alt":129,"width":62,"height":63},"55afddd8-b05a-44f3-b54b-e914fd3734bd","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F55afddd8-b05a-44f3-b54b-e914fd3734bd.png",{"slug":30,"title":29,"logo":32},{"uuid":213,"title":214,"canonical_path":4,"kind":51,"patterns_count":215,"categories":216,"screens":221,"app":234},"c200ae26-7568-42fd-bc6a-6ae55009d796","Publishing website",16,[217],{"id":218,"title":219,"slug":220},28,"Creating","create",[222,226,230],{"uuid":223,"title":126,"description":224,"image":225,"image_alt":129,"width":62,"height":63},"1b93c7aa-f11e-4052-85c0-1a051bc3e9cf","Design editor previewing a portfolio website with an open popover to configure the publish URL and add a custom domain.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F1b93c7aa-f11e-4052-85c0-1a051bc3e9cf.png",{"uuid":227,"title":126,"description":228,"image":229,"image_alt":129,"width":62,"height":63},"0617de57-00c8-4306-824e-c7f5ec82244a","Design editor where the user has opened the publish menu and is prompted to upgrade to a Pro plan to add a custom domain.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F0617de57-00c8-4306-824e-c7f5ec82244a.png",{"uuid":231,"title":126,"description":232,"image":233,"image_alt":129,"width":62,"height":63},"4c3b5875-9be9-4b25-a3b4-1918de5e9213","Access control","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F4c3b5875-9be9-4b25-a3b4-1918de5e9213.png",{"slug":30,"title":29,"logo":32},{"uuid":236,"title":237,"canonical_path":4,"kind":51,"patterns_count":238,"categories":239,"screens":241,"app":254},"ce0f214a-0c05-418b-ae4c-76b604acdef3","Editing visually",10,[240],{"id":120,"title":121,"slug":122},[242,246,250],{"uuid":243,"title":126,"description":244,"image":245,"image_alt":129,"width":62,"height":63},"6417ec6e-8d06-4e55-a7d2-50076709e441","Design editor where the user is in visual edits mode, selecting a header element on a generated portfolio website to modify via the AI composer.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F6417ec6e-8d06-4e55-a7d2-50076709e441.png",{"uuid":247,"title":126,"description":248,"image":249,"image_alt":129,"width":62,"height":63},"d5e079fb-e458-4cc9-844f-28d781b8c760","Design editor where the user modifies the typography and styling of an h1 element using an inspector panel and inline AI prompts.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd5e079fb-e458-4cc9-844f-28d781b8c760.png",{"uuid":251,"title":126,"description":252,"image":253,"image_alt":129,"width":62,"height":63},"76e6da6a-571f-4ce9-a952-ca66a7116743","Design editor where the user modifies the typography, colors, and spacing of a selected h1 element on a website canvas, with an AI prompt input for further modifications.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F76e6da6a-571f-4ce9-a952-ca66a7116743.png",{"slug":30,"title":29,"logo":32},{"uuid":256,"title":257,"canonical_path":4,"kind":51,"patterns_count":52,"categories":258,"screens":263,"app":276},"79858c90-6fa9-45b1-a157-7597e7b2753f","Updating copy",[259],{"id":260,"title":261,"slug":262},73,"Updating","update",[264,268,272],{"uuid":265,"title":126,"description":266,"image":267,"image_alt":129,"width":62,"height":63},"89fbcc28-c49f-4cba-8e8b-3d3675a8a5f5","Design editor where the user modifies text, typography, colors, and spacing of a selected element on a web page canvas, with an AI prompt input for further modifications.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F89fbcc28-c49f-4cba-8e8b-3d3675a8a5f5.png",{"uuid":269,"title":126,"description":270,"image":271,"image_alt":129,"width":62,"height":63},"da54a65a-512c-45f0-8de9-281fd75b3b62","AI generation interface where the user is building a portfolio website by prompting an assistant to change the copy and visual elements.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fda54a65a-512c-45f0-8de9-281fd75b3b62.png",{"uuid":273,"title":126,"description":274,"image":275,"image_alt":129,"width":62,"height":63},"e0a13ce9-69ed-4476-ae75-dcce4d7bd6bf","AI generation workspace where the user reviews a generated portfolio website and provides feedback via a chat sidebar with multiple-choice copy options.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fe0a13ce9-69ed-4476-ae75-dcce4d7bd6bf.png",{"slug":30,"title":29,"logo":32},{"uuid":278,"title":279,"canonical_path":4,"kind":51,"patterns_count":238,"categories":280,"screens":285,"app":299},"8a534c3c-f44e-413d-a6ea-dd3df56bc1ca","Connecting GitHub",[281],{"id":282,"title":283,"slug":284},62,"Connecting to integration","connect-to-integration",[286,292,295],{"uuid":287,"title":288,"description":289,"image":290,"image_alt":291,"width":62,"height":63},"60991e07-b8ee-45af-9f89-d89d194e5c90","Project settings - Lovable","Sidebar navigation","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F60991e07-b8ee-45af-9f89-d89d194e5c90.png","Project settings - Lovable from Lovable",{"uuid":293,"title":288,"description":81,"image":294,"image_alt":291,"width":62,"height":63},"841cfd05-6c88-4748-9d22-6cdb377809fd","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F841cfd05-6c88-4748-9d22-6cdb377809fd.png",{"uuid":296,"title":288,"description":297,"image":298,"image_alt":291,"width":62,"height":63},"d1fdcf86-2b6a-4d67-807c-2044db41b916","Integration setup","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fd1fdcf86-2b6a-4d67-807c-2044db41b916.png",{"slug":30,"title":29,"logo":32},[],[302,305,308,311,314,317],{"label":303,"to":304},"Lovable product screens","\u002Fexamples\u002Fapps\u002Flovable\u002Fscreens",{"label":306,"to":307},"Lovable marketing pages","\u002Fexamples\u002Fapps\u002Flovable\u002Fmarketing",{"label":309,"to":310},"Lovable UI components","\u002Fexamples\u002Fapps\u002Flovable\u002Fcomponents",{"label":312,"to":313},"Artificial Intelligence app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fartificial-intelligence",{"label":315,"to":316},"Web Development app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fweb-development",{"label":318,"to":319},"No code app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fno-code",{"published_at":321,"updated_at":322},"2026-05-17T07:59:14.000Z","2026-09-13T13:02:39.000Z",{"left":324,"top":324,"width":99,"height":99,"rotate":324,"vFlip":325,"hFlip":325,"body":326},0,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>"]