[{"data":1,"prerenderedAt":360},["ShallowReactive",2],{"project-11396345":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":44,"post_text":47,"what":48,"said":89,"maker_in_thread":196,"shape":202,"grid":206,"attempts":319,"same_week":324,"maker_shows":197,"maker_hidden":352,"reader_version":353,"card":354},"11396345","Expounder","A small JavaScript library for more engaging tutorials","title","Show HN: Expounder – A small JavaScript library for more engaging tutorials","https:\u002F\u002Fskorokithakis.github.io\u002Fexpounder\u002F","skorokithakis.github.io","StavrosK",1459423721,2016,134,48,268,2264,12,"notable","languages","javascript library","library",[24,25,26,27,28],"javascript","tutorial","inline expansion","progressive disclosure","stretch text","mixed",0.193,{"positive":32,"neutral":33,"mixed":34,"critical":35},11,13,1,4,29,{"design":38,"idea":40,"privacy":43},{"positive":39,"critical":35},2,{"positive":41,"critical":42},8,0,{"positive":42,"critical":42},[45,45,42,34,34,45,42,34,42,45,45,46,42,42,42,45,45,45,42,46,42,46,46,42,46,46,45,45,42,46,42,46,42,34,46,42,42,45,46,45],3,5,null,{"problem":49,"audience":62,"pricing":47,"motivation":75,"time_to_build":47,"stack":82,"openness":87,"stage":88,"team_size":87},{"value":50,"source":51,"evidence":52},"Explanations interrupt reading flow in tutorials and articles","inferred",[53,56,59],{"id":54,"by":11,"text":55},"11403014","The idea is that you don't need to keep track of what's what, it's all original text. Why did you feel you had to distinguish?",{"id":57,"by":11,"text":58},"11404003","I see what you mean, but why does it matter? By the time you've read the explanation, you've moved past it, and no additional action is necessary, it's just of no interest to you…",{"id":60,"by":11,"text":61},"11405144","> I can't quite explain it but it feels quite weird. I definitely know what you mean, but it's a problem with me being compulsive about having opened things stay open, not with…",{"value":63,"source":51,"evidence":64},"Writers of tutorials, articles and wikis",[65,69,72],{"id":66,"by":67,"text":68},"11401647","kaishiro","I feel like this could be a really interesting tool for wikis. It'd be neat to be able to read what is, essentially, an executive summary of a topic, but then be able to drill…",{"id":70,"by":11,"text":71},"11401723","That's one of the reasons I developed this. You could essentially go into as much detail as you wanted in the topic you wanted. Of course, the writer must be careful not to…",{"id":73,"by":11,"text":74},"11401719","That's another feature that's requested a lot. I'm still not convinced that it's something people request because they actually want to re-collapse the text or just because…",{"value":76,"source":77,"evidence":78},"Make tutorials more engaging by letting readers expand explanations","maker",[79,81],{"id":80},"post",{"id":70,"by":11,"text":71},[83],{"value":84,"source":51,"evidence":85},"JavaScript",[86],{"id":80},"unknown","launched",{"praise":90,"objections":107,"requests":145,"questions":165,"alternatives":176},[91,99],{"value":92,"source":93,"evidence":94},"Clean implementation of old stretch text idea","commenter",[95],{"id":96,"by":97,"text":98},"11402598","polm23","This is an old idea in Hypertext called Stretch Text (since 1967!): https:\u002F\u002Fen.wikipedia.org\u002Fwiki\u002FStretchText Every so often someone hears about the old hypertext theory and…",{"value":100,"source":93,"evidence":101},"Useful for wikis and multi-level explanations",[102,103],{"id":66,"by":67,"text":68},{"id":104,"by":105,"text":106},"11431545","ivan_ah","Fully agree. Your semantics of \"expounder\" and \"expounded\" spans is much more coherent. It's a new modality, but I think it has a lot of potential: I love explanations with…",[108,122,130],{"value":109,"source":93,"evidence":110},"Inline expansion shifts surrounding text and disrupts reading",[111,115,119],{"id":112,"by":113,"text":114},"11402166","vcarl","It throws off my reading if I'm just checking that I know what something is and only need a quick skim to verify that. I immediately lost track of what was the explanation and…",{"id":116,"by":117,"text":118},"11404985","IanCal","There are a few things: Even if it's not that useful, it's what I expect to happen without thinking. Having no \"undo\" makes me wonder what happened and a vague fear that I've…",{"id":120,"by":117,"text":121},"11405439","> I definitely know what you mean, but it's a problem with me being compulsive about having opened things stay open, not with the things themselves :P I disagree, it's not about…",{"value":123,"source":93,"evidence":124},"No way to collapse expanded text again",[125,129],{"id":126,"by":127,"text":128},"11401649","jtmarmon","and add an option to re-collapse the text",{"id":112,"by":113,"text":114},{"value":131,"source":93,"evidence":132},"Tooltip or popup might work better",[133,137,141],{"id":134,"by":135,"text":136},"11402813","Negative1","Wouldn't a tooltip give the same information while taking up less space and not messing up your carefully setup layout?",{"id":138,"by":139,"text":140},"11402161","p0larboy","(Click -> Tool tip) works better IMO. The sudden append of words threw off my reading rhythm.",{"id":142,"by":143,"text":144},"11401753","arikrak","Or maybe just use a popup, not sure if inlining it is better.",[146,151,158],{"value":147,"source":93,"evidence":148},"Ability to re-collapse expanded text",[149,150],{"id":126,"by":127,"text":128},{"id":73,"by":11,"text":74},{"value":152,"source":93,"evidence":153},"Preset expansion levels like TL;DR or ELI5",[154],{"id":155,"by":156,"text":157},"11402749","amk_","Interesting. I personally like to use sidenotes for this type of thing on my website; it's nice to be able to scan the sidenotes for additional info without clicking on anything.…",{"value":159,"source":93,"evidence":160},"Better indication of which text was expanded",[161],{"id":162,"by":163,"text":164},"11401645","bart3r","My advice would be to somehow indicate exactly the text that was expounded - maybe with a faint underline or something. When it expands out, it's sometimes difficult to track the…",[166],{"value":167,"source":93,"evidence":168},"How do screen readers handle hidden expanded text",[169,173],{"id":170,"by":171,"text":172},"11401798","GroSacASacs","How does a screen reader handle that ?",{"id":174,"by":11,"text":175},"11401812","I'm not sure (I'd appreciate some feedback by someone who uses one), but I'd think it would just read the whole text. Depends on what it does with hidden text.",[177,181,187,191],{"value":178,"source":93,"evidence":179},"Stretch Text hypertext concept",[180],{"id":96,"by":97,"text":98},{"value":182,"source":93,"evidence":183},"Telescopic text",[184],{"id":185,"by":105,"text":186},"11402243","Very nice, reminds me of telescopictext. Here's an example that explains magnetic fields: http:\u002F\u002Fwww.telescopictext.org\u002Ftext\u002FpFjkqQY9bmfvQ",{"value":188,"source":93,"evidence":189},"BigfootJS footnotes",[190],{"id":155,"by":156,"text":157},{"value":192,"source":93,"evidence":193},"Sidenotes and tooltips",[194,195],{"id":155,"by":156,"text":157},{"id":134,"by":135,"text":136},{"comments":197,"answered":34,"key":198},14,[199,200,201],{"id":73,"text":74},{"id":54,"text":55},{"id":57,"text":58},{"commenters":203,"max_depth":41,"maker_replies":197,"first_comment_mins":204,"lifespan_hours":205},27,706,125,[207,209,210,212,214,216,219,222,223,224,225,226,228,231,235,237,239,243,246,247,250,252,255,257,261,265,267,270,273,275,278,281,282,284,287,288,290,291,294,298,300,304,306,307,309,312,314,317],[162,42,45,208,163,42],"project\u002Fneutral\u002Fdesign",[126,42,45,208,127,42],[73,42,42,211,11,34],"maker\u002Fneutral\u002Fdesign",[112,42,34,213,113,42],"project\u002Fcritical\u002Fdesign",[54,42,42,215,11,34],"commenter\u002Fneutral\u002Fdesign",[217,42,34,213,218,42],"11404818","throwanem",[220,42,45,208,221,42],"11403038","gravity13",[57,42,42,215,11,34],[116,42,34,213,117,42],[60,42,42,215,11,34],[120,42,42,215,117,42],[227,42,45,208,221,42],"11405806",[229,42,45,208,230,42],"11403535","mc808",[232,42,46,233,234,42],"11404026","project\u002Fpositive\u002Fdesign","chris_st",[236,42,42,211,11,34],"11404144",[238,42,42,211,11,34],"11401713",[240,42,42,241,242,42],"11403133","other\u002Fpositive\u002Fnone","NicoJuicy",[244,42,42,245,11,34],"11403735","maker\u002Fneutral\u002Fperformance",[142,42,45,208,143,42],[248,42,45,208,249,42],"11402022","lfowles",[155,34,45,251,156,42],"project\u002Fmixed\u002Fdesign",[253,34,42,254,11,34],"11403743","maker\u002Fneutral\u002Fidea",[96,39,46,256,97,42],"project\u002Fpositive\u002Fidea",[258,45,45,259,260,42],"11401350","project\u002Fneutral\u002Fidea","Kinnard",[262,45,42,263,264,42],"11401461","commenter\u002Fneutral\u002Fidea","harel",[266,45,46,256,260,42],"11401488",[268,45,46,256,269,42],"11401520","ponyous",[271,45,42,272,11,34],"11401563","maker\u002Fneutral\u002Fnone",[274,45,46,256,260,42],"11401591",[276,45,42,277,11,34],"11401606","maker\u002Fpositive\u002Fidea",[279,35,46,256,280,42],"11405186","rawnlq",[134,46,45,208,135,42],[185,283,45,259,105,42],6,[285,283,42,286,11,34],"11404023","project\u002Fcritical\u002Fdocs",[104,283,46,256,105,42],[66,289,46,256,67,42],7,[70,289,42,254,11,34],[292,289,46,293,67,42],"11401773","maker\u002Fpositive\u002Fnone",[295,41,42,296,297,42],"11402373","other\u002Fneutral\u002Fnone","watson",[138,299,34,213,139,42],9,[301,302,46,256,303,42],"11402088",10,"steveklabnik",[170,32,45,305,171,42],"project\u002Fneutral\u002Fprivacy",[174,32,42,272,11,34],[308,32,42,296,171,42],"11407186",[310,18,45,259,311,42],"11404533","visarga",[313,33,46,233,264,42],"11401463",[315,197,45,272,316,42],"11401358","ChristianBundy",[318,197,42,272,11,34],"11401561",[320,321],{"id":4,"t":12,"points":14,"comments":15},{"id":322,"t":323,"points":34,"comments":42},"18238499",1539781216,[325,330,335,340,344,348],{"id":326,"name":327,"points":328,"category":329},"11407536","webkay",553,"security_privacy",{"id":331,"name":332,"points":333,"category":334},"11439879","Popper.js",169,"dev_tools",{"id":336,"name":337,"points":338,"category":339},"11403930","Triangul-Art",138,"creative",{"id":341,"name":342,"points":343,"category":334},"11423070","WrapAPI",111,{"id":345,"name":346,"points":347,"category":334},"11396702","tmux2html",99,{"id":349,"name":350,"points":347,"category":351},"11412811","estimatrapp.com","productivity",false,"v2",{"id":355,"name":5,"line":6,"ai":352,"cat":20,"year":13,"points":14,"comments":15,"rec":29,"s":356,"top":18,"kw":357,"maker":11,"domain":10,"tier":19,"attempts":39,"strip":358,"url":9,"mix":359,"praise":92,"objection":109,"sub":21},11396345,0.19,[24,25,26,27,28],"3301130103350003330505505533050501500353",[32,33,34,35],1794036542760]