[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Fstorytrail\u002Fscreens":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":24,"app":28,"examples":39,"showcases":350,"links":351,"dates":406},"\u002Fexamples\u002Fapps\u002Fstorytrail\u002Fscreens","detail","screens",true,{"title":9,"description":10,"og_image":11},"Storytrail product screens examples - Nicelydone","Browse Storytrail screen design examples. Preview the interface screenshots and explore related UI patterns. Let the story be your guide","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_onboarding-2_6ba4aee7_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},"Storytrail design examples","\u002Fexamples\u002Fapps\u002Fstorytrail",{"label":23,"to":4},"Storytrail 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},"Storytrail","storytrail","Let the story be your guide","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fstorytrail-23e23447.png","http:\u002F\u002Fstorytrail.co",[35],{"id":36,"title":37,"slug":38},5,"Travel","travel",[40,78,106,128,159,180,198,214,239,260,297,312],{"uuid":41,"title":42,"description":43,"canonical_path":4,"image":11,"width":44,"height":45,"image_alt":46,"kind":47,"patterns":48,"component_categories":67,"app":76},"4c69c56a-eb9d-4b78-b18a-be8fa6d47648","Onboarding","Onboarding step where the user browses and selects a city to start their journey, with an option to skip directly to the app.",2880,1526,"Onboarding from Storytrail","screen",[49,58],{"id":50,"label":51,"slug":52,"rank":53,"group":54},79,"Browse","browse",0,{"id":55,"label":56,"slug":57},8,"Pages & Content","pages-and-content",{"id":59,"label":60,"slug":61,"rank":62,"group":63},77,"Welcome","welcome",1,{"id":64,"label":65,"slug":66},7,"Onboarding & Education","onboarding-and-education",[68,72],{"id":69,"title":70,"slug":71},211,"Pagination","pagination",{"id":73,"title":74,"slug":75},175,"Button","button",{"slug":30,"title":29,"logo":32,"categories":77},[],{"uuid":79,"title":42,"description":80,"canonical_path":4,"image":81,"width":44,"height":45,"image_alt":46,"kind":47,"patterns":82,"component_categories":98,"app":104},"e54afa56-f03d-448e-b763-f4cc3268607b","Onboarding step where the user learns about storytrails on a map and can choose to skip the tour to start using the app.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_onboarding-3_d6bdc988_nicelydone.jpg",[83,90,95],{"id":84,"label":85,"slug":86,"rank":53,"group":87},57,"Map","map",{"id":36,"label":88,"slug":89},"Media & Tools","media-and-tools",{"id":91,"label":92,"slug":93,"rank":62,"group":94},72,"Getting Started","getting-started",{"id":64,"label":65,"slug":66},{"id":59,"label":60,"slug":61,"rank":96,"group":97},2,{"id":64,"label":65,"slug":66},[99,103],{"id":100,"title":101,"slug":102},227,"Stepper","stepper",{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":105},[],{"uuid":107,"title":42,"description":108,"canonical_path":4,"image":109,"width":44,"height":45,"image_alt":46,"kind":47,"patterns":110,"component_categories":123,"app":126},"ffc07355-72d1-446e-8040-eff4de689460","Onboarding step where the user learns keyboard shortcuts for navigation, playback, and favorites before entering the app.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_onboarding-4_af4ab305_nicelydone.jpg",[111,116,121],{"id":112,"label":113,"slug":114,"rank":53,"group":115},73,"Guided Tour","guided-tour",{"id":64,"label":65,"slug":66},{"id":117,"label":118,"slug":119,"rank":62,"group":120},76,"Tutorial","tutorial",{"id":64,"label":65,"slug":66},{"id":91,"label":92,"slug":93,"rank":96,"group":122},{"id":64,"label":65,"slug":66},[124,125],{"id":100,"title":101,"slug":102},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":127},[],{"uuid":129,"title":130,"description":131,"canonical_path":4,"image":132,"width":44,"height":133,"image_alt":134,"kind":47,"patterns":135,"component_categories":151,"app":157},"b468ac8d-a7a9-4a28-b331-38e163b3b53c","Landing page","Landing page featuring a horizontal carousel of cities, currently showing Rome, with calls to action to view a trailer or explore the city.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_landing-page_c1129b3f_nicelydone.jpg",1520,"Landing page from Storytrail",[136,144,146],{"id":137,"label":138,"slug":139,"rank":53,"group":140},65,"Navigation Menu","navigation-menu",{"id":141,"label":142,"slug":143},6,"Navigation & Commands","navigation-and-commands",{"id":50,"label":51,"slug":52,"rank":62,"group":145},{"id":55,"label":56,"slug":57},{"id":147,"label":148,"slug":149,"rank":96,"group":150},81,"Home","home",{"id":55,"label":56,"slug":57},[152,156],{"id":153,"title":154,"slug":155},258,"Header","header",{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":158},[],{"uuid":160,"title":161,"description":162,"canonical_path":4,"image":163,"width":44,"height":45,"image_alt":164,"kind":47,"patterns":165,"component_categories":172,"app":178},"915ef1b3-452e-41e5-9d1f-9e564c236a49","Sign in","Sign-in screen where the user authenticates with email and password, or via Twitter and Facebook.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_sign-in_7bf59a8b_nicelydone.jpg","Sign in from Storytrail",[166],{"id":96,"label":167,"slug":168,"rank":53,"group":169},"Forgot Password","forgot-password",{"id":62,"label":170,"slug":171},"Access & Account","access-and-account",[173,177],{"id":174,"title":175,"slug":176},284,"Modal","modal",{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":179},[],{"uuid":181,"title":182,"description":183,"canonical_path":4,"image":184,"width":44,"height":45,"image_alt":185,"kind":47,"patterns":186,"component_categories":189,"app":196},"c4a11c45-7007-48b6-911f-7ddef8e60940","Password reset","Verification screen where the user enters their email address to resend the account confirmation link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_password-reset_1b5d8bd5_nicelydone.jpg","Password reset from Storytrail",[187],{"id":96,"label":167,"slug":168,"rank":53,"group":188},{"id":62,"label":170,"slug":171},[190,194,195],{"id":191,"title":192,"slug":193},240,"Horizontal navigation","horizontal-navigation",{"id":174,"title":175,"slug":176},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":197},[],{"uuid":199,"title":200,"description":201,"canonical_path":4,"image":202,"width":44,"height":45,"image_alt":203,"kind":47,"patterns":204,"component_categories":209,"app":212},"5e325651-8990-4456-a706-b43e37abd101","Sign up","Signup screen where the user creates an account using their email and password or via Twitter or Facebook.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_sign-up_4faadf2b_nicelydone.jpg","Sign up from Storytrail",[205],{"id":36,"label":206,"slug":207,"rank":53,"group":208},"Sign Up","sign-up",{"id":62,"label":170,"slug":171},[210,211],{"id":174,"title":175,"slug":176},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":213},[],{"uuid":215,"title":216,"description":217,"canonical_path":4,"image":218,"width":44,"height":45,"image_alt":219,"kind":47,"patterns":220,"component_categories":233,"app":237},"05a326ab-e8cf-49d3-9fb6-26da2fbf2940","Sign up confirmation","Verification screen where the user is instructed to check their inbox to confirm their email address, with an option to resend the link.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_sign-up-confirmation_e44b7f04_nicelydone.jpg","Sign up confirmation from Storytrail",[221,225],{"id":141,"label":222,"slug":223,"rank":53,"group":224},"Verification","verification",{"id":62,"label":170,"slug":171},{"id":226,"label":227,"slug":228,"rank":62,"group":229},114,"Confirmation","confirmation",{"id":230,"label":231,"slug":232},12,"States & Feedback","states-and-feedback",[234,235,236],{"id":191,"title":192,"slug":193},{"id":174,"title":175,"slug":176},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":238},[],{"uuid":240,"title":241,"description":242,"canonical_path":4,"image":243,"width":44,"height":45,"image_alt":244,"kind":47,"patterns":245,"component_categories":255,"app":258},"d7ba5d6f-5810-40e4-af4b-42360e62dad9","Sign up email confirmed","Verification success screen where the user is informed their email has been confirmed and can proceed to view the app content.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_sign-email-confirmed_a85090e8_nicelydone.jpg","Sign up email confirmed from Storytrail",[246,248,253],{"id":141,"label":222,"slug":223,"rank":53,"group":247},{"id":62,"label":170,"slug":171},{"id":249,"label":250,"slug":251,"rank":62,"group":252},122,"Success","success",{"id":230,"label":231,"slug":232},{"id":226,"label":227,"slug":228,"rank":96,"group":254},{"id":230,"label":231,"slug":232},[256,257],{"id":174,"title":175,"slug":176},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":259},[],{"uuid":261,"title":262,"description":263,"canonical_path":4,"image":264,"width":44,"height":265,"image_alt":266,"kind":47,"patterns":267,"component_categories":281,"app":295},"10299bc9-79c0-4b61-a40d-b5b03fee6959","Share","Marketing landing page for a referral giveaway to Rome that has ended, showing the user's earned chances and the prize details.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_share_1102e89c_nicelydone.jpg",3264,"Share from Storytrail",[268,274,279],{"id":269,"label":262,"slug":270,"rank":53,"group":271},24,"share",{"id":96,"label":272,"slug":273},"Actions","actions",{"id":275,"label":276,"slug":277,"rank":62,"group":278},115,"Empty State","empty-state",{"id":230,"label":231,"slug":232},{"id":50,"label":51,"slug":52,"rank":96,"group":280},{"id":55,"label":56,"slug":57},[282,286,290,294],{"id":283,"title":284,"slug":285},260,"Badge","badge",{"id":287,"title":288,"slug":289},202,"Footer","footer",{"id":291,"title":292,"slug":293},233,"Tabs","tabs",{"id":153,"title":154,"slug":155},{"slug":30,"title":29,"logo":32,"categories":296},[],{"uuid":298,"title":148,"description":299,"canonical_path":4,"image":300,"width":44,"height":133,"image_alt":301,"kind":47,"patterns":302,"component_categories":307,"app":310},"4bc9938a-e06b-464b-a3d5-4f0f396f1712","Landing page hero section featuring a specific city with options to view a trailer or explore further, hinting at a horizontal carousel of locations.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_home_74125129_nicelydone.jpg","Home from Storytrail",[303,305],{"id":147,"label":148,"slug":149,"rank":53,"group":304},{"id":55,"label":56,"slug":57},{"id":50,"label":51,"slug":52,"rank":62,"group":306},{"id":55,"label":56,"slug":57},[308,309],{"id":153,"title":154,"slug":155},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":311},[],{"uuid":313,"title":314,"description":315,"canonical_path":4,"image":316,"width":44,"height":317,"image_alt":318,"kind":47,"patterns":319,"component_categories":340,"app":348},"50511e73-755e-42ec-bfa9-a6faf7b5dd4e","Account settings","Settings page where the user manages their personal profile, including email, password, country, and marketing preferences.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Fstorytrail_account-settings_0f963c1c_nicelydone.jpg",3318,"Account settings from Storytrail",[320,328,336],{"id":321,"label":322,"slug":323,"rank":53,"group":324},94,"Account Settings","account-settings",{"id":325,"label":326,"slug":327},10,"Settings & Admin","settings-and-admin",{"id":329,"label":330,"slug":331,"rank":62,"group":332},3,"Profile","profile",{"id":333,"label":334,"slug":335},11,"Social & Collaboration","social-and-collaboration",{"id":333,"label":337,"slug":338,"rank":96,"group":339},"Edit","edit",{"id":96,"label":272,"slug":273},[341,345,346,347],{"id":342,"title":343,"slug":344},169,"Avatar","avatar",{"id":291,"title":292,"slug":293},{"id":191,"title":192,"slug":193},{"id":73,"title":74,"slug":75},{"slug":30,"title":29,"logo":32,"categories":349},[],[],[352,354,356,358,360,362,364,366,368,370,372,374,376,379,382,385,388,390,394,398,402],{"label":51,"to":353},"\u002Fexamples\u002Fscreens\u002Fbrowse",{"label":227,"to":355},"\u002Fexamples\u002Fscreens\u002Fconfirmation",{"label":167,"to":357},"\u002Fexamples\u002Fscreens\u002Fforgot-password",{"label":92,"to":359},"\u002Fexamples\u002Fscreens\u002Fgetting-started",{"label":148,"to":361},"\u002Fexamples\u002Fscreens\u002Fhome",{"label":222,"to":363},"\u002Fexamples\u002Fscreens\u002Fverification",{"label":60,"to":365},"\u002Fexamples\u002Fscreens\u002Fwelcome",{"label":322,"to":367},"\u002Fexamples\u002Fscreens\u002Faccount-settings",{"label":337,"to":369},"\u002Fexamples\u002Fscreens\u002Fedit",{"label":276,"to":371},"\u002Fexamples\u002Fscreens\u002Fempty-state",{"label":113,"to":373},"\u002Fexamples\u002Fscreens\u002Fguided-tour",{"label":85,"to":375},"\u002Fexamples\u002Fscreens\u002Fmap",{"label":377,"to":378},"Storytrail marketing pages","\u002Fexamples\u002Fapps\u002Fstorytrail\u002Fmarketing",{"label":380,"to":381},"Storytrail user flows","\u002Fexamples\u002Fapps\u002Fstorytrail\u002Fflows",{"label":383,"to":384},"Storytrail UI components","\u002Fexamples\u002Fapps\u002Fstorytrail\u002Fcomponents",{"label":386,"to":387},"Travel app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Ftravel",{"label":389,"to":18},"All SaaS app examples",{"label":391,"to":392,"description":393},"SaaS screen examples","\u002Fexamples\u002Fscreens","Browse real product interface screens grouped by reusable screen patterns and common product tasks.",{"label":395,"to":396,"description":397},"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":399,"to":400,"description":401},"SaaS UI component examples","\u002Fexamples\u002Fcomponents","Browse interface components extracted from real SaaS products and grouped by their visible role.",{"label":403,"to":404,"description":405},"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":407,"updated_at":408},"2017-01-18T00:00:00.000Z","2026-09-13T13:02:39.000Z"]