[{"data":1,"prerenderedAt":460},["ShallowReactive",2],{"project-22364040":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":29,"sentiment":30,"stance_mix":31,"scored_comments":36,"aspects":37,"strip":47,"post_text":49,"what":50,"said":88,"maker_in_thread":207,"shape":215,"grid":219,"attempts":422,"same_week":423,"maker_shows":34,"maker_hidden":452,"reader_version":453,"card":454},"22364040","Trevor demo","Build a JS-only interactive product walk-through for your landing page","title","Show HN: Build a JS-only interactive product walk-through for your landing page","https:\u002F\u002Fgithub.com\u002Ftagspace\u002Ftrevor-demo","github.com","tagspace",1582103046,2020,184,83,314,3028,11,"notable","dev_tools","product walkthrough widget","library",[24,25,26,27,28],"product walkthrough","interactive demo","landing page","onboarding","javascript","mixed",-0.133,{"positive":32,"neutral":33,"mixed":34,"critical":35},8,14,1,15,38,{"idea":38,"design":41,"docs":43,"execution":46},{"positive":39,"critical":40},3,4,{"positive":39,"critical":42},9,{"positive":44,"critical":45},0,2,{"positive":45,"critical":44},[34,34,44,39,39,39,34,34,44,44,39,34,34,39,34,34,48,48,39,48,34,34,39,39,34,34,39,39,48,39,44,44,44,39,44,44,44,44,39,48],5,null,{"problem":51,"audience":61,"pricing":49,"motivation":69,"time_to_build":49,"stack":76,"openness":85,"stage":86,"team_size":87},{"value":52,"source":53,"evidence":54},"Showing product usage to landing page visitors without embedding a full platform","maker",[55,58],{"id":56,"by":11,"text":57},"22364578","hey speedgoose. Totally agree. You mean the ones in-platform, before you can use the product, right? Yeah, we don't like those either. This is an optional walk-through on the…",{"id":59,"by":11,"text":60},"22365001","Good point. I just meant as opposed to some SaaS platform widget that you have to embed (and potentially pay for).",{"value":62,"source":63,"evidence":64},"Websites wanting interactive product demos on landing pages","inferred",[65,66],{"id":56,"by":11,"text":57},{"id":67,"by":11,"text":68},"22364068","Happy to answer any questions on how we built this, if anyone's curious to use it for their own site. Is pure javascript (with jquery animations).",{"value":70,"source":53,"evidence":71},"Wanted to show product value before signup, without embedding a SaaS widget",[72,75],{"id":73,"by":11,"text":74},"22367148","It's true. The problem we have though, is that there's a bit of setup involved to connect Trevor to your database, so we want to show the users the value add early as possible…",{"id":59,"by":11,"text":60},[77,81],{"value":78,"source":53,"evidence":79},"JavaScript",[80],{"id":67,"by":11,"text":68},{"value":82,"source":53,"evidence":83},"jQuery",[84],{"id":67,"by":11,"text":68},"open_source","launched","company",{"praise":89,"objections":113,"requests":157,"questions":177,"alternatives":185},[90,106],{"value":91,"source":92,"evidence":93},"Simple, clever solution","commenter",[94,98,102],{"id":95,"by":96,"text":97},"22364310","Martinsos","I love how simple the solution is, I tend to over-engineer stuff like this by trying to actually make it clickable and so on, but this just works great - good example of doing…",{"id":99,"by":100,"text":101},"22364282","matijash","This is really cool stuff! I was wondering what cool technology is behind this demo, and then it turned out to be so elegant and simple :).",{"id":103,"by":104,"text":105},"22364834","losthobbies","I really like this. Nice and simple",{"value":107,"source":92,"evidence":108},"Refreshing use of plain JavaScript",[109],{"id":110,"by":111,"text":112},"22364468","npsomaratna","I find this refreshing. jQuery works very well for simple and direct stuff. No need to over-complicate things!",[114,129,140,147],{"value":115,"source":92,"evidence":116},"Forced walkthroughs and modals are annoying",[117,121,125],{"id":118,"by":119,"text":120},"22364559","speedgoose","As an user, I usually dislike these walk-through when they are forced to me and I try to finish them as fast as possible. I think a good user interface shouldn't need them by…",{"id":122,"by":123,"text":124},"22364799","lucideer","> You mean the ones in-platform, before you can use the product, right? Not the op, but I didn't interpret the comment as being restricted to certain types. I particularly…",{"id":126,"by":127,"text":128},"22369221","cosmotic","Although the intended use of this might be help pages or screen casts, it sure makes it easy to implement modal tutorials, which is what EVERYONE hates and should avoid at all…",{"value":130,"source":92,"evidence":131},"Flying circle animation causes motion sickness and is distracting",[132,136],{"id":133,"by":134,"text":135},"22366952","jlangemeier","I think one of the biggest UX detractors that I saw with this (and the main reason I walked away from it instead of digging into how it may work) was that the circle \"flew in\" to…",{"id":137,"by":138,"text":139},"22367234","tmpfile","It seems the demo is focused on \"How to Export Trevor.io Results to Google Docs\" on first pass. It breezes past the whole Build Query part, probably since the example query was…",{"value":141,"source":92,"evidence":142},"No back\u002Fforward navigation or step count",[143],{"id":144,"by":145,"text":146},"22364765","preommr","Strongly dislike that there's no way to go back and forth or some kind of index of how many steps there are. I do like the idea of it being interactive though.",{"value":148,"source":92,"evidence":149},"Relying on jQuery is unnecessary",[150,154],{"id":151,"by":152,"text":153},"22364666","nkozyra","No need to over complicate things by adding an unnecessary library? I'm sympathetic to jQuery users and I think it's a phenomenal artifact in the history of the early web but…",{"id":155,"by":123,"text":156},"22364812","Have we really come so far that using jQuery is interpreted as not overcomplicating things?? jQuery is the extra complexity people are raising issue with here. It's not needed…",[158,162,166],{"value":159,"source":92,"evidence":160},"Support going back and forth through steps",[161],{"id":144,"by":145,"text":146},{"value":163,"source":92,"evidence":164},"Show step progress indicator",[165],{"id":137,"by":138,"text":139},{"value":167,"source":92,"evidence":168},"Use help topics or documentation instead",[169,173],{"id":170,"by":171,"text":172},"22365610","superasn","Yes but this would make much more sense if used as help topics, i.e. \"confused about how to upload your portfolio? click here for an interactive demo\"",{"id":174,"by":175,"text":176},"22373071","zzo38computer","I agree. I don't want a walk-through. I want documentation.",[178],{"value":179,"source":92,"evidence":180},"Why use pixel coordinates instead of percentages",[181],{"id":182,"by":183,"text":184},"22364406","chrisacky","Why does the adjusted function use pixels as a unit of measurement when the objective is to make the position of each 'click zone' show correctly? Is that not was percentages are…",[186,193,200],{"value":187,"source":92,"evidence":188},"Bootstrap Tour",[189],{"id":190,"by":191,"text":192},"22366860","aconst","There are a few products on the market for it (I work for one, and no, it's not WalkMe). There are free solutions too (e.g. http:\u002F\u002Fbootstraptour.com\u002F )",{"value":194,"source":92,"evidence":195},"Metabase",[196],{"id":197,"by":198,"text":199},"22367080","gavinray","The demo was neat, but (let's skip to the real reason for posting this) I think your product is pretty solid too. I looked at your pricing and your free tier is enough for…",{"value":201,"source":92,"evidence":202},"Notion landing page demo",[203],{"id":204,"by":205,"text":206},"22366080","migueloller","Notion has what I consider to be the best landing page demo [1]. It's the full application. No need to log in or follow specific steps. Scroll down to the \"Choose a workflow\"…",{"comments":208,"answered":48,"key":209},21,[210,211,212],{"id":56,"text":57},{"id":73,"text":74},{"id":213,"text":214},"22366789","This is a really nice suggestion! We could totally do that. Will run that by the team. Thanks",{"commenters":216,"max_depth":42,"maker_replies":208,"first_comment_mins":217,"lifespan_hours":218},44,7,43,[220,222,224,225,229,232,235,239,242,243,244,246,247,251,254,256,260,264,268,271,273,276,279,282,284,287,289,292,295,298,299,301,303,305,307,310,313,316,318,320,323,325,327,328,330,333,336,339,341,344,347,349,352,355,356,358,360,363,366,368,371,373,376,378,379,383,385,387,389,392,394,396,398,399,401,403,406,408,410,413,416,419,421],[118,44,34,221,119,44],"project\u002Fcritical\u002Fidea",[56,44,44,223,11,34],"maker\u002Fneutral\u002Fidea",[122,44,34,221,123,44],[226,44,44,227,228,44],"22364806","commenter\u002Fneutral\u002Fnone","lowercased",[230,44,44,231,123,44],"22364816","commenter\u002Fneutral\u002Fidea",[233,44,44,227,234,44],"22365814","pc86",[236,44,39,237,238,44],"22366247","project\u002Fneutral\u002Fidea","libria",[240,44,39,237,241,44],"22366907","Swizec",[73,44,44,223,11,34],[170,44,39,237,171,44],[213,44,44,245,11,34],"maker\u002Fpositive\u002Fnone",[190,44,39,237,191,44],[248,44,34,249,250,44],"22367068","project\u002Fcritical\u002Fdesign","andrei_says_",[252,44,44,253,11,34],"22367171","maker\u002Fneutral\u002Fdesign",[255,44,34,249,250,44],"22367412",[257,44,44,258,259,44],"22368234","other\u002Fneutral\u002Fperformance","enraged_camel",[261,44,44,262,263,44],"22376149","other\u002Fneutral\u002Fnone","satvikpendem",[265,44,44,266,267,44],"22369581","other\u002Fcritical\u002Fnone","SquareWheel",[269,44,44,270,175,44],"22373154","other\u002Fneutral\u002Fdocs",[272,44,44,262,175,44],"22380765",[274,44,39,275,175,44],"22373160","project\u002Fneutral\u002Fdocs",[277,44,44,262,278,44],"22366049","tsukurimashou",[280,44,34,221,281,44],"22367633","lunias",[283,44,44,223,11,34],"22368824",[285,44,34,286,281,44],"22369709","project\u002Fcritical\u002Fdocs",[288,44,44,245,11,34],"22370434",[290,44,48,291,281,44],"22371138","project\u002Fpositive\u002Fidea",[293,44,44,262,294,44],"22371850","msinclair",[296,44,34,249,297,44],"22369610","jotm",[174,44,34,286,175,44],[197,34,39,300,198,44],"project\u002Fmixed\u002Fdesign",[302,34,34,249,198,44],"22367113",[304,34,44,253,11,34],"22367187",[204,45,48,306,205,44],"project\u002Fpositive\u002Fdesign",[308,45,44,309,11,34],"22366829","maker\u002Fneutral\u002Fnone",[311,45,39,253,312,44],"22366920","machello13",[314,45,48,306,315,44],"22367041","hjkm",[317,45,44,262,312,44],"22366922",[182,39,39,319,183,44],"project\u002Fneutral\u002Fexecution",[321,39,44,322,11,34],"22364436","maker\u002Fneutral\u002Fexecution",[95,40,48,324,96,44],"project\u002Fpositive\u002Fexecution",[326,40,44,322,11,34],"22364324",[133,48,34,249,134,44],[329,48,44,253,11,34],"22367091",[331,48,34,249,332,44],"22367289","karatestomp",[334,48,44,335,11,34],"22368731","maker\u002Fpositive\u002Fdesign",[337,48,39,338,134,44],"22369518","project\u002Fneutral\u002Fdesign",[137,340,39,338,138,44],6,[342,340,44,343,11,34],"22368773","maker\u002Fpositive\u002Fidea",[345,217,34,249,346,44],"22366480","pier25",[348,217,39,253,315,44],"22366880",[350,32,34,249,351,44],"22364604","golergka",[353,32,39,338,354,44],"22364815","netsharc",[144,42,34,249,145,44],[357,42,44,335,11,34],"22365018",[99,359,48,324,100,44],10,[361,359,44,362,11,34],"22364321","maker\u002Fpositive\u002Fexecution",[364,18,39,237,365,44],"22364780","progx",[367,18,44,309,11,34],"22365032",[369,18,48,291,370,44],"22365426","ckluis",[126,372,34,221,127,44],12,[374,375,48,291,354,44],"22364841",13,[377,375,44,245,11,34],"22365014",[67,33,44,322,11,34],[380,33,44,381,382,44],"22364369","commenter\u002Fneutral\u002Fexecution","_eht",[384,33,44,227,11,34],"22364441",[110,33,44,386,111,44],"commenter\u002Fpositive\u002Fexecution",[151,33,44,388,152,44],"commenter\u002Fcritical\u002Fexecution",[390,33,39,319,391,44],"22364713","rajangdavis",[393,33,44,388,152,44],"22364737",[395,33,44,381,391,44],"22364790",[397,33,44,322,11,34],"22365041",[155,33,44,388,123,44],[400,33,44,227,111,44],"22365106",[402,33,44,227,123,44],"22365550",[404,33,44,227,405,44],"22366044","stepbeek",[407,33,44,227,123,44],"22367483",[409,33,44,227,111,44],"22372291",[411,33,39,322,412,44],"22364644","tannhaeuser",[414,33,44,381,415,44],"22364709","zacwebb",[417,33,44,381,418,44],"22364961","gitgud",[59,33,44,420,11,34],"maker\u002Fneutral\u002Fpricing",[103,35,48,306,104,44],[],[424,429,434,438,442,447],{"id":425,"name":426,"points":427,"category":428},"22344254","art42",277,"ai",{"id":430,"name":431,"points":432,"category":433},"22327086","DelayWebpage",232,"productivity",{"id":435,"name":436,"points":437,"category":20},"22318677","ShellMagic.xyz",213,{"id":439,"name":440,"points":441,"category":20},"22338879","Configurable Route Planning",143,{"id":443,"name":444,"points":445,"category":446},"22371436","Top Fantasy Reads",107,"learning_science",{"id":448,"name":449,"points":450,"category":451},"22357517","FounderPhone",106,"web_saas",false,"v2",{"id":455,"name":5,"line":6,"ai":452,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":456,"top":18,"kw":457,"maker":11,"domain":10,"tier":19,"attempts":44,"strip":458,"url":9,"mix":459,"praise":91,"objection":115,"sub":21},22364040,-0.13,[24,25,26,27,28],"1103331100311311553511331133530003000035",[32,33,34,35],1794036586678]