t_wの輪郭

デライトに画像をアップロードする方法

デライトに画像をアップロードする方法は三つあります。

• 一つ目：左下の「+」ボタンをクリックして、画像を選択してアップロードできます。
• 二つ目：画像をエクスプローラーからドラッグアンドドロップすると、アップロードできます。
• 三つ目：画像をクリップボードにコピーし、デライトの入力欄でペーストすると、画像がアップロードできます。

デライトの輪郭の本文に+webpと書くと、その個所に画像が表示されます。画像がアップロードした際にも+webpが挿入されます。

Gyazoを使う方法

Gyazoなどに画像をアップロードしてから、その画像のURLを張ることで、画像を輪郭に表示することができます。
例えば+https://i.gyazo.com/f5af220fb8516975da248119746d81c6.jpgのように書くと、画像が表示されます。

　『人生たのベントカレンダー🎶 Advent Calendar 2022』の場を借りて、私が作ってる手書きメモサービス TwEgaku（以下TwEgaku）を紹介させていただきたい。

　TwEgakuは手書きでメモができるサービス（ウェブアプリ）だ。メモ。なのでお絵描きではない。いやお絵描きに使ってもいいんだけど、あくまで主眼はメモにある。

開発の文脈・きっかけ

　「きょうび手書きとか流行らねーんだよ。いま令和ぞ？」と思われるかもしれない。「キーボードの方が入力早いじゃん」と思われるかもしれない。

　『ゼロ秒思考』という本では、「メモ書き」というA4のコピー用紙に書き殴るという行いが紹介されている。これを1日に10分で10枚（1枚当たり100文字程度なので、1日に1000文字程度）書くと頭に良いとされている。が、1日に1000文字を書くというのはなかなか難しい。書くことがなくなる。そうなのだ。手書きでさえ1日10分も書けば書くことがなくなるのだ。キーボード不要説が立ち上がる。
　また、このメモ書きというのは存外楽しい。このメモ書きに私はとらわれていた。1日10枚のメモ書きをしていたところ、段ボールひと箱分のA4用紙が消費され、そのメモが死蔵されていた。メモをため込めば活用したいという気持ちが湧きおこるのは自然なことだろう。ただ、このメモらをスキャンしてOCRにかけて……という風にする気にはならなかった。あまりに数が多すぎた。せめて新しいメモぐらいは電子化しておきたいという気持ちになり、DPT-RP1というSonyが販売した電子ペーパー機器をおよそ5年前の2018年ごろに購入するに至った。
　DPT-RP1の機能の詳細は省く。結論から言うとこれでメモ書きするのはダメだった。機器自体に検索機能が搭載されていない。大きく外で使いにくい。ペン先はみるみる削れていく。充電が切れる。パソコンとの接続が面倒。紙と電子機器の悪い所取りをしたような機器だった(もちろん利点がないわけではない。大量のPDFを手軽に持ち歩くことができる。論文を読むのには最適だった)。この失敗を経てなお、私の中には手書きのメモ書きを保存し、検索し、活用したいという思いがくすぶり続けていた。

　話は今年の2022年5月まで飛ぶ。良いカメラが付いたスマホが欲しいなと思い、Galaxy S22 Ultra 5Gを買ったところ、「Sペン」というペンが本体に収納されていた。なんとなくこれでメモを書いて、そのメモのスクリーンショットを『デライト』という公開メモサービス上に投稿したところ、『良さ』を感じた。手書きのメモを公開することにルネサンスを感じた。ただ、「メモを書いて、スクリーンショットを取って、Gyazoにアップロードして、URLを取得して、そのURLを書き換えて、デライトに張り付ける」という手順はあまりに手間がかかる。「メモを書いて、URLを取得して、デライトに張り付け」ができる、手書き版のGyazoみたいなサービスがあったら最高だろうなと思われ、そうしたサービスの開発を開始した。

kakeruという先行事例の発見

　そうしてサービスの開発を進めていたところ、kakeruというウェブアプリを発見した。kakeruを試したところ、「メモを書いて、URLを取得して、デライトに張り付ける」が実現されていた。まさに作っているモノがすでに実現されていて絶望してしまった。
　開発の中断も検討したが、幸いにも手書きで手書きメモを検索する「手書き検索」を思いついたためにTwEgakuの開発は継続された。手書き検索を思いつき、その機能に良さを感じたのはやはり、「メモ書きを保存し、検索し、活用したい」という思いがあったからだろう。

iPad mini 6とApple Pencil（第2世代）、ポチっちゃった

　2022年のブラックフライデーでiPad mini 6が割引になっているのを発見してしまった。「手書きするウェブアプリを作るならApple Pencilは避けて通れないよなぁ」と思って価格調査していたところだった。ポチってしまった。1か月ほど使ったが今のところ後悔はしていないです。いずれ買っていただろうため、タイミングが良かった。

TwEgakuの行く先

　「手書きルネサンスでタイピングを逆に時代遅れの技能にしていくぞッ」というような意気を持つところまでは至ってない。とりあえず糊口をしのげるようになりたい。パクリが出るくらい流行ってほしい。
　後、最近電子ペーパー端末がポツポツ出てるのが気になる。試したいけどこれ以上ガジェット増やすと運用できないのでなんともかんとも。

そんな感じです

　はい。大体書き終わったのでこの辺にします。TwEgakuは「https://twegaku.towasys.com」から利用可能なので、気になったらぜひ使ってみてください。

• 爆速共有という価値観・あり方。
• <img>経由でアクセスするとファイルの内容が返される一方で、ファイルのアドレスにブラウザでアクセスすると普通のウェブサイトとして見られる機能。
  • https://i.gyazo.com/1e7ecef40774e6184d5d4f48e9f3cb40.png にアクセスするとウェブサイトとしてみることができる。一方で<img src="https://i.gyazo.com/1e7ecef40774e6184d5d4f48e9f3cb40.png" />も機能する。マジ神機能。
  • これをパクッて、~.svgにブラウザでアクセスすると作成者は編集できるし、それ以外の人にはトップページへのボタンと広告付きのページを表示してある。自画自賛だし拝借した機能だが神機能。

諸々、粗が目立つようになってきたので、それらの改善に力を入れる。派手な機能変更はそろそろ打ち止めになり、こまごましたところを改善していく。

コードの匂いや、検索品質や、大量に手書きしたときの視点移動の重さ、トップページのデザインの悪さ、周知戦略、などといったところが気になってきている。

模倣でもされない限りは手書きでの輪郭法の導入も見送る。正直デライトでやればよい。というかデザインを含めた統合が難しすぎる。今のところ良い方法が思いつかない。デライトの凄さを思い知る。
模倣者が出るほど流行るといいなぁ……というかそもそもGyazoのリスペクト(模倣)だったりするので、模倣されてもなんも文句が言えない。
模倣されて敵わないとなったときには……フフフ……実は隠し玉がある。

でも、もっとなめらかにできそう
デライトで手書きできたら良い
輪郭法と手書きって相性がいいかもしれない

録画した動画を見てみたけど、gyazoのURLいじるのめんどっちいな
スマホに最適化された画像アップローダーが欲しくなる

というか、手書き共有ウェブアプリとかあれば便利なんだな。

javascript: (()=>{
  const html = `<a href = "${location.href}">\n  <img src="${location.href}/thumb/300#.jpg"/>\n</a>`;
  if( navigator.clipboard.writeText(html) ){
    alert(`thumbneil code copied`);
  } else {
    alert(`error`);
  }
})();

javascript: alert(`<a href = "${location.href}"><img src="${location.href}/thumb/300#.jpg"/></a>`)

<a href = "https://gyazo.com/e3e462d5f8fd3b2c5f8db162092b80d6"><img src="https://gyazo.com/e3e462d5f8fd3b2c5f8db162092b80d6/thumb/300#.jpg"/></a>

—『Gyazo URLで画像リサイズ』

https://scrapbox.io/nyaagoo/Gyazo_URLで画像リサイズ

写真をデライトで共有するために、Gyazoへ自動的にスマホの写真がアップロードされるようにした。GyazoのAndroidアプリを入れて、アプリから設定してやれば可能になる。

1. Gyazoでスクリーンショットを撮影しまくる（タブを開いたままにする）
2. タブの並びを表示したい画像の順番に並び替える
3. 最初に表示したい画像をのタブを開く
4. Gyazoで録画を開始する
5. タブを次々切り替える
6. パラパラ漫画の完成

パラパラ漫画の例

XDとGyazoによる既存システム改修のプロトタイピング＆改修提案
　
XDにスクリーンショットを張り付ける
スクリーンショットから画面遷移を作成する

操作している動画をGyazoで撮影する

動画・Gifアニメを共有する