Marp: Markdown Presentation Ecosystem

https://marp.app/

by bjourne • 3 years ago

223 101 3 years ago

marp.app

jonahbenton• 3 years ago

Really like this tool, glad to see it here.

leetrout• 3 years ago

I tried marp but fell back to Google slides.

Most recently I have been using Figma with great results. I was surprised at how easy it is to make slides and with a few plugins manage page numbering and such alongside components.

Feels like there is room for something that combines marp and figma (assuming it doesnt already exist)

scrollaway• 3 years ago

I like Pitch.com for slides. They have a free tier now, I didn’t even notice.

d4rkp4ttern2• 3 years ago

No math support though

nzoschke• 3 years ago

Nice!

Back in the day I made GistDeck, which made presentations from Markdown in a gist via a bookmarklet.

https://github.com/nzoschke/gistdeck

Awesome to see this idea fully realized.

crvdgc• 3 years ago

I used to write presentation slides in Markdown using pandoc+beamer. Basic contents are written in plain Markdown, but you can always resort to LaTeX beamer for advanced features. In the end, it compiles to a PDF file.

A blog post: https://ubikium.gitlab.io/portfolio/latex-beamer-flake.html Example code: https://github.com/crvdgc/latex-beamer-flake

dr_hooo2• 3 years ago

Does anyone care to highlight the main differences between this and pandoc for creating slides in markdown?

TuringTest• 3 years ago

For a start, this one has a VS Code plugin, so you can preview the resulting slides while writing them, without having to configure a build step.

It also seems to have a DSL giving you some control of the slides presentation, which in pandoc seems limited to applying CSS.

https://marpit.marp.app/directives

gampleman• 3 years ago

I wish someone made a Markdown -> Keynote tool.

Markdown is great to write a talk (especially a talk about code) and not get distracted by pimping your slides. But once it comes time to make your slides look really great, I wish there was a proper UI for it (with fancy anination etc).

masklinn• 3 years ago

Pandoc apparently supports exporting to PowerPoint, maybe that could be a sufficient intermediate step from which you can import into keynote?

Alternatively it supports a few HTML-based slides support (as well as beamer), that’s no UI but it should offer good opportunities for styling / customising.

dainiusse• 3 years ago

Congrats for posting. But I open up the page - don't see any easy way to launch fullscreen example and I quit.

vidarh• 3 years ago

It seems like all the boxes on the front page would've lent themselves very well to a demo presentation.

d4rkp4ttern2• 3 years ago

I am always looking for ways to quickly put together math presentations and I’ve been recently turning to marp’s VS code plugin for this.

I also recently heard that quarto can do something similar (I.e markdown slides with math notation), and it also has a vs code plugin but I haven’t played with it much

Hackmd also has a nice markdown/math slides mode but unlike Marp it has no pdf export.

raesene9• 3 years ago

I think HackMD has PDF export for slides now https://hackmd.io/s/how-to-create-slide-deck#Export-slides-t...

NunoSempere• 3 years ago

See also: <https://tools.suckless.org/sent/>, which is similar but has an emphasis in minimalism and the Takakashi method (<https://en.wikipedia.org/wiki/Takahashi_method>)

dewey2• 3 years ago

There's also an alternative coming out from the people building iA Writer: https://ia.net/presenter

The problem with all of these is that there's no good way to live-collaborate with others. I feel like for most work use cases this is table stakes these days.

super256• 3 years ago

I hope they won't just focus on the presentation of graphics, but also on text.

When you have many code samples in your project, solutions like Keynote fall apart, unless you screenshot your code and add it as a graphic. Same for formulas; MathJax or something similar would be great.

I used Marp before and it was the best solution I found so far.

neodymiumphish• 3 years ago

Are you talking about collaboration during the draft process for slides? This seems like realm that HedgeDoc[0] could take on, as they already support slide presentation modes for any of their collaborative markdown files. My only issue is with how difficult it seems to an average user to make decent slides using this method.

[0] https://hedgedoc.org/

dewey2• 3 years ago

Neat, didn't know about this project. I was indeed talking about the draft-process. Thanks for sharing.

dr_hooo2• 3 years ago

HedgeDoc [0] allows you to collaborate in markdown, and also create slides.

[0] https://hedgedoc.org/ and https://demo.hedgedoc.org/slide-example?both

methyl• 3 years ago

Do you know any way to get the beta access besides just waiting?

paultopia5• 3 years ago

oooooh.... I'd love a beta invite for this if anyone has one.

doersino• 3 years ago

Since everyone's sharing their implementation of "slides, but written in Markdown", here's mine: https://github.com/doersino/markdeep-slides

It's perhaps unique in that it doesn't require any sort of build process – inheriting its approach from Markdeep (https://casual-effects.com/markdeep/), it's just an HTML file (containing your Markdown content and a few <script> tags at the bottom) and a bit of JS/CSS.

amtamt• 3 years ago

This is so nice. One feature I would like to see in web presentation tools where we can run multiple browsers in different location with participant view, synced with the view what presenter is showing. Can save a ton of bandwidth then by not having to share the screen and not having to need video streaming.

jskherman• 3 years ago

For reveal.js, there's the multiplex[0] plugin that can synchronize views.

[0] https://github.com/reveal/multiplex

adjusted• 3 years ago

use https://github.com/slidevjs/slidev instead, its much better

detaro• 3 years ago

what's better about it?

erremerre• 3 years ago

I never understood the appealing of Markdown for this kind of projects. At least on my environment, a presentation is a document that get send to different people, or live in a network/sharepoint folder were several persons contribute to it.

I imagine it must be a time saver for somebody, otherwise they were not be so many markdown presentation frameworks. But I can't figure it out the case.

blindseer• 3 years ago

The idea is that if you just wanted to send someone something to read you could send them a PDF or word document.

If I wanted to present it you could build a ppt.

And having the source for this un Markdown to use with pandoc is nice.

benrbray• 3 years ago

For me it's the ability to type math in LaTeX notation on the slides. Google slides doesn't support this and neither did PowerPoint last time I used it many years ago.

When I was a TA I used a plugin to let me display Jupyter notebooks as a slideshow, that was really handy. Much better editing experience than ppt plus you have readable diffs with git.

AeroNotix• 3 years ago

I would assume the vast majority of use-cases for this kind of thing is that Markdown is really easy to write, simple to add the few markup type things you'd want (bullet lists, tables etc) while having a simple enough format to render to various other formats which are more widely accepted as being "professional" enough for presentations.

t43562• 3 years ago

You can put markdown into git and see diffs of it as it changes. This is easier with a text format than with PDF.

On top of that you can just concentrate on the content because how it gets shown is mainly handled by the system not you. There might be less freedom but you are freed from burden too.

w0m• 3 years ago

Git is the answer. Inline rendering and versioning/sharing baked in.

wink• 3 years ago

I wrote something like this for conference talks ~12 years ago because I hate PowerPoint and don't have a Mac (for whatever not completely disastrous presentation tool my coworkers used). Didn't use it for a while but markdown to latex-beamer made total sense to me.

paultopia5• 3 years ago

TBH the appeal for me is that using powerpoint and the like is miserable. The moment you have more than one element on a slide, it's click click click click click click drag drag drag drag click click drag drag click drag killself to get anything aligned and somehow it still comes out ugly and just MAKE IT STOP.

the dream is that something could do for slides what LaTeX did for text---just make it possible to have basically attractive defaults for most cases rather than have to either tolerate ugly or spend hours doing layout

xigoi• 3 years ago

the dream is that something could do for slides what LaTeX did for text

Why not use LaTeX (Beamer) for presentations?

sfpotter6• 3 years ago

Honestly, it's not that bad. I've used Beamer for years, and every time I make a presentation using it I fantasize about finding something like Powerpoint to use instead. You think adjusting things is bad in Powerpoint or Keynote, but it's much worse in LaTeX where you only have loose and indirect control over layout, unless you use something like PGF/TikZ, which is just... tedious, let's say. I have thought for a while that taking a class to learn how to properly use something like Adobe Illustrator would repay itself many times over.

Also, a poor craftsman blames his tools... things like Beamer might "look nicer", but the downside is homogeneity. I've you seen one Beamer presentation, you've seen them all. On the other hand, the "ugliness" of a Powerpoint or Keynote presentation is probably down to your lack of skill at visual design.

jnsie• 3 years ago

I've had the exact opposite experience, to be honest. Powerpoint is about the most drag-and-drop friendly tool I've used and makes creating presentations a breeze for my use case. It offers vertical and horizontal guides when moving objects around and manipulating text and images is much more intuitive in my experience than manipulating CSS/HTML/Markdown. I guess my use cases differ from many on here...

Helmut100014• 3 years ago

For my lectures [1], I use reveal-js [2], created with Jekyll from Markdown slides [3], surprised no one has mentioned reveal-js so far. The combination with Jekyll is great, since you can author & organize larger lectures in multiple smaller, ordered Markdown files. Reveal also has some really nice code animations, e.g. [4] or [5]. This [6] is the git repo for [1].

[1] e.g. https://kartographie.geo.tu-dresden.de/ad/python_datascience...

[2] https://revealjs.com/

[3] https://github.com/sylhare/Reveal-Jekyll

[4] https://kartographie.geo.tu-dresden.de/ad/python_datascience...

[5] https://kartographie.geo.tu-dresden.de/ad/python_datascience...

[6] https://gitlab.hrz.tu-chemnitz.de/tud-ifk/python_datascience...

kmarc2• 3 years ago

I wanted to love revealjs... but the "everything centered" approach seems to me low-effort and chaotic. Maybe a pleasure to author and render it, but hard to follow as a viewer the always position-changing content.

Helmut100014• 3 years ago

You are free to layout your slides in any way with revealjs. To disable auto-centered content:

```

Reveal.initialize({ disableLayout: false });

```

pydry• 3 years ago

I'm curious what people's experiences are who have used both. It seems to be the most solid competitor in this field.

buro9• 3 years ago

https://pkg.go.dev/golang.org/x/tools/present

This has been in Go from the very early days - also Markdown.

pickledish3• 3 years ago

Ha, I am stunned to see there are so many of these!

I’m sure they all work very well, in my own case I’ve been using Deckset for a number of years now and have always been impressed with the polish and usability:

https://www.deckset.com/

threatofrain• 3 years ago

Does Deckset support Latex?

pickledish3• 3 years ago

It does!

https://docs.decksetapp.com/English.lproj/Formatting/08-form...

(their docs are also quite good in my experience)

ngrilly• 3 years ago

DeckSet, but I miss being able to create my own template, for example to add a small logo in a corner to follow corporate guidelines.

cjmcqueen• 3 years ago

Is this a creature comfort wrapper for reveal,js?

pickledish3• 3 years ago

I doubt it uses reveal.js under the hood, but, yeah I think they can effectively do all the same stuff! I just like it because I tried reveal.js (disclaimer, a while ago) and found it kinda fiddly whereas the macOS-native UI of deckset was nicer to use

xavdid• 3 years ago

Same! I rarely use it anymore, but was always very pleased at the Deckset functionality.

7174n62• 3 years ago

I like writing in markdown and use it literally everyday. But...powerpoint and keynote are so simple, and universal, why would you use anything else to slap together a basic slide show. Yeah I know...independence... forever format... F'Microsoft. Well, I'll take convenience and productivity, thank you very much.

pohl• 3 years ago

While mousing around in a gui to build pages of slides may have a better initial UX, it can never match the productivity of a user who knows the markdown rules creating one small file in a plain text editor.

7174n62• 3 years ago

I agree with that. But if you're doing a presentation about something then curb appeal matters. You can't beat ppt and keynote for simplicity and making it look good too.

bachmeier• 3 years ago

Well, I'll take convenience and productivity, thank you very much.

This is exactly the reason many people, myself included, prefer markdown. If you want to make an obviously provocative comment like this, you should add some substance it.

amai• 3 years ago

I believe https://quarto.org/ is the way to go in the universe of Markdown tools. At least for serious scientific presentations it seems the better choice. Under the hood it uses pandoc markdown and converts it into a revealjs presentation.

michaelrpeskin2• 3 years ago

I _really_ want to like any of the markdown to slides tools, but I can never find one that makes sense for my workflow.

I've revamped my entire workflow around writing proposals, reports, and other collaborative documents using markdown. With the time savings of using plain text and git, I can put together a professional looking document in a third the time compared to when we were all passing around proposal_version2_final_final2.docx around. And with most of the company using Azure DevOps wikis which are markdown based, I can have everyone collaborate in the wiki and then I pull the repo locally, cat the .md files together and render as a pdf and send it out.

...but my presentations are typically a title, one or two phrases, and a figure. And then I mark up the figure with arrows or circles, or other overlays. The only way I can get that to work in a markdown-to-slides workflow is to end up drawing the figures in powerpoint or draw.io or something, exporting them as a png and embedding them in the slide. So if I'm going to be in powerpoint anyway, I just end up making the slides there.

That being said, I'll probably spend the day in the Marp rabbit hole and see if I can get it to work for me. I hadn't heard of it until today. If I can live in markdown and VS Code, I'll be happy!

Helmut100014• 3 years ago

For reveal-js, you can always use `?print-pdf.` to get a static PDF from your slides.

[1] https://revealjs.com/pdf-export/

michaelrpeskin2• 3 years ago

I created a makefile that takes the markdown and generates pdf and other outputs using pandoc with reveal-js. It works great for me except for the part about managing complex figures that I need a gui to draw. For figures that I create in python, that's great (I believe quarto was mentioned earlier, and that works great for more dynamic figure too). But if I'm annotating figures, opening up ppt and adding an arrow and text box is so easy.

I try to model my figures after these suggestions (it means it's not easy to make figures without a visual editor): https://www.youtube.com/watch?v=Unzc731iCUY

pugillum• 3 years ago

You can actually embed drawio files directly in Markdown by creating your files as drawio.svg and then linking them in the Markdown, e.g. ![](my_lovely_drawing.drawio.svg). I explain it in this blog post: https://www.pugillum.com/posts/2021_11_28_drawio_in_markdown.... This also works for Marp slides

masukomi2• 3 years ago

https://github.com/doersino/markdeep-slides

markdeep slides can support all the stuff that markdeep supports https://casual-effects.com/markdeep/ Admittedly, creating that asciiart by hand is obnoxious, but tools like monodrow https://monodraw.helftone.com/ make it easy.

However, then we're right back at the question of why bother using markdown if you're making complicated graphics in another tool anyway.

I love Monodraw and use it for many things (it can create svg and png and other formats not just ascii) but yeah, it doesn't seem like a great solution for your use case.

vongomben• 3 years ago

Cool! Also alle the other links other users are posting.

Question: is there an option obsidian plug in for this?

NickFanion• 3 years ago

My pain point with these tools has been that my presentation ultimately ends up in the hands of business users, and they expect an editable PowerPoint. This includes native charts/visuals/tables. They don't like giving up control and get frustrated if a chart is an image or an SVG shape. Even when these tools export to PowerPoint, there is no native chart capability.

GuB-422• 3 years ago

Here is a trick for you if you want some to have a somewhat editable SVG chart in PowerPoint.

Import your SVG in LibreOffice Impress, right click on it and select "Break", save your file as a .pptx, open your file in PowerPoint, copy the chart to your presentation.

I have used it a few times because I generated my charts using graphviz and the business people wanted something editable within PowerPoint. It is far from perfect because anchors are not supported, but it is enough to do minor modifications like fixing typos or changing the font for something similar sized.

graphviz2• 3 years ago

Do you mean anchors as in clickable objects, or do you mean attachments points on nodes for incident edges that stay attached if the node is dragged?

bad_username• 3 years ago

I love the idea of Markdown and try to use it everywhere where there's a need to write text. But, man, Markdown tables just suck. The limitation of what you can put in a cell (exactly one paragraph of text) is just crazy. I understand the need for minimalism but the trade-off is simply not rational. Other limitations I can work around but this is crippling.

rmnclmnt• 3 years ago

You can put anything in a Markdown table cell using HTML markup!

For instance, I regularly use ordered and unordered HTML list in table cells, this is generally supported by all MD renderers

synergy20• 3 years ago

https://github.com/d0c-s4vage/lookatme if you're a command line guy like me, this is my favorite slides presentation system inside the console.

Dunedan• 3 years ago

In the past I used reveal.js with its Markdown plugin to create slides for presentations. While that worked somewhat it always felt like working against reveal.js. Also their default of editing the index.html and other files in the source code felt really odd and I never managed to get good looking PDFs out of it (and I tried a lot).

Then I stumbled over Marp and it's been great. Don't get me wrong, it's not perfect, but for my use cases it's much better than using reveal.js with Markdown, as it just gets out of the way. Write your Markdown, maybe sprinkle in a bit of CSS and that's it. Wanna generate standalone HTML pages or a PDF out of it? Just run one command and get beautiful looking results.

a3w• 3 years ago

markdown -> reveals.js pandoc is great. Having an tree-view overlay for your 2D presentation flow in the final presentation is as good as slides get.

heywoodlh• 3 years ago

With Marp, I use a PowerShell function I call marp-template[0] (I use PowerShell Core on Linux and MacOS) to create a markdown file to serve as a starting template for me.

Then I use Marp's docker image, in another PowerShell function named marp[1] to render the HTML (I like using the --html flag so I can have actual HTML in my markdown files).

This workflow results in me being able to create presentations very quickly.

[0] https://github.com/heywoodlh/conf/blob/00d1b5aadd6a39288fa68...

[1] https://github.com/heywoodlh/conf/blob/00d1b5aadd6a39288fa68...

sfpotter6• 3 years ago

Using Markdown for presentations seems like we're going in the wrong direction, if anything?

Presentations should have as little text as possible, but Markdown is a text-first markup language. I feel like if I used Markdown, I would end up putting way too much text on the screen because it's what's most convenient.

gugagore2• 3 years ago

I agree. Graphical animations (even to highlight text, tables, figures) is such an essential part of communicating in a slide show, and I have not found a tool that achieves both separation of content and style while allowing convenient design of these graphical elements.

danielvaughn• 3 years ago

I don't see why you couldn't come up with a mermaid-esque syntax for all of that.

yalue• 3 years ago

Boy, if only you saw how popular Beamer (a LaTeX presentation framework) was in certain academic circles. Spoiler: it leads to exactly the problem you describe, in addition to using some default styling that manages to be both hideous and crushingly bland at the same time. At least, based on the screenshots, this proposed framework doesn't have the second problem.

I guess, the way I view this is as a "better beamer" (which isn't saying much IMO) rather than a better powerpoint. Basically, it's a way for people who were going to make a text-heavy presentation anyway to produce something that looks OK, and to avoid using a heavyweight tool like LaTeX.

claytonjy• 3 years ago

I agree, but lots of folks are making presentations of this style because it's expected of them and they don't have the power to rock the boat, like the sibling comment about Beamer. Those folks still deserve good tools.

History and momentum is part of it, but the other part is the value of the slides when viewed later. There's an inverse correlation between the usefulness of slides and the quality of the presentation!

Best I've seen is low-text Google slides with heavy speaker notes included, but that's more work and prep than most people are willing to do (myself included).

cycomanic• 3 years ago

Having used many different tools to create presentations, including sozi, and jessyink (svg to presentation tools using inkscape), Markdown tools (reveal, sli.dev, reveal via org mode) and power point, I actually find that using Markdown tools typically leads to less text in slides (I know this is counterintuitive). You essentially often end up with a single statement/single image type slides that one often sees in "inspirational" type presentation (e.g. Ted talks.

There in also lies an issue with Markdown presentations, more complex layouts (e.g. a side by side comparison) often require tweaking css/html and are more inconsistent. Unfortunately I find it very hard to avoid layouts like these for deeply technical content.

atoav2• 3 years ago

I think it depends. If you need to write many slides fast, this is a very good format to get it done.

sfpotter6• 3 years ago

If you have to write many slides fast you are going to give a bad talk.

masukomi2• 3 years ago

Markdown doesn't encourage or discourage text volume per slide. that's entirely the human. I mean sure, there's nothing stopping you from putting the full Illiad per slide but... again, that's you not the markdown.

you could just as easily paste or type paragraphs worth of text per slide in GUI presentation tools.

It's more a problem of not thinking about the volume you're putting on a slide or not using a tool that gives you good visual feedback like a GUI app does as you add text.

I've been using Deckset https://www.deckset.com/ for years and tend to have very little text per screen.

divyaranjan1905• 3 years ago

I've been using LaTeX beamer for the most part in making presentations out of markdown. This can be a huge next step!

rspoerri• 3 years ago

I am using marp since about 2 years for my lectures. I have started to use markdown with presentations with deckset.com, however it seems as the developer stopped support and development. Also it's mac only which defeats one of the good reasons to use markdown (platform independence).

Generally it's nice for me to have content summarized in text only form. I have generally been distracted by all the layout features i need to define with any other presentation tool.

What i was missing was some layouts in marp, such as left / right splitting for images and text. However it's possible to use markdown-it plugins with marp which makes that possible.

Using pandoc is another nice addition which makes it possible to generate pptx from the files, however it's not supporting the markdown-it plugin definitions. To share something it's still better then the marp's pptx export which creates images in the presentations.

Generally i am missing good support for video's in most presentation tools. Also most presentation tools i have encountered only work on specific browsers. I'd love to share the presentations as html which is currently not feasible.

veganjay• 3 years ago

It depends on what you are presenting. I found [mdp](https://github.com/visit1985/mdp) to be very useful when presenting a tech talk. It is easy to copy and paste from the source material, it can be done all via the terminal, and it views well as a README on github.

Here is an example of a presentation I gave:

https://github.com/veganjay/prefectdemo/blob/main/presentati...

docandrew• 3 years ago

I’ve had good success with mdp as well - when I saw the OP I was kind of hoping it would work with the same format mdp uses so I could go either lo-fi or fancy depending on the audience.

baby• 3 years ago

I've decided early on in uni that I will reject LaTeX slides. For the same reason, I think Markdown slides should be rejected. Slides are not written documents, and they shouldn't be. Slides are ways to communicate ideas. This is where you use images, diagrams, animations, etc.

Use keynote/powerpoint/Gslides/etc.

jamesgeck0• 3 years ago

Nothing preventing you from including images or diagrams in Marp presentations. You can include any image or video format the browser can display. The majority of my Marp decks are slides of images.

Ar-Curunir• 3 years ago

Animations and especially animated diagrams are key to any good technical presentation. As far as I know there’s nothing as good as PPT or Keynote for that in Beamer/marp/whatever land

MilStdJunkie• 3 years ago

Asciidoc core for at least four years now

https://docs.asciidoctor.org/reveal.js-converter/latest/conv...

dcchambers• 3 years ago

This is pretty neat!

I have played around with slides^1 before for doing small demos with my team, but I find that outside of highly technical geeks most people don't want to look at presentations in plain text in a terminal window. I like that this lets you create more traditional graphical slide decks while still using markdown + your favorite editor.

[1] https://maaslalani.com/slides/

eevilspock• 3 years ago

I'm not sure something counts as an "ecosystem" if all the pieces that play in that system are produced by the same entity. Feels to me like marketing BS.

Marp: Markdown Presentation Ecosystem

Related Stories