Since I'm trying to write more articles and post updates regularly to my personal site I set out to create a writing workflow.
- Distraction free, so no bells and whistles. Navigation and most UI elements should be out of my away.
- Markdown Preview to see the text with formatting. To get a feel of how big sections are (flow of the article) and if all the links are displayed.
- Support syntax highlighting for the metadata (in
yaml) format on the top of each file.
- Commit markdown files to a repository after I'm done writing.
Last week I tested 12+ writing apps and explored what features I liked. Here are some takeaways:
- Love the minimal interface of Left. The shortcuts of Left are subliminal (inserting time stamps for example).
- Left and iA Writer both have word and characters counters at the bottom bar those are handy for technical writing. Especially the reading time calculation.
- Quick inserts of markdown snippets in iA Writer. Footnotes, tables etc.
- iA writer has custom templates to jump start a post. That could be very useful for starter files for each type of post on this website.
- BBEdit, Scrivener, Texpad all felt a bit 'clunky' on start-up and overcomplicated for my personal needs.
- Standard Notes have plug and play extensions. You can install plugin and components if you need them.
- The Type Writer (focus mode) in Typora which let's you focus on specific paragraphs and makes other words transparent.
After all that testing it struck me, VS Code has lots of these features already built-in. Can I just use VS Code as my default writing app?
VS Code has a zen mode to get rid of most of the UI. That is a quick win to make it feel more like a writing app. With the introduction of workspaces you can configure settings for specific folders. It's easy to change color themes based on the folders you are in. So I have workspace that puts me in my
posts folder of the website. It then changes my color theme to
White Night and sets the writing font to Duospace. I'll use
cmd + b to toggle the sidebar to navigate files and use
ctrl + backtick to open the integrated terminal to commit markdown files.
Becoming a better writer
Writing for designers by Scott Kubie is a great starter. For better technical writing the Shoptalk Show Episode with Rachel Andrew is a good listen.
Kind of writing
- Notes and links: usually quick thoughts and resources that can be valuable.
- Guides and Workflows: lengthy posts for future reference. Usually lists lots of resources and have a more step-by-step flow.
- Tutorials: beginner friendly content about tools, software or a technical topic.
- Case Studies: things I discovered working on a DIY project or side project that can be beneficial to more people.
I'm still working on this part. The idea is to have some general quality guidelines. Currently looking at Smashing Magazine Style Guide, Shopify Voice and Tone, and MailChimp Voice and Tone.
Every time a new idea of an article pops up in my head. I'll add it to my writing Notion Board with initial thoughts and the resources where I got the idea from. Usually I'll also add a status and publishing date. I regularly run the text trough Grammarly and the Hemmingway Editor. After writing the post I do some final checks based on this smashing article template and create the assets for social sharing.
- Initial idea with resources
- Outline of the post
- First draft
- Revisions (or a review)
- Creating assets (banners, quotes etc.)
- Publish on personal website
- Share on social channels
- Comment and engage
- Blogging Workflow by Ali Spittel
- My Blogging Editing Process by Lindsey Kopacz
- Writing Mode in VS Code by Diéssica Gurskas
- Ladybug podcast - Blogging 101
- Syntax - Blogging
- What is UX writing with Owen Williams
- How to write for use on Smashing Magazine
— Danny de Vries
Hi, I'm Danny (@dandevri), a freelance front-end designer and lecturer at the Amsterdam University of Applied Sciences where I teach about code in the technical courses of our program such as front-end and back-end.