概要をオーバーレイして撮影し送信する

「写真を撮って送って~」という依頼をされたときにスマホで撮影して送ると思いますが、
あとで写真だけを見た時に、
「はて、これは何の写真だったけ?これの詳細の仕様は?」、、、ということが多々あります。

例えば、

という写真を送ったときに

と送ってもらった方がいいのではないか?(※合成画像です。)

と思ったのがそもそもの始まりです。

上記の例の場合、オーバーレイする文字部分を左上に置いていますが、右下に置くとか、文字を小さくするとか、仕様(記載する内容)はここまではいらないとか、、、いろいろとあると思います。(これはhtml側の問題)

======

tranthruカスタマイズアプリを起動し、QRコードを読む
https://used.okabekikai.com/itempics.aspx?kanrino=OK5064

または、その品番のサイト
https://okabekikai.xsrv.jp/OK5064

に「なにかのアイコン」ボタンを設置し、それをクリックすると仕様部分だけのページにジャンプする

QRコードがない場合は、
ブラウザ透過率を高くして、品番を検索し、そのページに飛ぶ

↓↓↓↓↓↓
撮影(またはキャプチャ)して保存し、メール・メッセージ等で送る、、、などの処理をイメージしておりましたが、

その画像そのものが鮮明にできません。
html側の背景色をtransparentにしたところで、透過されません。

ブラウザ側の透過率

(綺麗な画像で撮影するための、妙案が必要です。)

追記:SaraCameraを作りました!