はてなブックマーク

こんばんは daiiz です。技術書典に向けた執筆とコーディングと偶数日のアドベントカレンダーの記事を書いていて偉い。これは TeamJ Advent Calendar 2020 の12日目の記事です。 昨日はid:kanata_02による 念願だった物を買った話 - かなたのめも でした。紹介されていた6万円のモバイルプロジェクターでの投影映像を浜松旅行の宿で見せてもらいましたが、やっぱり最高に綺麗でしたね。あれから購入欲は高まっているのですが、YouTube垂れ流しの休日を送っているなかで、これ以上コンテンツ消費にかける時間を増やしてよいのかという気持ちとのせめぎ合いがあります。 早速本題に入ります。今年お世話になった図を描くツールは「Google 図形描画」です。登壇資料に入れるちょっとした図や、書籍で使う図、GitHub の Pull Request での説明用の図、などな色々な図

時間ができたので、ずっと気になっていた Portals をようやく触れた。これはかなり面白そうだ。デモのGIFでよく見かけた、portal要素が左下のからwindow全体になめらかに遷移する綺麗なアニメーションも仕様の一部かと思い込んでいたけれど、意外とCSSだった。表現の自由度が高くて良い。 この解説記事を読みながら SVG Screenshot に無理やり組み込んでみたりしていた。 以下は、関連画像の遷移に使ってみた例。動きはおもしろいが、いまいち嬉しさはない。 やっとPortalsを試している。おもしろい。 https://t.co/Na35hWQeIU pic.twitter.com/Op3IyrliYB— daiiz (@daizplus) 2019年5月29日 SVG画像内リンクの遷移に使ってみる。これは良いプレビュー機能だ。遷移先がsame originでなくても動くのは楽し

iPad Pro 欲しさが高まってきて記事していた。 引っ越しを決めるときほどは決断力要らないけれど、一人暮らしをはじめると大きな現金を手放すのが不安になるので、迷っていた。そんななか、iPad アップグレードプログラムの存在を教えてもらったのはありがたかった。 ビックカメラの残価設定ローンなどで攻める手があり、月3000円くらいでiPad Pro 12.9”とApple Pencil使ってる http://b.hatena.ne.jp/masawada/20180309#bookmark-359994043 記事内のコメントも、購買意欲を刺激された。 ペンよくできてて普通にメモ書けて、持ち運ぶとどこでも文字書けて頭が良くなる感じがします、おすすめです 買ってきた!!! Apple Pencilを使って賢くなった気分を早急に味わいたかったので、今週末に買ってきた。 2年経ってiPad熱が続

今日から NOTA Inc. で正社員として働き始めた。引き続き Scrapbox を作っていきます。 リリースパーティーでScrapboxと出会って以来、どっぷりハマりこみ、この素晴らしさを伝えようとブログ記事を書いたり、Chrome拡張機能などを作って個人的に盛り上がっていた。開発者とユーザが集まり盛り上がる 5月のDrinkupイベントでは、利用事例 by daiizを話した。 8, 9月にインターンとして京都オフィスで開発に参加して、10, 11月は関東からリモートワークしていた。日々の開発のコミュニケーションをScrapbox上で行っているためリモートでも快適にやりとりできるのでそのまま継続でも良かったが、色々と考えた結果、12月からは京都で働くことにした。2年前にはてなインターンに参加したときも、将来は京都で働きたいと思っていたので、夢が叶った。 我流な開発スタイルで好きなもの

今夏は Nota でのサマーインターン2017に参加して、 rakusaiさん、 shokaiさんとともに Scrapbox を作っていました。インターン期間中は主に、Scrapboxの機能拡張APIや、モバイルでの編集機能を開発しました。 リリースイベントGyaPCの頃から大ファンだったScrapboxを作れるなんて、夢のような日々でした。また、本場の社内スクボに触れることで、Scrapboxのパワフルさがいっそう身にしみた1ヶ月半でした。 インターン参加前のScrapbox活動 〜 機能開発話までの詳細はこちらに書きました。 これからさらに追記すると思います。 scrapbox.io 最終日には、Gyazo忍者、 Scrapbox Beaver、そして daiiz の名前入りという贅沢すぎる絵柄の記念Tシャツをいただきました。ありがとうございます！ 期間中は京都に住んでいました。 京都

こんにちは，daiizです．来週金曜日の夜に開催される Scrapbox Drinkup #01 にて Scrapbox の活用事例紹介的な発表をさせて頂くことになりました．Nota さんからの開発近況を聞けたり，他のScrapboxファンの方々と交流できる機会ということで，今からとても楽しみにしています．まだ枠が残っているようです! Scrapbox活用事例紹介を、ご自身のブログなどで積極的にScrapbox活用事例を発信されているdaiizさん … とご紹介を頂きましたので，当日は，日頃感じている Scrapboxライフの魅力を存分にお話できればと思います．過去にこのブログで書いた記事のリストは下記のページにまとめてあります．併せてご覧ください． 発表内容を整理しているところなのですが，言いたいことが色々あって，どこにフォーカスを当てるべきかを楽しく迷っているところです (もちろん，S

Scrapboxを使い始める前は，アイデア ( ＝ふわふわした思いつき) が頭に浮かんだら直ぐに作り始めてしまっていた．すると，僕の場合はたいてい，最終的な生成物は無意味に大きいものとなる．大きくても完成すればまだ良いほうで，最悪なケースでは，集中すべき点やアピールポイント (自分の への魅力) を見失って飽きて放ってしまう． このような事態を招く主な理由は，出発点の に複数のノイズアイデアが含まれて過ぎているためだと思う．実際に，朝寝覚めて思いついたときには一見単一アイデアに見えても，Scrapbox 上で文章に起こしてみると新旧色々なものが混ざっていることに気づく． ノイズを極限まで取り除いてそれでも残ったものがコアアイデア ()であって，この段階でようやく実装に着手したり，さらに寝かせて脳内とScrapbox上で深化させる選択をしたりする．完璧には徹底できていないけれど，最近は少しず

Scrapbox (の一部) 記法 で書かれたScrapboxページの文章を，対応するMarkdownに変換するBookmarklet「Scrapbox2Markdown」を書きました．ひとまず必要な記法のみの変換コードを勢いにまかせて作ったので，まだ対応できていない変換も結構あります．いまのところ以下の記法に対して動作します． プレーンテキスト 改行単位の文字列 多段箇条書き 入れ子構造も正しく変換される(はず)． 見出し 文字の大きさレベルも正しく変換される． Scrapboxの一番小さい文字レベルの見出し [* 見出し] は，Markdownでは [##### 見出し] に変換されるようにした． リンク 画像 画像とリンクのあわせ技もいける 単一行コード バッククオートで囲まれた文字 スポンサーリンク 実際のところは，Scrapbox記法がHTMLとして描画されたものを取得して変換し

コンセプト OCR (Optical Character Recognition) によって写真の切り取り撮影範囲 (Range) を指定するアイデア (Orange 🍊 )です．トリミング指定範囲の左上と右下に短形のコーナーを表すマグネットシートを置いた状態で写真を撮影します．マグネットシートには左上と右下を示すための「左上」，「右下」のキーワード文字が入っています．これらの文字を認識した座標位置と傾きに基づいて画像がトリミングされます．キーワード文字の認識には Google Cloud Vision API の TEXT_DETECTION 機能を用います． 用意するもの マグネットシート（ホワイト） コクヨ マグネットシート 300×200mm 白 マク-301W 出版社/メーカー: コクヨメディア: オフィス用品購入: 10人 クリック: 17回この商品を含むブログ (1件) を

先日公開されたScrapboxのBookmarklet機能（URLパラメータbodyにページのコンテンツを渡すと，Scrapboxに新規ページを作成してくれるもの）が大変便利だったので，これをSVG ScreenShot 開発版から呼び出せるようにした．SVG ScreenShot Chrome拡張機能のオプションページで Scrapbox のプロジェクトid（ボックスid）を登録しておくだけで使える． 普段通り，ウェブページ上でスクリーンショットを撮りたい部分を指定して撮影するだけでOK．撮影時には「Capture」ボタンではなくて「Scrap」ボタンを押すことでScrap to Scrapbox機能が使える．このボタンは従来の「Capture」と全く同じ動作（スクショを撮ってSVG ScreenShotのウェブアプリにアップロードする動作）をした後，Scrapbox の Bookmar

Device Orientation Event ブラウザ（主にスマホのブラウザを想定）の Device Orientation Event の内容を読むと，端末の傾き情報などを取得できる．例えば DeviceOrientationEvent.beta の値は，スマホを縦長に持ったときの，手前 or 奥方向への倒れ角を表している．端末を水平な机上に置いた状態だと 0 ，垂直に持った状態だと90や-90のような角度値（傾き）となる． 概要 今回は，この「傾き」の値をパスワードの代わりに使ってメッセージをゆるく保護するデモ（デモページのURLは記事末尾に記載）を作った． 投稿者は以下のような投稿画面で，メッセージ本文に加えて端末の傾きをサーバに送信する．端末の傾きはボタンを3回タップして設定する．角度値が安定していれば登録に成功する． サーバではメッセージに固有のURLを割り当てて，本文と傾き

完全に先週の話になってしまったけれど，GyaPC::Asia Tokyo 2016 ~ Scrapbox リリースパーティー に参加させてもらった． スクリーンショットアプリ Gyazo を開発しているNotaさんの新製品 Scrapbox についてのお話をたっぷりと聞いてきた． Scrapboxは，トップページで「A new style of team wiki」と書かれている名の通りWikiなのだけど，想像していた以上にパワフルなWikiだった．使っているうちに勝手がわかって興奮してくる．使い始めるために覚えることは少ないのですぐに書き始められる．イベントの少し前くらいから仲間内でプロジェクトを作って試していた段階で，記法や画面操作はすんなりと慣れることができた． 頭のなかで何かしらのフレーズ (キーワード) が思いついたら「＋」ボタンを押してとりあえず空ページを作る．書きたいことを書

学習や評価用の画像データをTensorFlowに与えるとき，JPEG，PNG画像をそのまま与えてもよいけれど，これらの教師ラベルや画像サイズ情報などとともにTFRecord形式のファイルに格納して使う方法が便利．公式ドキュメントで言う以下の説明の前半について，コード書いてみる． writerを生成する & 画像を読み込む TFRecordに詰め込みたい画像ファイルのパスとラベルの組を用意する．今回使用する画像は以下のような，576×576pxな正方形のJPEGファイル． img_data = [ ['./img/chicken_curry.jpg', 0], ['./img/tandoori_chicken.jpg', 1] ] TFRecordファイルの出力パスを指定して，TFRecordWriterを生成する． record_file = './foods.tfrecords' wri

驚いた どういうことか Chrome OS以外のOSでは，Chromeアプリ（Chrome Packaged Apps と Chrome Hosted Apps）が2018年までに廃止されるそうです． jp.techcrunch.com Chromeアプリとは，Chromeのブックマークバーの左隅にある をクリックして開いた先のページ*1で一覧されているアプリたちのこと．Chromium Blog のポストによれば，これらのアプリは 2016 末〜: Chrome OSユーザー以外の，Chromeアプリの新規出品は不可になる．すでに公開済みのものについては，どのOSからでも更新可能． 2017 後半: Windows, Mac, Linux ユーザーに対してはChromeウェブストアでChromeアプリが表示されなくなる．拡張機能とテーマは引き続き提供される． 2018 初め: Windo

単なるテキスト（.txt）ファイルをきれいなウェブページに変身させるChrome拡張機能「SimpleWebPage」をつくりました． ただのテキストファイルをれっきとしたウェブページにしてくれる仕組みを作った．（Chromeで表示された.txtファイルの内容をいい感じにスタイルがあたるHTMLに変換する拡張機能を作っただけ）https://t.co/4QKETsFV96— daiiz (@daizplus) August 2, 2016 デモ Chromeにあらかじめ拡張機能をインストールしたうえで，サーバから配信される以下のようなテキスト（.txt）ファイル*1を開くと，続くスクリーンショットのように，タイトル文字が大きくなったりリンクが挿入されたり画像が展開されたりします．この拡張機能は.txt?swpで終わるURLに反応します． Hello, Simple Web! 軽量なウェブペ

去年Googleが出した，行列の計算とか，機械学習で出てくる数式処理とかを手軽に記述できるライブラリTensorFlowを使って，チュートリアルにあるMNIST For ML Beginners，Deep MNIST for Experts，Convolutional Neural Networks（CIFAR-10）のプログラムを写経して入門した． www.tensorflow.org 大学の講義で基礎基本的な部分を聴いていたため，考え方や用語についてところどころ理解できたので楽しかった． Pythonはあまり書いたことがなかったので，言語的な部分に躓いたり，機械学習の本質的な部分で理解が追いつかなかったり，TensorFlowの書き方（有向非巡回グラフ形式で式を表現するあたり）で迷ったりで，大変だった．右も左も分からなくてまるで海外旅行をしているようだった．*1 スポンサーリンク しょ

はてなインターン2016のページ はてなインターン2015 昨年のはてなインターン2015に参加したdaiizです． 最高の夏に応募してから1年が経ちました． インターンの前半ではPerlの基礎から始まりウェブアプリを開発するに当たって必要な技術を学びました． 今年もカリキュラムがさらにパワーアップしていて，機械学習の講義もあるそうですね．今年参加できる方が羨ましいです． 後半戦では，はてなブログコースで「引用ボタン機能」を作りました．「もし自分がはてなブログ（など自分の希望コースの製品）に新機能を付けられるとしたら？？」ということを考えておくと後半過程がより一層楽しくなること間違いなし！ また，インターン仲間がすごい人ばかりなので，それぞれの得意分野の面白い話を聞かせてもらうと，インターン期間が終わった後も試してみたいことや作りたいものが湧いて出てきて楽しい． はてなインターン2016

食神590円定食シリーズの写真が何番定食であるかを識別する実験サイト「Shokujin Classifier」をつくりました．この前行った最新の学習成果に基いて判定されます．現時点では，1，3，4，5番定食に対応しています。 https://shokujin-classifier.herokuapp.com/ アップロードされた食神定食写真の定食番号を判定するサイトを作りました．機械学習の成果をもとに予測しますhttps://t.co/wKuSm0MT2x— daiiz (@daizplus) 2016年6月27日 Herokuの無料プランで動かしているため，読み込みに時間がかかることがあります．本当はGoogle App Engineで動かしたかったのだけど，GAEの環境にTensorFlowを入れる方法が分からなかったのでHerokuになりました． サイト内にサンプル画像も用意してあり

SVG形式でウェブページのスクリーンショットを撮るChrome拡張機能「SVG Screenshot」をより便利に使うためのウェブアプリを Google App Engine で公開しました．SVG Screenshotのコンセプトについては以下の記事をご覧ください． この記事では ウェブアプリでできること Chrome拡張機能とウェブアプリの融合（撮影したファイルをウェブアプリにアップロードして保存する機能） について，順に紹介します． ウェブアプリでできること スクリーンショットファイルを表示する https://svgscreenshot.appspot.com/viewer にアクセスすると，これまで拡張機能に付属していたものと同様なビューワページが開きます．拡張機能で生成されたスクリーンショットSVGファイルを，中央の白い領域にドラッグ・アンド・ドロップすると内容を表示できます．