Show HN: I made a no-code tool to create animated technical papers

  • Hi HN,

    My name is Rahul Sarathy and I created TextFrame, a no-code platform to create animated written content. I've linked an example here where I use TextFrame to animate the Bitcoin white paper.

    You can check out more examples are https://textframe.app/examples

    If you're interested, feel free to sign up and play around with the software.

  • I like the idea, but as someone who might use this type of tool, you need to say somewhere fairly early on that there is a way for me to download my "paper" and host it myself.

    I'd never start putting significant work into writing a paper, or book, on a platform which might close and take all my work & animations with it.

  • This is a really interesting and deceptively simple idea. "Animate technical papers" seemed (to me) like a silly concept as a one-liner, but the example really does the media format justice and totally changed my mind - why hasn't this been done before!

    Well done Rahul!

  • Congrats ! I think you should make sure an animation stops before the next one starts, or something similar. I am a burst scroller (read the full page, then scroll), and sometime I have to be very careful about how much I need to scroll to not trigger 2+ animations at the same time. Maybe an indicator somewhere the show where animations would happen so that I can control my scroll ?

  • Please ignore all the comments where people are hung up on the 'technical papers' bit. This is great and you should be proud of what you've made. It is under no obligation to fulfill the expectations of a previous generation of media for one specific use case. I think a lot of people resort to slide decks to accomplish what you've built and IMO this is better.

  • I found the Bitcoin paper example to be very compelling - really awesome work! You have a great eye for design.

    I signed up and liked the familiar Notion-style interface, however I had some difficulty figuring out how to create the same caliber of animations as your examples, and get them to sync up correctly with the text - would be nice to get a bit more help when opening the animation editor for the first time.

    Edit: also not able to delete blocks and re-order, and I am still trying to figure out the controls to switch between editing different animation steps.

  • Hi Rahul, here is some critique as a user / reader:

    - While I was reading (left column), the image (right column) changed but I did not catch it, since my focus was on the left column

    - Sometimes when I was reading and the image changed, I was not sure which part of the reading section the new image referred to.

    - Due to the 2 above things, I had to do a lot of left and right eye movements with every scroll of the mouse wheel.

    Now, I am not sure of the best solutions for the above problems, but just wanted to bring these "user experience" challenges to your attention.

    Nice work!

  • I like the approach and it looks cool, but you might struggle with the target market here.

    Most people reading technical papers care absolutely zero about the animations in between the diagrams and figures.

    For example, the Bitcoin whitepaper animations probably bring no value, and I personally would prefer to rather read the PDF version of that.

    With that in mind, you may still be on to something, but I suspect there needs to be another value proposition here that perhaps you haven't identified yet.

  • Really cool, but the examples don't work well for me. One scroll step with my mouse on Windows is enough to scroll past some of the intermediary animations. A lot of information is lost because of that. I have to slowly drag the scrollbar with my mouse to view all animations.

    Another thing that has been pointed out is that this needs to degrade gracefully for PDFs and printed media.

  • This is incredible! I spend a lot of time thinking about how reading can be enhanced with visual aids for language learning, and am in the process of building something similar for visual story telling. I absolutely love how you’ve managed to make the visual content feel so fluidly combined with the text!

    Super impressive, and inspiring for my own pursuits :)

  • This is awesome!

    I also recommend Idyll, a JS / React framework for creating scrollables:

    https://idyll-lang.org/docs

    I am a backer in the open collective :]

  • There's a lot of information happening and there's a huge chance I might miss something because the scroll animation is quite sensitive but I'm really amazed by the idea.

  • Super impressive Wysiwyg editor. Which part of the product did you build first? Did you build an example output page first the the editor, or did you start from the editor itself?

  • This is great!

    Even more so, because it might be a glimpse of a 'next-gen' PDF format.

    PDF can include vector graphics. In the same way that SVG encompasses both static and animated images, there's no reason why similar graphics in a 'PDF-next' document shouldn't be animatable, with a fall-back to static images for printed output...

    The next step would be to get together with Adobe/Apple/Microsoft and convene a panel of experts to thrash out the details ;-)

  • This is actually a really nice idea. In my current gig we write technical documentation (before implementing) that has both words/sentences and visuals in it. My co-workers have to approve the document before I (or somebody else) implements it. This would be a really great way to read such documents.

  • Very cool. I was impressed with the no-code aspect - especially for WYSIWYG based tech writers.

    Have you considered integrating with DocFX, Jekyll, Read The Docs and the ilk. I'd think for a lot of Tech Docs where we have a ton of flow diagrams, would be interesting.

  • Thumbs up. Enjoyed the demo.

    As someone who reads technical papers and is a visual learner, I enjoyed this demonstration a lot. I'd imagine website/webapp-based electronic textbooks favoring this format.

  • nice idea but I think not knowing exactly when the animation will change is really a negative. it's fine if you are reading and scrolling slowly in a linear manner, but whenever you want to do other things like jump 3 sentences etc. it becomes confusing for me. I see that you put visual indicators on the left of the text whenever theres an animation,but maybe a better idea would be to put permanent indicators so the reader knows where are these animations are triggered.

  • Technical frills are nice and all, but I wish some effort would be put into degrading gracefully. It's impossible to print this paper, for example.

  • Love it. Personally I would love a slightest bit of resistance while I scroll to the next page or animation pane. The fluidity is kinda weird to me.

  • I for one really like this. Great work, and I would absolutely use (and pay for) this once it gets a bit more mature!

  • Very cool tool. Great not just for papers, but websites too to explain how tools work for example

  • But one of the picture is not accurate. In BTC users do not vote on which chain to keep!

  • Nice idea. We need more tools to build various explainers. Ideally, embeddable.

  • I can see how this would be really useful to better explain technical content and make long form content more engaging.