metaframer article
Some checks failed
test / cargo test (push) Failing after 1m5s

This commit is contained in:
Michal Vanko 2024-11-08 18:06:13 +01:00
parent 39596cb39c
commit 0228429ad0
2 changed files with 36 additions and 0 deletions

View File

@ -0,0 +1,33 @@
---
title: My first published Cargo crate
segments:
- blog
published: true
date: 2024-11-08T17:09:00.000Z
thumbnail: /images/uploads/aperture-icon.svg
tags:
- News
- Development
- Rust
---
I've become obsessed with cameras, during our Tenerife trip, where I got to use a borrowed mirrorless camera for the first time. After that, I researched which camera I'd buy for myself for five months. While watching all the reviews, I was interested in the **exposure settings** for each picture presented. I've displayed many photographs in our [Tenerife vlog with my wife](https://www.youtube.com/watch?v=tEpoVHQW4Qs&list=PLjUl8tFKyR8rCsckLn93PAwQg6tf0cyBl). I've decided that I'd like to show those exposure settings in my other videos as they might **inspire other photographers**.
I've tried many image editors and tools, but not one was able to **fulfill my demands** on how I'd like to display those settings underneath each picture. Many **tools supported** some kind of **framing**, however it was always **in a limited way**.
## Hello `metaframer`
I knew straight away that this would be a cool and **small side-project** that I could create. I could use my **favorite technologies** and have good **content for my streams**.
At first, I thought, that I would have to **render the text** right **into the image**. It will however be in some aspect a **deformation to the quality** of the original image. There was also a question of **how should the text be displayed** in a way that for **any image size**, the text will be of a similar or determinable size.
Instead of **rendering pixels** into every different format I've opted for creating an **SVG file** that sits **alongside the original image**. This way the text also **scales with the image** itself. The complexity was lowered instantly. Rendering SVG is just like rendering HTML. I've used [handlebars template parser](https://handlebarsjs.com/). There are more favorable template parsers in Rust like [Askama](https://djc.github.io/askama/askama.html). But I wanted to allow users to **create their own templates** so the templates are not part of the executables and they can be stored in the user's `.config` folder. I had to test the **support of my video editing software** (I use [Kdenlive](https://kdenlive.org/) BTW) and the decision for SVG was set in stone (a.k.a. [README](https://github.com/michalvankodev/metaframer)).
There were still complications along the way. **SVG** is still a much **less capable format than HTML** and **positioning elements** in a `space-around` fashion **has to be calculated**. There are also many different options and resolutions that I had to consider and I put all of them into the CLI arguments with [clap](https://docs.rs/clap/latest/clap/). [Clap](https://docs.rs/clap/latest/clap/) is a fantastic **command line argument parser** for Rust. I had to do many calculations on the resolutions and whether the image was a portrait or not. In the end, It wasn't as small of a side-project as I thought. I'm still very proud of it.
I got to experience the ease of publishing crates on [crates.io](https://crates.io/) with [cargo](https://doc.rust-lang.org/cargo/guide/).
This week, I've **automatized the [release process](https://github.com/michalvankodev/metaframer/blob/main/.github/workflows/release.yml)** and published binaries for multiple platforms.
## On to the next one
I can't wait to use [\`metaframer\`](https://github.com/michalvankodev/metaframer) in my new videos. I've already **ordered my first mirrorless camera** and it is on the way. **Be ready for new content**. What should be my next project?

View File

@ -0,0 +1,3 @@
<svg height="{{height}}" width="{{width}}" x="{{x}}" y="{{y}}" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
<path d="M0 0h48v48h-48z" fill="none"/><path d="M18.8 21l9.53-16.51c-1.39-.31-2.84-.49-4.33-.49-4.8 0-9.19 1.69-12.64 4.51l7.33 12.69.11-.2zm24.28-3c-1.84-5.85-6.3-10.52-11.99-12.68l-7.32 12.68h19.31zm.52 2h-14.98l.58 1 9.53 16.5c3.26-3.56 5.27-8.29 5.27-13.5 0-1.37-.14-2.71-.4-4zm-26.53 4l-7.8-13.5c-3.26 3.56-5.27 8.29-5.27 13.5 0 1.37.14 2.71.4 4h14.98l-2.31-4zm-12.15 6c1.84 5.85 6.3 10.52 11.99 12.68l7.32-12.68h-19.31zm22.54 0l-7.8 13.51c1.4.31 2.85.49 4.34.49 4.8 0 9.19-1.69 12.64-4.51l-7.33-12.69-1.85 3.2z"/>
</svg>

After

Width:  |  Height:  |  Size: 650 B