Love Letter #007 - React.gg Course One Pager, Drew Wilson Podcast, Worst Volume UX Challenge 🔊

Designer, dev, entrepreneur, surfer and all-round fun guy Drew Wilson is on the latest Yo! Podcast. [Love Letter](=.dS3-KQbM_F_wagqXNQE4VW102Ao55Bn6kXwfWFHsHqM) 007 [Read Online](=.Hd17LK945oh9dLB0VYkCLkUFgpJrFXXBPYYDJC_pN9c) [Unsubscribe](=.Xp8BWw68T0zSlHQB0sadh88ZtSeKnPKQQUisIJ_6rSQ) Designer, dev, entrepreneur, surfer and all-round fun guy Drew Wilson is on the latest Yo! Podcast. Find all [streaming links here](=.3u6zopLCHprk41Om_lIiSZd3__tF41_rgT0ItyjAenc) and I also dropped a [clip on YouTube](=.CluWIRxctgHyLHbKaX3LzXyTp3E7Ek_M1-X6RKxWw8Q). Below are my favorite websites, UI components, templates, domains & finds featured on [One Page Love](=.CUGtLf7tIyXgdQL4h4ZL2JFAgS1FReqo9Fhsd4xvY58) since I last wrote - hope it keeps the inspo topped up! [Rob Hope](=.FvYNyZwybi7Ck-0btMJdPEhc4Z1Q56ArG7pUY8htx1s) Much love, [Rob Hope] [Get Inspired](=.fLGnqEO6bAGvxw_fZT0UbI6nlsFnvJyRXQJCNnnrtko) [One Page website inspiration.](=.vf52mCTaKwalnnF8mAeL9B_88_n6nmj6GlK3u41aj_E) Get inspired with these unique Single Page websites ([full archive](=.ahJBc94OMBNPPbwITeIS_2mNEQ8r1dxXvDlvSXC0Pp8)) featured on One Page Love over the past week. [React.gg](=.JBLr03WB6Q8E6Mxd1MJApHr6webC0_Q8IBjVEL4Cvbg) [React.gg](=.aLIooCE6F75ygoghIyxsWpNxN09xC2L2efn1gBPplQE) [Visit ➝](=.zm2DU0XfpEOaN_9vv7oMa1QvBPl6qrwtYi4Fupilhvg) Wonderfully unique One Pager taking notification sign ups for the React.gg course. The whimsical design mimics a board game, featuring inline course chapters and playful interactive features. With this much love in a Landing Page, we can only assume the course will be equally as fun. [Alex Brown](=.M2MMan6AaKmclOZj1QPGOArWFCovUWFhU4lrmS6GJn4) [Alex Brown](=.8rO1lh4CCqs202xwjXjPE8tjNVYeZtqIPmwijzEwFa0) [Ben Adam](=.G_a-S2v-35UwRX7Hlol6kTOWQrDTLdXi_iKtOIctK2M) [Ben Adam](=.NFOansI5eqb5v-6C0fwjRQhbuaVLpHn_CqGFhXll3oM) [Lynn Fisher](=.wi6tiU_hPN3SpQOqR4P46y-ymMndYUJs-xHxW8mcazY) [Lynn Fisher](=.YesvZIG9520mmmdlNOprrMPns8Eq8nz0Z0wsrXHFC2E) [Tyler McGinnis](=.CU-2iqgxZuENM3KRfIwd4NcEl4Qiy1iDLJOPFeJriAM) [Tyler McGinnis](=.y8j-TmZfYlLOX0ASw00CaaIilh34b4d2StypPd4nfS4) [ui.dev](=.PhyWgIcWuRAF-r9SvoIfgzbQBxDkhyzF9-ugSnnVifk) [ui.dev](=.SnTBhUAu3YA0pJccf_xpIrmuQygkQQ-UHzRol3gkW3I) [Video Creator Course](=.YqmeZgqgfkL927DOWtobPvoviLZgrfGUiYkXoYiTJfg) [Video Creator Course](=.4vGpf3F2qz8hq9KBrIkln7CIgbsuylNyr-JWckIfctc) [Visit ➝](=.m8maZ-RwhmSodAByU7G3lk3AKEiRexdUGfWi2-JCso0) Slick Landing Page (built with [Framer](=.5ZkjeXYNB33UtiDPkEqR2SACP9wwapjAT5zvoJ8wJR8)) for the new Video Creator Course by YouTuber and entrepreneur Oliur. The video header features looping clips, perfectly teasing the quality of the course inside. [Oliur](=.JqVG_VToNwc2ZaXuM6Gcnvq_p2u_NOPu6xEedpjgVAs) [Oliur](=.npRiR8YFlQXnhs1HNnSNX72GVukXrfotTITU7QIm0Uo) [Freelance Brain](=.jJjLf0PjLE5bikrbR1h8PtYmUfqF43gqbO2joqcqMPc) [Freelance Brain](=.liMVB9HSgLiq1ZpSGKG7x4aL2M2W1ocfW_aUEeqnntc) [Visit ➝](=.rO0QbZAMUOV49olUaG4utAlRfno0wBXx_8MXIAhjc-0) Clean, narrow layout in this One Pager (built with [Framer](=.TwU_mlg6gp7JXWqhSEZftKVRgiCi4hhH5752fx7ibpQ)) promoting the Freelance Brain product by Daryl Ginn to help you manage your freelance business inside Notion. Note the shiny trim on the screenshots that slide in reverse as your scroll. Daryl also curates website design over at [Godly](=.XGjGCtGgzqJYZ1p4O9TwmbLHn3vBXaJsAhSSKx1jqWQ) that you should check out! [Daryl Ginn](=.pzJVbrL7L1BIUSxvYN2Vn7RYVJXUQvM0l0yBEHmBgY8) [Daryl Ginn](=.Y8O8nTKCukb6K2bMj6MIFdUD9gtLpvk6YkK4ZxVTn4E) [Peachweb](=.fkeCewo1GJlSjMcQh8QKoYkoqRIyAsB8pnU6SiQyT8k) [Peachweb](=.unYbHbYBuMXJWfRhUCFZZ0tJsxvAfUXPv0PfS-krhsY) [Visit ➝](=.d1XngdegG32rLmdK_9e1ddqTTODBwlRc6dYMcMXdWcU) Dark-schemed One Pager (built with WordPress) for Peachweb who offer a design service subscription for SaaS startups. [Amí Naeily](=.88mul1cS6dvi5BwKYXcU5guRV3P4hg_ieDmQH6dHCLQ) [Amí NaeilyPro](=.BWshahBfgXQ-CPRUZ0Q2PvxrONqNJezTaLhnqoUyqJA) [Hospitality Business AE](=.W7lJwUP3XIp7-YLmyeSQN79FFdlz1KwdMtMNCLIKnqs) [Hospitality Business AE](=.ZFcWOehhcusRVPiQQsyIdctLsX_1PfiFDoPDOGvVeFw) [Visit ➝](=.A8MeTP0IgZ7Uhk22j-LHN7Gat8qo8NCgdvK6xANCgf8) Useful numbered header navigation in this Landing Page (built with [Webflow](=.vAOM5Q1NMpnh4F9MOTXwV-gTf7xY4sDouFploTpVsbg)) taking business enquires for the hospitality sector in United Arab Emirates. [Minomo Studio](=.gPygnqFXfrBfKcYypa6_xo-MLeB0sWi0nmaZh_CywFU) [Minomo StudioPro](=.T3yttGp0Bl_lP6HtwTm9js0qEoAmTB-OA7vmQsni5Jk) [8px.studio](=.sRz6rDhM0GHokqWIlKNoDPrnRbVBxKYClZotkcJJtxA) [8px.studio](=.uYbA-bbOTABjdnKfldF7K-_c_gpBrnplY4km3aFYVwY) [Visit ➝](=.VXThJQxn7TUyHB9FXsvissSnk2DaO9SzSreNg4NFacI) Long-scrolling One Page portfolio (built with [Webflow](=.5jtT4ymCOMa-SXo_glQNeVm_1LeZ0c4vNnbLzHK6SWM)) for 8px.studio featuring a dark/light mode switcher. Note the very slick Typeform onboarding when clicking on the service CTA links, each kicking off a unique form. [8px.studio](=.TdZVWN6wLBw3CmYvqs3lBWlHBPcN19O70aTTWmME3TY) [8px.studio](=.WZQY-kSRLnn1EODIfPpZRs769abXGZ4rQTOgJWCkXB8) [Rafal Tomal](=.z3PpAhXHpx29msnYGnhM01CrDCTTjJf2vDOVJjieC5s) [Rafal Tomal](=.XqvYHNu2yr4TXOVNrfs7e3bnf_g3Y7yzP3WzDCRJq4o) [Promoted Tutorial](=.DcK9kDw1Z8qNhXx5wHRxkk1QlG03X8Dzr7fhELqnRzA) [How to create a successful online video course with Squarespace Member Areas](=.WwXd4KA7KG67lS-MwGNh3N8aWVkphiRZUZHnfPnZUZo) In this tutorial ([read](=.Wrp7cScmeiK_SxsJBGImRVRyGT21MDMimFMUbEdxODY)) I show you exactly how to set up your first course Member Area, add a video collection of premium content, style your course Landing Page and start taking your first payments – all within the same platform! [Into The Wild](=.n3tf3hOklseY2fuUedPfobOhcBEn4TZFa5kU2D3uZKo) [Into The Wild](=.qpWqQdH5suY-hRbRVaY6OXwwMMxj64ErrOdU-DqkN94) [Open Tutorial ➝](=.isfKv2pzyHGvLNGdHCHriepeOK8DlMfeAWDpPOUdoF8) For a better tutorial experience we are going to build a landing page and Member Area for a beginners photography course called Into the Wild. [Noteworthy](=.1c8DcZpNPnsI1UX_n5sc5zOslu0RV3qLR9VSkzAFQ44) [Interesting UI components.](=.SwSmJR79etdxQJUtSxkvotWYD6_S-_st1fHwy9T5HxQ) Some recent page components ([full archive](=.ru4GC45785dfzfDLIlaIwK9LNrZMbL9o0h0aOfsMbOM)) I thought were really well designed or found interesting. Each is captured in full HD and links to the original page source. Hit me up if you scroll into something fresh. [Radix UI](=.Ihyn4draQapUdJORowe4E8n9M_4WGcw-E8YyqbgB96E) [Radix UI Metrics](=.lxzcHP-kQ8uNNhZnIcf6l9wdXATQQstpnVr30lqn2Ps) [Enlarge ➝](=.y5YgDQQsQiCinh47pzwLpSrmpRtDATeZqsyBH18lbvY) Clever use of landing page section whitespace to create this beautifully designed graph under the Radix UI metrics. [Samara](=.qVM4dwZnWFg0FSv5uiKVxGanxwP4phGTPj3CFFuRwDY) [Samara How It Works](=.r3iS8QWpkBp6FnK7r4VB4E3g0Ub0rEB4urITKGZ0Vm8) [Enlarge ➝](=.Tm1XE-A5l-eg-tqEXcSaAStcZnHopz9hEmGUzKLMb2k) Nothing beats a visual timeline paired with images of your product on the move. [New Interview](=.5O8BpmSfdj1kyrlEbLkIEqgEymDssWWZWYeSx-vXOA4) [Yo! Podcast #017 - Drew Wilson](=.sY6igt-2V_TmGFBTiRUxEEauPXfdHOS1oF1SOJ94SXc) [Drew Wilson](=.7W6UzJoj7OlkkF_dSvPfrhNY2VZi1jyp5-K60wgPm6M) [yo.fm](=.OTSkqRDjYtSei5VHZPfl58NaihQCBgYUG4Ubd-vmkdE) [Spotify](=.73yyQcMBvvQ1gSCjkTuR1wuBjkE-a6Z5ftRg9-SyPow) [Apple](=.Sy-geaNnpY9VNJV72SD2PPqpqPYs3T7crf8F9FKD1Hw) [Google](=.kxdei0gDv4kKCFtZQyc2UMnnhphGVmdNmLKRK3MRaMw) [Amazon](=.HXWcpnjhKk00_ZBI8w9c0UJJKuEiO4Xa3zpv5nvIWqk) Drew Wilson ([@drewwilson](=.XBsHLK9HSRQFQAcEV3bT_du2-DMVYt6JkDpXpySxKwQ)) is is an accomplished designer, developer and entrepreneur with a prolific portfolio of online projects. In 2014 he founded payment startup Plasso which was later acquired by GoDaddy. Drew now works on his new venture Logical to help startups visually build and launch web services. We rap about AI disrupting the film industry, surfing with beefy sharks, why Letter Banking closed down, film vs web, his passion project Ryte and exactly what angel investors are looking for in pitch decks. [Validate Faster](=.ilsZ13nNIp-0p--murHWJhFExJczyyWSkDeAWt_Mvzk) [Landing Page Templates.](=.HfRAVVjD_2uxNFcUfnFLus0_D7oUAfGbQ-N709YttMY) Long-scrolling Landing Page templates ([full archive](=.4G6Wj0MwSiQcPfFDRtC3LKB2eyY6jxI2v47Dxb9E1No)) to kickstart and validate your next idea quicker. [Fusion](=.HArRf_OcCZZLw_TUfAD7w4nkbokbFpFH_FOzgpKgB7A) [Fusion Framer Template](=.bZKXMdUVgptmLnixggx7ZZT9MW-8rxgAGfAWBycPTfI) [Demo](=.kKu1sgWTF8XMQcer4DPMlzj8bhbTbD0zZegZgDydQ6I) [Clone $50](=._Rv98KFAJaxL90F3uQfZ34Rubds7jGi-YPS69J-B87g) 'Fusion' is a minimal Landing Page App template built for the [Framer](=.GMmF7vo_g7gVPb67o2SzLMB8LaL5YUVNlDND6NpBwZI) no-code website builder. The design features a ton of whitespace and the devices even move subtly as you scroll around. [Untitled UI](=.63-aLt6GbSBIG_JZkyau4wX8TRvskiRlKIAbqVKQsnU) [Untitled UI Landing Page Kit](=.jxOY7CoHS_GFeMdnOMj0zeX5tprEU30eNMgH3DzysxU) [Demo](=.tv0UdQjdJH50yfP-G93-VwZzHjLbU-qLETMFO1Ew7HY) [Buy $119](=.bkYCEp7BCgNvS5QM4qLOzfuytOwbdHGMWYEgoRE0vIg) 'Untitled UI' is a mega Figma UI Kit crafted by [Jordan Hughes](=.ENSqs8ACbdGvuiiW6BSrvYs2JFENVhkaoMJqTcrpI2E) featuring 20 pre-built long-scrolling Landing Page designs. Demo'd here is one of my favs, the SaaS Landing Page. Your purchase also includes 10k components/variants, 2k icons and lifetime updates! [Available to register](=.VDfe6XTVy_x0KcpRehbZFxJuFO2R7C_vdYToTXaQzkQ) [Brandable dot com domains.](=.ItxTr8oEzNEuyrhS9uyHB11Tg9bnYXCzfvPvOAfQ0lg) Give your side project a better first impression with a memorable dot com domain ([full archive](=.GGJzFL-7os8S83UJ4nqDwdq4q3_qhLzxoNokhEhYyI0)) I handpicked over the past week. They are all available to register right now. First come, first serve. • [Dipsly.com](=.jE7Xeb_3pbb4UwSvglJ4YUkhZ1HxIgDcoerLhsKOUOA) • [Skunkle.com](=.5c-rKGsCMYwB6eL6utoZTAXsixPbe57oY6Hos11chp4) • [Nerony.com](=.MzmOGcljEzWMeAvK1lkkfkW_tQ8F_ewR-GfrlFhKKQo) • [iberly.com](=.Psjl005E3Tpap0-9ftevAEJkjo4nuRaiekl7mUy1wRg) • [Festilla.com](=.I_jnL9dKXEf2p9SQ8_svjLM9OUL2cyGMk-KYJUHoEhc) • [PiIvy.com](=.AV4nWJcXZF_-ZmooFWRWYdnX5Y-z9Tv8hZKA2LEJvLQ) • [Proselly.com](=.wLNmxxwbTN0xmX8SyLRb4q1J2I2EgKsiO8KcAz5gRpM) • [Montolo.com](=.AYvTTcGngC_Np8M7m-eAuCbYGp9QjoQxzRWZMvobslg) FYI: these just sold that we previously listed: • [Wocolo.com](=._Wz3EoUrAdpavkBHC06y4cYaniUnnW9yCnAvLC3_Tr0) • [Piroti.com](=.hNPq4QtlidOA20cYkxHZ_CdIrnda5BpM2Nx4UEEoHD0) • [Jiveli.com](=.dRZKui3uLN6lO1Q2I_FZNbzpTXaZzDP-ihdcwfhuxwI) • [Kuzbi.com](=.CpWouLDMgfdS4tSnoUBCrpAGAGM2MTi5MUTvKlDKKJQ) [Tweet of the week](=.yTU-fPZFBmUJVX6EXy70iQWLbPmh1WBlE3jOadX3uwU) [Bonus](=.HR2Kk4O1255MQnW8CmtetLXSnj6Xdvf1MYczJ7ZO1Oo) [My favorite online finds.](=.vgg1PXg6wsTFO8XxmZCzwA1mB5t_15b2ITvIM67az_o) A few resources for your next project but also some inspiring links to take a break with. Experienced anything special recently? Holla. [099 Premium Mockups](=.yZzpNoCKoT8bl8Vue-aBylOeUuZcpsjycEucdgdoJLQ)[- A gorgeous range of high quality mockups to give your product launches that luxury quality feel. Use the coupon ONEPAGELOVE for 10% off.](=.hqK-B7dC0GCqj13mwIMZKvW-E7eetWuvgilOntEJxPs) [120+ SVG Shapes](=.qt9AeZzfscNgvaXOhrRbVhBINtz0gzfZQ2N5x3yqIGk)[- A ton of basic copy-paste SVG shapes for your upcoming projects by Monika Michalczyk.](=.dVtoLMi64_Z5utUSAzFptsrZ8alfRPGChoaLX6eZU8s) [The worst volume control UX](=.ckju8IcGdMRepMx2xNn6T6TBR-HyDv8BNvfE22xGl5c)[- In 2017, a group of developers hilariously competed for who could create worst volume control interface in the world. The results are incredible... and all curated in this Twitter thread.](=.MUeDNkAvt0tUZoXRpUO_2WfKRrDgYv-kAvLaKcuoSuw) [Arc Sauna](=.Nys6hD5wCXuWfLFh_7uayhLbjSMHtQvTxCIqsqIvVY4)[- This one stopped me in my tracks a bit. Minimal, beautiful, uniquely small. Shout-out to the product photography too. h/t Typewolf.](=.ykVC6bbPCMGoYZVmx6R-SZkrvqXEfQP-ZNY59loSCrM) [Fresh Fonts Newsletter](=.iCEHTv6IyAngZWMt6GYamSK2T6XHMgoO_ARuvbi9s_g)[- Great to see the relaunch of the curated typeface monthly newsletter. It's free for the curated mailer but for $15/mo, the premium newsletter includes a bonus typeface from a quality foundry.](=.2APD4wDwbmI8KMutqa7HMe8KhHs94nLvj2iVEhpY9wc) [MacBook Air M2 Free Mockup](=.fC6ocA6_Y1dwkfV133tkx1ZBjZq1LgeUrnj-8R4MWwU)[- Super clean, single front view. Great to announce a new site design. Free for Figma.](=.y98lDa0Tzc6xfqqr1aZou-VTdOs1Kl2yph2jNypP7-g) [Landing Page Hot Tip](=.1m1ArVdQ9NlN1_bxCYF7ck8LjfqRf7ehV6aQYy4h1F4) [Use fewer fonts](=.dl_CsjiQRYNFm0QzcuvXFAoR2rXjt8P0iewRuILJsGo) Hot Tip #26 is to use fewer fonts. Multiple typefaces, each with a number of weights, add unnecessary load time to a Landing Page. Consider pairing your primary typeface with a native system font to keep it lean A fast-loading Landing Page with a more organized typeset is classy and considerate. ps. here is a good [System Font Stack](=.5U0qJ1oVBld2OzfasRxG4S3tyZ6Tv3RWSDJQzZHRA40) breakdown by the legends at CSS Tricks. [Your Curator](=.A02wrvL2sSM5BQOfaUPPxSaaMAclg_7d9Cv72V4guOg) [Hey! I'm Rob Hope.](=.zDQSE6BER8uh8e6vZ6JHgw_01BQyAFFb0iSP5ntkG54) If you are enjoying [One Page Love](=.j7yX7WOW1Ns_IIOlelMad5h2El8w1pSvL5t3h1Xadzw) and the Love Letter editorial here are a few ways to help support the work I do. [Rob Hope](=.hkN9AoaMnyn0GycMifoQnIi3Cct1rK47IufKf1tpnS0) Spread the love about [onepagelove.com](=.UBfij0DHeYPKDISrPzBz_Ead-ZhPeLwMXqZti7jMmaQ) - here is a [presskit](=.w9N0fhEROMbGavVn0Qn7RHR17zSgp0-BpfXMI3AA-00). Grab my [Landing Page Hot Tips Ebook](=.VB8lEtENIU-MBnflLG7ejs8ypuikWGUCpiVcgW6O0Io) (here is 40% off). Follow [@robhope](=.lm9Ga1w9FOunxx5emtvJYcqfC5qJhKKbm-MOSP4n7fY) or [@onepagelove](=.Qxdq07LCGuooWuRrFDEIH-wbRK0IR3RT29QBsPosU3I) on Twitter. Review the [Yo! Podcast](=.xZ-6nYA44z_5ysvhiuN1ynToW9j_Mx25YUdUGNdXopk) on [Spotify](=.QaoZn1_p6z-hJCpTMRXJr-RFvFM5z3N-naSoc6bGM5I), [Google Podcasts](=.kVRjkpRYyHjK1AnFjUJmdpyPMao_CeuNYM4FeiDO5WU) or [Apple Podcasts](=.bX-wH4QtsgfyPr9KK2D-mveIh-zojikhY5EbWQ7KEw8). Give [Algolia](=.Tt2RApWdLql6JvDv3g0hxMa6r1TNHhl7HiqUtWH2H0o) - our new site search engine a try for your next project. [Unsubscribe](=.Xp8BWw68T0zSlHQB0sadh88ZtSeKnPKQQUisIJ_6rSQ)