[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fstream\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":47,"showcases":388,"links":389,"dates":450},"\u002Fexamples\u002Fapps\u002Fstream\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Stream product screens examples - Nicelydone","Browse Stream screen design examples. Preview the interface screenshots and explore related UI patterns. The API for scalable feeds","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_sign-in_50cd9386_nicelydone.jpg",[13,16,19,22],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS app design examples","\u002Fexamples\u002Fapps",{"label":20,"to":21},"Stream design examples","\u002Fexamples\u002Fapps\u002Fstream",{"label":23,"to":4},"Stream 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},"Stream","stream","The API for scalable feeds","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fstream-d81f5a5b.png","https:\u002F\u002Fgetstream.io",[35,39,43],{"id":36,"title":37,"slug":38},37,"Developer APIs","developer-apis",{"id":40,"title":41,"slug":42},42,"Messaging","messaging",{"id":44,"title":45,"slug":46},48,"Developer Tools","developer-tools",[48,81,98,119,162,203,233,255,277,303,338,364],{"uuid":49,"title":50,"description":51,"canonical_path":4,"image":11,"width":52,"height":53,"image_alt":54,"kind":55,"patterns":56,"component_categories":66,"app":79},"27380222-9a73-4a92-8a48-6357de28916c","Sign in","Sign-in overlay where the user authenticates with GitHub or via a username and password form.",2880,1520,"Sign in from Stream","screen",[57],{"id":58,"label":59,"slug":60,"rank":61,"group":62},4,"Sign In","sign-in",0,{"id":63,"label":64,"slug":65},1,"Access & Account","access-and-account",[67,71,75],{"id":68,"title":69,"slug":70},284,"Modal","modal",{"id":72,"title":73,"slug":74},240,"Horizontal navigation","horizontal-navigation",{"id":76,"title":77,"slug":78},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":80},[],{"uuid":82,"title":83,"description":84,"canonical_path":4,"image":85,"width":52,"height":53,"image_alt":86,"kind":55,"patterns":87,"component_categories":93,"app":96},"0ccdb787-8959-46ad-bf1c-75c164e4cd00","Password reset","Password recovery modal where the user enters their email address to receive a reset link, overlaid on the marketing homepage.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_password-reset_39f4cd6e_nicelydone.jpg","Password reset from Stream",[88],{"id":89,"label":90,"slug":91,"rank":61,"group":92},2,"Forgot Password","forgot-password",{"id":63,"label":64,"slug":65},[94,95],{"id":68,"title":69,"slug":70},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":97},[],{"uuid":99,"title":100,"description":101,"canonical_path":4,"image":102,"width":52,"height":53,"image_alt":103,"kind":55,"patterns":104,"component_categories":114,"app":117},"3208893e-a401-4d59-a3f8-7ba77b90a6e1","Sign up","Signup modal where the user creates a free account using GitHub or by providing a username, email, and password.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_sign-up_24b829b5_nicelydone.jpg","Sign up from Stream",[105,110],{"id":106,"label":107,"slug":108,"rank":61,"group":109},5,"Sign Up","sign-up",{"id":63,"label":64,"slug":65},{"id":63,"label":111,"slug":112,"rank":63,"group":113},"Account Setup","account-setup",{"id":63,"label":64,"slug":65},[115,116],{"id":68,"title":69,"slug":70},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":118},[],{"uuid":120,"title":121,"description":122,"canonical_path":4,"image":123,"width":52,"height":124,"image_alt":125,"kind":55,"patterns":126,"component_categories":145,"app":160},"0381cb4c-4726-4e96-8359-ffcb095a0353","Onboarding","Onboarding step where the user begins a 5-part interactive tutorial to build a scalable newsfeed using their generated API key.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding_fd597d42_nicelydone.jpg",1626,"Onboarding from Stream",[127,135,140],{"id":128,"label":129,"slug":130,"rank":61,"group":131},73,"Guided Tour","guided-tour",{"id":132,"label":133,"slug":134},7,"Onboarding & Education","onboarding-and-education",{"id":136,"label":137,"slug":138,"rank":63,"group":139},76,"Tutorial","tutorial",{"id":132,"label":133,"slug":134},{"id":141,"label":142,"slug":143,"rank":89,"group":144},72,"Getting Started","getting-started",{"id":132,"label":133,"slug":134},[146,150,154,158,159],{"id":147,"title":148,"slug":149},227,"Stepper","stepper",{"id":151,"title":152,"slug":153},174,"Card","card",{"id":155,"title":156,"slug":157},169,"Avatar","avatar",{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":161},[],{"uuid":163,"title":121,"description":164,"canonical_path":4,"image":165,"width":52,"height":166,"image_alt":125,"kind":55,"patterns":167,"component_categories":187,"app":201},"07c4fd7e-3c67-4dfb-a54a-bb89acb02933","Interactive developer demo step where the user runs a code snippet to add an activity to a feed and sees the live result in a simulated UI.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding-2_de14e8a7_nicelydone.jpg",2700,[168,170,177,179],{"id":136,"label":137,"slug":138,"rank":61,"group":169},{"id":132,"label":133,"slug":134},{"id":171,"label":172,"slug":173,"rank":63,"group":174},53,"Code Editor","code-editor",{"id":106,"label":175,"slug":176},"Media & Tools","media-and-tools",{"id":141,"label":142,"slug":143,"rank":89,"group":178},{"id":132,"label":133,"slug":134},{"id":180,"label":181,"slug":182,"rank":183,"group":184},30,"AI Generation","ai-generation",3,{"id":183,"label":185,"slug":186},"AI","ai",[188,192,196,197,198,199,200],{"id":189,"title":190,"slug":191},233,"Tabs","tabs",{"id":193,"title":194,"slug":195},258,"Header","header",{"id":147,"title":148,"slug":149},{"id":151,"title":152,"slug":153},{"id":155,"title":156,"slug":157},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":202},[],{"uuid":204,"title":121,"description":205,"canonical_path":4,"image":206,"width":52,"height":124,"image_alt":125,"kind":55,"patterns":207,"component_categories":223,"app":231},"779398be-b63b-4608-99e0-bc1dd601e2bf","Interactive demo step explaining how to build a follow feature using the API, featuring a multi-language code snippet and a visual representation of cascading feeds.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding-3_5599a4e5_nicelydone.jpg",[208,210,212,217],{"id":141,"label":142,"slug":143,"rank":61,"group":209},{"id":132,"label":133,"slug":134},{"id":136,"label":137,"slug":138,"rank":63,"group":211},{"id":132,"label":133,"slug":134},{"id":213,"label":214,"slug":215,"rank":89,"group":216},28,"AI Chat","ai-chat",{"id":183,"label":185,"slug":186},{"id":218,"label":190,"slug":191,"rank":183,"group":219},69,{"id":220,"label":221,"slug":222},6,"Navigation & Commands","navigation-and-commands",[224,225,226,227,228,229,230],{"id":189,"title":190,"slug":191},{"id":193,"title":194,"slug":195},{"id":147,"title":148,"slug":149},{"id":151,"title":152,"slug":153},{"id":155,"title":156,"slug":157},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":232},[],{"uuid":234,"title":121,"description":235,"canonical_path":4,"image":236,"width":52,"height":237,"image_alt":125,"kind":55,"patterns":238,"component_categories":247,"app":253},"e4216f3c-e21c-4694-b215-12ff3a6cfbe5","Feature page explaining aggregated feeds with an interactive code editor and visual feed examples.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding-4_816b1402_nicelydone.jpg",1898,[239,241,243,245],{"id":141,"label":142,"slug":143,"rank":61,"group":240},{"id":132,"label":133,"slug":134},{"id":136,"label":137,"slug":138,"rank":63,"group":242},{"id":132,"label":133,"slug":134},{"id":171,"label":172,"slug":173,"rank":89,"group":244},{"id":106,"label":175,"slug":176},{"id":218,"label":190,"slug":191,"rank":183,"group":246},{"id":220,"label":221,"slug":222},[248,249,250,251,252],{"id":189,"title":190,"slug":191},{"id":193,"title":194,"slug":195},{"id":151,"title":152,"slug":153},{"id":155,"title":156,"slug":157},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":254},[],{"uuid":256,"title":121,"description":257,"canonical_path":4,"image":258,"width":52,"height":259,"image_alt":125,"kind":55,"patterns":260,"component_categories":267,"app":275},"594e3b6b-05d4-4bad-a26b-ac1c238cc290","Interactive tutorial step demonstrating real-time feed updates with a runnable code snippet and live visual previews.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding-5_4ee392a3_nicelydone.jpg",1678,[261,263,265],{"id":136,"label":137,"slug":138,"rank":61,"group":262},{"id":132,"label":133,"slug":134},{"id":171,"label":172,"slug":173,"rank":63,"group":264},{"id":106,"label":175,"slug":176},{"id":141,"label":142,"slug":143,"rank":89,"group":266},{"id":132,"label":133,"slug":134},[268,269,270,271,272,273,274],{"id":189,"title":190,"slug":191},{"id":193,"title":194,"slug":195},{"id":147,"title":148,"slug":149},{"id":151,"title":152,"slug":153},{"id":155,"title":156,"slug":157},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":276},[],{"uuid":278,"title":121,"description":279,"canonical_path":4,"image":280,"width":52,"height":281,"image_alt":125,"kind":55,"patterns":282,"component_categories":295,"app":301},"93bf773f-69ad-409a-8d5f-c5b7e47e9d98","Tutorial completion page where the user reviews supported API clients and integrations before submitting feedback.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_onboarding-6_8a5575bb_nicelydone.jpg",1728,[283,285,293],{"id":136,"label":137,"slug":138,"rank":61,"group":284},{"id":132,"label":133,"slug":134},{"id":286,"label":287,"slug":288,"rank":63,"group":289},117,"Feedback","feedback",{"id":290,"label":291,"slug":292},12,"States & Feedback","states-and-feedback",{"id":141,"label":142,"slug":143,"rank":89,"group":294},{"id":132,"label":133,"slug":134},[296,297,298,299,300],{"id":193,"title":194,"slug":195},{"id":147,"title":148,"slug":149},{"id":151,"title":152,"slug":153},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":302},[],{"uuid":304,"title":305,"description":306,"canonical_path":4,"image":307,"width":52,"height":308,"image_alt":309,"kind":55,"patterns":310,"component_categories":331,"app":336},"dc001593-f68f-4330-be27-5b519acaadc4","Home","Dashboard showing API usage metrics and application credentials for an organization.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_home_77096491_nicelydone.jpg",1950,"Home from Stream",[311,318,326],{"id":312,"label":313,"slug":314,"rank":61,"group":315},41,"Dashboard","dashboard",{"id":58,"label":316,"slug":317},"Data & Analysis","data-and-analysis",{"id":319,"label":320,"slug":321,"rank":63,"group":322},104,"Team Management","team-management",{"id":323,"label":324,"slug":325},10,"Settings & Admin","settings-and-admin",{"id":327,"label":328,"slug":329,"rank":89,"group":330},95,"API Keys","api-keys",{"id":323,"label":324,"slug":325},[332,333,334,335],{"id":155,"title":156,"slug":157},{"id":151,"title":152,"slug":153},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":337},[],{"uuid":339,"title":340,"description":341,"canonical_path":4,"image":342,"width":52,"height":53,"image_alt":343,"kind":55,"patterns":344,"component_categories":357,"app":362},"dda650e1-cbe5-4ec3-a8ca-ca89c9afd898","Invite team","Settings page where an admin invites new users to their organization by entering an email address and selecting between Admin or Read Only access levels.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_invite-team_66801b57_nicelydone.jpg","Invite team from Stream",[345,347,352],{"id":319,"label":320,"slug":321,"rank":61,"group":346},{"id":323,"label":324,"slug":325},{"id":348,"label":349,"slug":350,"rank":63,"group":351},100,"Roles & Permissions","roles-and-permissions",{"id":323,"label":324,"slug":325},{"id":353,"label":354,"slug":355,"rank":89,"group":356},114,"Confirmation","confirmation",{"id":290,"label":291,"slug":292},[358,359,360,361],{"id":68,"title":69,"slug":70},{"id":155,"title":156,"slug":157},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":363},[],{"uuid":365,"title":366,"description":367,"canonical_path":4,"image":368,"width":52,"height":369,"image_alt":370,"kind":55,"patterns":371,"component_categories":381,"app":386},"aa9a86a9-af13-4c64-9400-f0bf18c6ef3c","Team","Settings page where the user manages active and pending team members, views their permission levels, and checks two-factor authentication status.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstream_team_f60e8ba7_nicelydone.jpg",1924,"Team from Stream",[372,374,376],{"id":319,"label":320,"slug":321,"rank":61,"group":373},{"id":323,"label":324,"slug":325},{"id":348,"label":349,"slug":350,"rank":63,"group":375},{"id":323,"label":324,"slug":325},{"id":377,"label":378,"slug":379,"rank":89,"group":380},98,"MFA","mfa",{"id":323,"label":324,"slug":325},[382,383,384,385],{"id":151,"title":152,"slug":153},{"id":155,"title":156,"slug":157},{"id":72,"title":73,"slug":74},{"id":76,"title":77,"slug":78},{"slug":30,"title":29,"logo":32,"categories":387},[],[],[390,392,394,396,398,400,402,404,406,408,410,412,414,417,420,423,426,429,432,434,438,442,446],{"label":142,"to":391},"\u002Fexamples\u002Fscreens\u002Fgetting-started",{"label":137,"to":393},"\u002Fexamples\u002Fscreens\u002Ftutorial",{"label":172,"to":395},"\u002Fexamples\u002Fscreens\u002Fcode-editor",{"label":320,"to":397},"\u002Fexamples\u002Fscreens\u002Fteam-management",{"label":349,"to":399},"\u002Fexamples\u002Fscreens\u002Froles-and-permissions",{"label":190,"to":401},"\u002Fexamples\u002Fscreens\u002Ftabs",{"label":111,"to":403},"\u002Fexamples\u002Fscreens\u002Faccount-setup",{"label":214,"to":405},"\u002Fexamples\u002Fscreens\u002Fai-chat",{"label":181,"to":407},"\u002Fexamples\u002Fscreens\u002Fai-generation",{"label":328,"to":409},"\u002Fexamples\u002Fscreens\u002Fapi-keys",{"label":354,"to":411},"\u002Fexamples\u002Fscreens\u002Fconfirmation",{"label":313,"to":413},"\u002Fexamples\u002Fscreens\u002Fdashboard",{"label":415,"to":416},"Stream marketing pages","\u002Fexamples\u002Fapps\u002Fstream\u002Fmarketing",{"label":418,"to":419},"Stream user flows","\u002Fexamples\u002Fapps\u002Fstream\u002Fflows",{"label":421,"to":422},"Stream UI components","\u002Fexamples\u002Fapps\u002Fstream\u002Fcomponents",{"label":424,"to":425},"Developer APIs app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-apis",{"label":427,"to":428},"Messaging app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fmessaging",{"label":430,"to":431},"Developer Tools app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fdeveloper-tools",{"label":433,"to":18},"All SaaS app examples",{"label":435,"to":436,"description":437},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":439,"to":440,"description":441},"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":443,"to":444,"description":445},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":447,"to":448,"description":449},"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":451,"updated_at":452},"2016-12-12T08:00:00.000Z","2026-09-13T13:02:39.000Z"]