[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fheroku":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"app":34,"examples":49,"showcases":50,"links":301,"dates":336},"\u002Fexamples\u002Fapps\u002Fheroku","detail","apps",true,{"title":9,"description":10,"og_image":11},"Heroku design examples - Nicelydone","Explore Heroku UI design examples. Cloud application platform","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_sign-in_b22fab81_nicelydone.jpg",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":4},"Heroku design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":33},"SaaS app examples",[24],{"title":25,"links":26},"Explore Heroku",[27,30],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Fheroku\u002Fscreens",{"label":31,"to":32},"marketing pages","\u002Fexamples\u002Fapps\u002Fheroku\u002Fmarketing",[],{"title":35,"slug":36,"description":37,"logo":38,"url":39,"twitter_username":35,"categories":40},"Heroku","heroku","Cloud application platform","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fheroku-bf6c5a88.png","https:\u002F\u002Fwww.heroku.com",[41,45],{"id":42,"title":43,"slug":44},7,"Web Development","web-development",{"id":46,"title":47,"slug":48},48,"Developer Tools","developer-tools",[],[51,298],{"family":52,"examples":53},"screens",[54,66,94,111,133,145,160,170,208,223,234,277],{"uuid":55,"title":56,"description":57,"canonical_path":29,"image":11,"width":58,"height":59,"image_alt":60,"kind":61,"patterns":62,"component_categories":63,"app":64},"e22e3798-1543-4930-b17f-f0f433a476e1","Sign in","Authentication User authentication Form Account management",2800,1632,"Sign in from Heroku","screen",[],[],{"slug":36,"title":35,"logo":38,"categories":65},[],{"uuid":67,"title":68,"description":69,"canonical_path":29,"image":70,"width":58,"height":71,"image_alt":72,"kind":61,"patterns":73,"component_categories":83,"app":92},"de000baf-4ad8-4154-a21c-a8c7c88c6c31","Password reset","Password recovery screen where the user enters their email address to receive a reset link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_password-reset_43494391_nicelydone.jpg",1618,"Password reset from Heroku",[74],{"id":75,"label":76,"slug":77,"rank":78,"group":79},2,"Forgot Password","forgot-password",0,{"id":80,"label":81,"slug":82},1,"Access & Account","access-and-account",[84,88],{"id":85,"title":86,"slug":87},174,"Card","card",{"id":89,"title":90,"slug":91},175,"Button","button",{"slug":36,"title":35,"logo":38,"categories":93},[],{"uuid":95,"title":96,"description":97,"canonical_path":29,"image":98,"width":58,"height":99,"image_alt":100,"kind":61,"patterns":101,"component_categories":107,"app":109},"10861e88-eaae-40dc-9eda-69ac47ee8c06","Sign up","Signup page where the user creates a free account by providing their name, email, company, country, and primary development language alongside a list of platform benefits.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_sign-up-4_0ca56e0a_nicelydone.jpg",2076,"Sign up from Heroku",[102],{"id":103,"label":104,"slug":105,"rank":78,"group":106},5,"Sign Up","sign-up",{"id":80,"label":81,"slug":82},[108],{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":110},[],{"uuid":112,"title":96,"description":113,"canonical_path":29,"image":114,"width":58,"height":115,"image_alt":100,"kind":61,"patterns":116,"component_categories":130,"app":131},"c0b21d90-15d7-413e-ab3a-be98e8790c25","Verification screen where the user is instructed to check their inbox to confirm their newly created account.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_sign-up-3_f0988ec5_nicelydone.jpg",1544,[117,122],{"id":118,"label":119,"slug":120,"rank":78,"group":121},6,"Verification","verification",{"id":80,"label":81,"slug":82},{"id":123,"label":124,"slug":125,"rank":80,"group":126},114,"Confirmation","confirmation",{"id":127,"label":128,"slug":129},12,"States & Feedback","states-and-feedback",[],{"slug":36,"title":35,"logo":38,"categories":132},[],{"uuid":134,"title":96,"description":135,"canonical_path":29,"image":136,"width":58,"height":137,"image_alt":100,"kind":61,"patterns":138,"component_categories":141,"app":143},"5f1905ef-21dd-4d4d-8e07-db78b5c0ea1e","Authentication screen where the user creates a new password and opts into product updates before logging in.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_sign-up-2_f73557f6_nicelydone.jpg",1588,[139],{"id":75,"label":76,"slug":77,"rank":78,"group":140},{"id":80,"label":81,"slug":82},[142],{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":144},[],{"uuid":146,"title":96,"description":147,"canonical_path":29,"image":148,"width":58,"height":115,"image_alt":100,"kind":61,"patterns":149,"component_categories":156,"app":158},"11e598b9-a1c9-41cf-a888-44153aeaad43","Success screen where the user is welcomed after setting up their new account and prompted to proceed to the application.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_sign-up_f304adc9_nicelydone.jpg",[150,152],{"id":123,"label":124,"slug":125,"rank":78,"group":151},{"id":127,"label":128,"slug":129},{"id":80,"label":153,"slug":154,"rank":80,"group":155},"Account Setup","account-setup",{"id":80,"label":81,"slug":82},[157],{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":159},[],{"uuid":161,"title":162,"description":163,"canonical_path":29,"image":164,"width":58,"height":115,"image_alt":165,"kind":61,"patterns":166,"component_categories":167,"app":168},"47e8c33a-89b7-4d16-b657-b1428aa74c00","Popover","Onboarding Dashboard","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_popover_541f374d_nicelydone.jpg","Popover from Heroku",[],[],{"slug":36,"title":35,"logo":38,"categories":169},[],{"uuid":171,"title":172,"description":173,"canonical_path":29,"image":174,"width":58,"height":115,"image_alt":175,"kind":61,"patterns":176,"component_categories":195,"app":206},"e5bd1b7f-c8ec-4141-b92b-607722b375fa","Home","Default landing screen showing an empty workspace with a prompt to create the user's first application.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_home_9fd355bb_nicelydone.jpg","Home from Heroku",[177,182,188],{"id":178,"label":179,"slug":180,"rank":78,"group":181},115,"Empty State","empty-state",{"id":127,"label":128,"slug":129},{"id":42,"label":183,"slug":184,"rank":80,"group":185},"Add & Create","add-and-create",{"id":75,"label":186,"slug":187},"Actions","actions",{"id":189,"label":172,"slug":190,"rank":75,"group":191},81,"home",{"id":192,"label":193,"slug":194},8,"Pages & Content","pages-and-content",[196,200,204,205],{"id":197,"title":198,"slug":199},240,"Horizontal navigation","horizontal-navigation",{"id":201,"title":202,"slug":203},169,"Avatar","avatar",{"id":85,"title":86,"slug":87},{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":207},[],{"uuid":209,"title":210,"description":211,"canonical_path":29,"image":212,"width":58,"height":115,"image_alt":213,"kind":61,"patterns":214,"component_categories":217,"app":221},"97e4c6ff-6a79-481a-ba57-68603816583f","Create","App creation screen where the user inputs an optional app name and selects a runtime region to deploy a new application.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_create_41c5d022_nicelydone.png","Create from Heroku",[215],{"id":42,"label":183,"slug":184,"rank":78,"group":216},{"id":75,"label":186,"slug":187},[218,219,220],{"id":197,"title":198,"slug":199},{"id":201,"title":202,"slug":203},{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":222},[],{"uuid":224,"title":225,"description":226,"canonical_path":29,"image":227,"width":58,"height":228,"image_alt":229,"kind":61,"patterns":230,"component_categories":231,"app":232},"19046354-d03e-48cf-b262-00ec958b176a","Single","Grid Progress indicator","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_single-3_c58e345d_nicelydone.jpg",2570,"Single from Heroku",[],[],{"slug":36,"title":35,"logo":38,"categories":233},[],{"uuid":235,"title":225,"description":236,"canonical_path":29,"image":237,"width":58,"height":115,"image_alt":229,"kind":61,"patterns":238,"component_categories":254,"app":275},"acd76153-7457-4d95-86f4-2de265c45f94","Detail page for a specific application showing its installed add-ons, dyno formation, and a feed of recent activity.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_single-2_5b7d3067_nicelydone.jpg",[239,247,252],{"id":240,"label":241,"slug":242,"rank":78,"group":243},41,"Dashboard","dashboard",{"id":244,"label":245,"slug":246},4,"Data & Analysis","data-and-analysis",{"id":248,"label":249,"slug":250,"rank":80,"group":251},38,"Activity Log","activity-log",{"id":244,"label":245,"slug":246},{"id":178,"label":179,"slug":180,"rank":75,"group":253},{"id":127,"label":128,"slug":129},[255,259,263,267,271,272,273,274],{"id":256,"title":257,"slug":258},260,"Badge","badge",{"id":260,"title":261,"slug":262},177,"Breadcrumb","breadcrumb",{"id":264,"title":265,"slug":266},277,"Button group","button-group",{"id":268,"title":269,"slug":270},233,"Tabs","tabs",{"id":197,"title":198,"slug":199},{"id":201,"title":202,"slug":203},{"id":85,"title":86,"slug":87},{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":276},[],{"uuid":278,"title":279,"description":280,"canonical_path":29,"image":281,"width":58,"height":115,"image_alt":282,"kind":61,"patterns":283,"component_categories":288,"app":296},"6f669842-aba8-48a3-a283-465684638455","Empty state","Detail page where the user manages dynos and add-ons for a specific application, currently showing empty states for both.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fheroku_empty-state-2_48f81380_nicelydone.jpg","Empty state from Heroku",[284,286],{"id":178,"label":179,"slug":180,"rank":78,"group":285},{"id":127,"label":128,"slug":129},{"id":240,"label":241,"slug":242,"rank":80,"group":287},{"id":244,"label":245,"slug":246},[289,290,291,292,293,294,295],{"id":260,"title":261,"slug":262},{"id":264,"title":265,"slug":266},{"id":268,"title":269,"slug":270},{"id":197,"title":198,"slug":199},{"id":201,"title":202,"slug":203},{"id":85,"title":86,"slug":87},{"id":89,"title":90,"slug":91},{"slug":36,"title":35,"logo":38,"categories":297},[],{"family":299,"examples":300},"pages",[],[302,304,306,309,312,315,318,320,324,328,332],{"label":303,"to":29},"Heroku product screens",{"label":305,"to":32},"Heroku marketing pages",{"label":307,"to":308},"Heroku user flows","\u002Fexamples\u002Fapps\u002Fheroku\u002Fflows",{"label":310,"to":311},"Heroku UI components","\u002Fexamples\u002Fapps\u002Fheroku\u002Fcomponents",{"label":313,"to":314},"Web Development app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fweb-development",{"label":316,"to":317},"Developer Tools app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-tools",{"label":319,"to":18},"All SaaS app examples",{"label":321,"to":322,"description":323},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":325,"to":326,"description":327},"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":329,"to":330,"description":331},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":333,"to":334,"description":335},"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":337,"updated_at":338},"2016-08-02T08:00:00.000Z","2026-09-13T13:02:39.000Z"]