[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fapps\u002Ftreehouse":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":386,"dates":403},"\u002Fexamples\u002Fapps\u002Ftreehouse","detail","apps",true,{"title":9,"description":10,"og_image":11},"Treehouse design examples - Nicelydone","Explore Treehouse UI design examples. Effective, affordable tech education","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_sign-in_4b34a76e_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},"Treehouse design examples",{"title":20,"eyebrow":22,"description":10,"sections":23,"body":33},"SaaS app examples",[24],{"title":25,"links":26},"Explore Treehouse",[27,30],{"label":28,"to":29},"product screens","\u002Fexamples\u002Fapps\u002Ftreehouse\u002Fscreens",{"label":31,"to":32},"marketing pages","\u002Fexamples\u002Fapps\u002Ftreehouse\u002Fmarketing",[],{"title":35,"slug":36,"description":37,"logo":38,"url":39,"categories":40},"Treehouse","treehouse","Effective, affordable tech education","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Ftreehouse-79f84fed.png","https:\u002F\u002Fteamtreehouse.com",[41,45],{"id":42,"title":43,"slug":44},32,"Education","education",{"id":46,"title":47,"slug":48},33,"E-Learning","e-learning",[],[51,383],{"family":52,"examples":53},"screens",[54,87,125,165,192,209,217,230,277,302,330,361],{"uuid":55,"title":56,"description":57,"canonical_path":29,"image":11,"width":58,"height":59,"image_alt":60,"kind":61,"patterns":62,"component_categories":72,"app":85},"d1e24f77-f791-465b-998c-0c7e4b7d3f06","Sign in","Sign-in screen where the user authenticates with their email and password, featuring a promotional section for the mobile application.",2800,1914,"Sign in from Treehouse","screen",[63],{"id":64,"label":65,"slug":66,"rank":67,"group":68},4,"Sign In","sign-in",0,{"id":69,"label":70,"slug":71},1,"Access & Account","access-and-account",[73,77,81],{"id":74,"title":75,"slug":76},240,"Horizontal navigation","horizontal-navigation",{"id":78,"title":79,"slug":80},174,"Card","card",{"id":82,"title":83,"slug":84},175,"Button","button",{"slug":36,"title":35,"logo":38,"categories":86},[],{"uuid":88,"title":89,"description":90,"canonical_path":29,"image":91,"width":92,"height":93,"image_alt":94,"kind":61,"patterns":95,"component_categories":104,"app":123},"30eff4f5-06dc-4d3a-b000-1e4d2b110ea2","Plans","Pricing page where the user picks between a Basic and Pro subscription plan, views customer testimonials, and reads frequently asked questions.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_plans_f00b6c2e_nicelydone.jpg",2780,6384,"Plans from Treehouse",[96],{"id":97,"label":98,"slug":99,"rank":67,"group":100},143,"Pricing Page","pricing-page",{"id":101,"label":102,"slug":103},15,"Marketing Page Types","marketing-page-types",[105,109,113,117,121,122],{"id":106,"title":107,"slug":108},258,"Header","header",{"id":110,"title":111,"slug":112},232,"Testimonial","testimonial",{"id":114,"title":115,"slug":116},189,"FAQ","faq",{"id":118,"title":119,"slug":120},202,"Footer","footer",{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":124},[],{"uuid":126,"title":127,"description":128,"canonical_path":29,"image":129,"width":130,"height":131,"image_alt":132,"kind":61,"patterns":133,"component_categories":155,"app":163},"db67ca7b-f21f-4411-9a25-2bb76f67e183","Checkout","Signup and checkout page where the user selects a billing cycle, enters personal details, and provides payment information to start a free trial.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_checkout_d67965b8_nicelydone.jpg",2770,3414,"Checkout from Treehouse",[134,141,146],{"id":135,"label":127,"slug":136,"rank":67,"group":137},130,"checkout",{"id":138,"label":139,"slug":140},14,"Payments & Checkout","payments-and-checkout",{"id":142,"label":143,"slug":144,"rank":69,"group":145},131,"Payment Form","payment-form",{"id":138,"label":139,"slug":140},{"id":147,"label":148,"slug":149,"rank":150,"group":151},91,"Trial","trial",2,{"id":152,"label":153,"slug":154},9,"Plans & Limits","plans-and-limits",[156,160,161,162],{"id":157,"title":158,"slug":159},260,"Badge","badge",{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":164},[],{"uuid":166,"title":167,"description":168,"canonical_path":29,"image":169,"width":92,"height":170,"image_alt":171,"kind":61,"patterns":172,"component_categories":188,"app":190},"377fb9d7-a780-4c47-9411-dd27ab909fc5","Onboarding","Onboarding step where the user selects their coding experience level from three options or chooses to skip the survey.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_onboarding_1e1a4e9e_nicelydone.jpg",1544,"Onboarding from Treehouse",[173,181],{"id":174,"label":175,"slug":176,"rank":67,"group":177},75,"Setup Wizard","setup-wizard",{"id":178,"label":179,"slug":180},7,"Onboarding & Education","onboarding-and-education",{"id":182,"label":183,"slug":184,"rank":69,"group":185},42,"Form","form",{"id":64,"label":186,"slug":187},"Data & Analysis","data-and-analysis",[189],{"id":78,"title":79,"slug":80},{"slug":36,"title":35,"logo":38,"categories":191},[],{"uuid":193,"title":167,"description":194,"canonical_path":29,"image":195,"width":92,"height":170,"image_alt":171,"kind":61,"patterns":196,"component_categories":204,"app":207},"06e3cefa-bbc1-4f4d-9c0f-59c802bf9ffc","Onboarding step where the user selects what they want to build from options like mobile apps, web apps, or websites to personalize their course recommendations.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_onboarding-2_baf16fee_nicelydone.jpg",[197,199],{"id":174,"label":175,"slug":176,"rank":67,"group":198},{"id":178,"label":179,"slug":180},{"id":200,"label":201,"slug":202,"rank":69,"group":203},77,"Welcome","welcome",{"id":178,"label":179,"slug":180},[205,206],{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":208},[],{"uuid":210,"title":167,"description":211,"canonical_path":29,"image":212,"width":92,"height":170,"image_alt":171,"kind":61,"patterns":213,"component_categories":214,"app":215},"b3325dfb-b417-4f1c-8785-71ef707763ac","Onboarding Form Modal screen","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_onboarding-3_dddfc4bd_nicelydone.jpg",[],[],{"slug":36,"title":35,"logo":38,"categories":216},[],{"uuid":218,"title":167,"description":219,"canonical_path":29,"image":220,"width":92,"height":221,"image_alt":171,"kind":61,"patterns":222,"component_categories":225,"app":228},"ae045362-be97-4bd1-9037-e60488695c2a","Onboarding step where the user is recommended a specific development track based on their survey answers, featuring an introductory video and a primary action to begin the course.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_onboarding-4_39bac644_nicelydone.jpg",1948,[223],{"id":200,"label":201,"slug":202,"rank":67,"group":224},{"id":178,"label":179,"slug":180},[226,227],{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":229},[],{"uuid":231,"title":232,"description":233,"canonical_path":29,"image":234,"width":92,"height":235,"image_alt":236,"kind":61,"patterns":237,"component_categories":262,"app":275},"ae0f1f68-a5bd-49f3-b5a3-5dda19f35012","Single","Detail page where the user watches a video lesson on HTML and CSS, with access to teacher's notes, questions, and a workspace environment.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_single-2_7ead8f3a_nicelydone.jpg",3684,"Single from Treehouse",[238,246,254],{"id":239,"label":240,"slug":241,"rank":67,"group":242},82,"Media Detail","media-detail",{"id":243,"label":244,"slug":245},8,"Pages & Content","pages-and-content",{"id":247,"label":248,"slug":249,"rank":69,"group":250},61,"Video Player","video-player",{"id":251,"label":252,"slug":253},5,"Media & Tools","media-and-tools",{"id":255,"label":256,"slug":257,"rank":150,"group":258},118,"Help","help",{"id":259,"label":260,"slug":261},12,"States & Feedback","states-and-feedback",[263,267,268,272,273,274],{"id":264,"title":265,"slug":266},233,"Tabs","tabs",{"id":157,"title":158,"slug":159},{"id":269,"title":270,"slug":271},169,"Avatar","avatar",{"id":74,"title":75,"slug":76},{"id":82,"title":83,"slug":84},{"id":78,"title":79,"slug":80},{"slug":36,"title":35,"logo":38,"categories":276},[],{"uuid":278,"title":279,"description":280,"canonical_path":29,"image":281,"width":92,"height":282,"image_alt":283,"kind":61,"patterns":284,"component_categories":294,"app":300},"dd8cde24-1884-4183-bf83-f43275513377","Home","Home page where a student can resume their recommended PHP Development track and see prompts to take a survey or download the mobile app.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_home_70de176c_nicelydone.jpg",2514,"Home from Treehouse",[285,289],{"id":286,"label":279,"slug":287,"rank":67,"group":288},81,"home",{"id":243,"label":244,"slug":245},{"id":290,"label":291,"slug":292,"rank":69,"group":293},41,"Dashboard","dashboard",{"id":64,"label":186,"slug":187},[295,296,297,298,299],{"id":264,"title":265,"slug":266},{"id":269,"title":270,"slug":271},{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":301},[],{"uuid":303,"title":304,"description":305,"canonical_path":29,"image":306,"width":92,"height":170,"image_alt":307,"kind":61,"patterns":308,"component_categories":321,"app":328},"b5bd8081-62c4-4416-8904-f85b84f523cc","Dropdown","Home dashboard where the user views their getting started track, dismisses a mobile app promo banner, and accesses account settings via an open profile dropdown.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_dropdown_07f231f3_nicelydone.jpg","Dropdown from Treehouse",[309,311,319],{"id":286,"label":279,"slug":287,"rank":67,"group":310},{"id":243,"label":244,"slug":245},{"id":312,"label":313,"slug":314,"rank":69,"group":315},3,"Profile","profile",{"id":316,"label":317,"slug":318},11,"Social & Collaboration","social-and-collaboration",{"id":290,"label":291,"slug":292,"rank":150,"group":320},{"id":64,"label":186,"slug":187},[322,323,324,325,326,327],{"id":264,"title":265,"slug":266},{"id":157,"title":158,"slug":159},{"id":269,"title":270,"slug":271},{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":329},[],{"uuid":331,"title":332,"description":333,"canonical_path":29,"image":334,"width":92,"height":335,"image_alt":336,"kind":61,"patterns":337,"component_categories":354,"app":359},"6cf99ce8-71b4-483e-b5d6-42ff3610bf20","Settings","Settings page where the user views their profile information, including email and company, and can navigate to other account preferences.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_settings_b62a0b74_nicelydone.jpg",1662,"Settings from Treehouse",[338,340,348],{"id":312,"label":313,"slug":314,"rank":67,"group":339},{"id":316,"label":317,"slug":318},{"id":341,"label":342,"slug":343,"rank":69,"group":344},94,"Account Settings","account-settings",{"id":345,"label":346,"slug":347},10,"Settings & Admin","settings-and-admin",{"id":316,"label":349,"slug":350,"rank":150,"group":351},"Edit","edit",{"id":150,"label":352,"slug":353},"Actions","actions",[355,356,357,358],{"id":269,"title":270,"slug":271},{"id":74,"title":75,"slug":76},{"id":78,"title":79,"slug":80},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":360},[],{"uuid":362,"title":332,"description":363,"canonical_path":29,"image":364,"width":92,"height":365,"image_alt":336,"kind":61,"patterns":366,"component_categories":377,"app":381},"03196aee-2567-4bfe-8c67-2132cb153445","Settings page where the user compares Basic, Pro, and Techdegree plans, views their current enrollment status, and can upgrade or change their subscription.","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002Ftreehouse_settings-2_8f54fb0d_nicelydone.jpg",3686,[367,372],{"id":368,"label":369,"slug":370,"rank":67,"group":371},89,"Pricing","pricing",{"id":152,"label":153,"slug":154},{"id":373,"label":374,"slug":375,"rank":69,"group":376},96,"Billing Settings","billing-settings",{"id":345,"label":346,"slug":347},[378,379,380],{"id":157,"title":158,"slug":159},{"id":269,"title":270,"slug":271},{"id":82,"title":83,"slug":84},{"slug":36,"title":35,"logo":38,"categories":382},[],{"family":384,"examples":385},"pages",[],[387,389,391,394,397,400],{"label":388,"to":29},"Treehouse product screens",{"label":390,"to":32},"Treehouse marketing pages",{"label":392,"to":393},"Treehouse user flows","\u002Fexamples\u002Fapps\u002Ftreehouse\u002Fflows",{"label":395,"to":396},"Treehouse UI components","\u002Fexamples\u002Fapps\u002Ftreehouse\u002Fcomponents",{"label":398,"to":399},"Education app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Feducation",{"label":401,"to":402},"E-Learning app examples","\u002Fexamples\u002Fapps\u002Fcategories\u002Fe-learning",{"published_at":404,"updated_at":405},"2016-06-21T08:40:00.000Z","2026-09-13T13:02:39.000Z"]