カテゴリー
ツール 未分類

ファンタジー地図ジェネレーター

Fantasy Map Generatorは、架空世界の諸国地図を自動生成してくれるという JavaScript ライブラリです。デモページを開くと、リロードするたびに新しい大陸や諸島の地図が描かれます。

地形等は svg で生成されていて、拡大しても崩れたりしません。

デモ上でクリックすると、国・郡・町などを変更したり、表示のフォント・色を変えたりすることもできます。

地名は自動生成ではなく、namems.js に定義したものをランダムに出しているようです。

現在も開発中ということで、ソースコードはGitHubで公開されており、開発ブログでは海岸や河川の生成など、これまで作成したところの仕様や作り方などについても解説されてます。

昨年ご紹介した中世ファンタシーの城郭都市を生成するジェネレーターと併せて、TRPG のマスタリングや小説の世界観設定などに使うとはかどりそうなサービスではないでしょうか。

カテゴリー
ツール

PlantUMLでAWSサービスを含む図を作る

プレゼンテーション資料をMarkdown形式で書いていて、図を入れたいが図はどうやって用意しようか、となりました。

せっかくテキストエディタでプレゼンを作れるようにしているのに、図を描くのにテキストエディタでなくドローツールを開くのは面倒だな、テキストで図を描ければ、ソースコードとして管理できるから似たような図を量産するのも楽だし、バージョン管理で変更点もわかりやすい。

ということで探したところ、Plantuml が見つかりました。日本語のマニュアルもあるし、評判もいいみたい。

インストールしようとしたところ、図を1,2個作るだけならオンラインでできるようです。試すだけならハードルはとても低い。

マニュアルを参考にして作ったのがこちら


@startuml

[Github] as github
[さくらVPS] as vps
[local machine] as localmachine

:ユーザー: <.... github :1) pull :ユーザー: ....> localmachine :2) Sculpinで変換
:ユーザー: ....> vps :3) upload(scp)
:ユーザー: ....> github :4) push

:訪問者: .left.> vps:閲覧
@enduml

変換した図がこれ

要素の順序や線の向きなど、細かく指定する方法もあるみたいですが、それをやりだすと大変そう。「まあ大体わかればいいか」というレベルで済むなら、驚くほど簡単でした。

# png でも svg でも作れるので、svg で問題ない環境なら svg もいいですね。WordPress ではまだ大変みたいなので png で貼っておきます

PlantUML で AWS の構成図を描く

UML で使えるアイコンはもちろん広く用意されているのですが、サービスのアイコンについても利用者が作って公開しているようです。AWS のサービスを表す図を公開している milo-minderbinder/AWS-PlantUML を見つけたので、これを使ってみました。

Github 上のライブラリを、前記のオンラインエディタから参照できるので、こちらも簡単です。使いたいコンポーネントを AWS-PlantUML から探して、include するだけで使えるようになります。


@startuml
!define AWSPUML https://raw.githubusercontent.com/milo-minderbinder/AWS-PlantUML/release/17-10-18/dist
!includeurl AWSPUML/common.puml
!includeurl AWSPUML/Storage/AmazonS3/AmazonS3.puml
!includeurl AWSPUML/Storage/AmazonS3/bucket/bucket.puml
!includeurl AWSPUML/General/user/user.puml
!includeurl AWSPUML/General/AWScloud/AWScloud.puml
!includeurl AWSPUML/NetworkingContentDelivery/AmazonCloudFront/AmazonCloudFront.puml

[BitBucket] as bitbucket
[CircleCI] as circleci

AWSCLOUD(aws) {
AMAZONS3(s3) {
BUCKET(blog, "akimoto.jp")
}

AMAZONCLOUDFRONT(cloudfront,"CDN")
}

:ユーザー: -right-> bitbucket :**1**) push
bitbucket -right-> circleci :**2**) kick
circleci -right-> blog :**3**) upload
blog --> cloudfront :**4**) distribute
:訪問者: .> cloudfront:閲覧

note "ビルド&テスト" as note_build_and_test
circleci .u. note_build_and_test
@enduml

変換後

これも、コンポーネントの配置順が気に入らない、とかで調整しようとするとたちまち難しくなってきたので、まあ関係性が読めればいいか、で気にしないことにします。マニュアルを読み込んで頑張れば調整もできるのだとは思いますが。

プレゼン中の図も小さなテキストで管理できるようになったので満足です。

カテゴリー
ツール

Chrome Engine Extension – 友達のパソコンでのYouTube再生を毎日少しずつ遅くしていくChrome拡張

scd31.com の Stephen さんがブログで公開しているのが、同僚や友達のChrome にイタズラを仕掛けるための Chrome拡張「Chrome Engine」

友達にイタズラを仕掛けるための Chrome 拡張です。毎日、YouTube の再生速度が1%ずつ遅くなっていき、30日後には 7割の速度になります。拡張のアイコンはChromeのアイコンを使っていて、自身を「Chromeエンジン」と偽ります。

This is a chrome extension I wrote to prank some friends. Every day, it lowers playback rate on YouTube by 1%, until it hits a target speed of 70% – 30 days later. It has the Chrome icon and calls itself “Chrome Engine” as a disguise.

再生速度を変える、ってどうやってるのかなとソースを見たら、playbackRate というパラメータが YouTube の再生ページ上 videoElement にあるんですね。これを指定すれば、YouTube 動画を倍速再生とかもできるということか。再生速度を調整するブラウザ拡張、というのもありました。

ソースのコメントによれば、速度を50%以下に指定するとおかしくなるそうで、遅くできても半分の速度が限界のようですね。

ソースコードおよび拡張パッケージが公開されています。まあ、このChrome拡張はGoogle公式では配布できないでしょう。

via Hackaday