<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
	<channel>
		<title>エディタ on akky@サイボウズラボ・ブログ</title>
		<link>https://labs.cybozu.co.jp/blog/akky/tags/%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF/</link>
		<description>Recent content in エディタ on akky@サイボウズラボ・ブログ</description>
		<generator>Hugo</generator>
		<language>ja</language>
		
		
		
		
			<lastBuildDate>Fri, 26 Mar 2021 00:00:00 +0000</lastBuildDate>
		
			<atom:link href="https://labs.cybozu.co.jp/blog/akky/tags/%E3%82%A8%E3%83%87%E3%82%A3%E3%82%BF/index.xml" rel="self" type="application/rss+xml" />
			<item>
				<title>Making History Sandbox - 世界の勢力図を編集できるブラウザエディタ</title>
				<link>https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/</link>
				<pubDate>Fri, 26 Mar 2021 00:00:00 +0000</pubDate>
				<guid>https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/</guid>
				<description>&lt;p&gt;&lt;a href=&#34;https://yulin-w.github.io/making-history-sandbox/&#34;&gt;Making History Sandbox: Alternate History Timeline Editor&lt;/a&gt; は、世界の勢力図を年号と併せて作成することができるブラウザ上の編集サービスです。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-mongolia-united.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-mongolia-united_hu_bb65357cb4675692.webp 480w, https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-mongolia-united_hu_a2d0d91e4e2c46f3.webp 768w, https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-mongolia-united_hu_1666dc087403475d.webp 1167w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-mongolia-united.png&#34; width=&#34;1167&#34; height=&#34;862&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;モンゴル高原統一(1206)時の諸勢力&lt;/p&gt;&#xA;&lt;p&gt;エリアを選んで名前や勢力名を設定したり、色を変更したりできます。&lt;/p&gt;&#xA;&lt;p&gt;いくつかの時代の勢力図をロードすることもできます&lt;/p&gt;&#xA;&lt;ul&gt;&#xA;&lt;li&gt;アレクサンダー大王&lt;/li&gt;&#xA;&lt;li&gt;モンゴルの台頭&lt;/li&gt;&#xA;&lt;li&gt;ヴァルナの戦い&lt;/li&gt;&#xA;&lt;li&gt;第二次世界大戦前夜&lt;/li&gt;&#xA;&lt;li&gt;現代&lt;/li&gt;&#xA;&lt;/ul&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-european-storm.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-european-storm_hu_6607ee6eb98ce228.webp 480w, https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-european-storm_hu_cc6fa97b5bd72f73.webp 768w, https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-european-storm_hu_9b3fc306d49fec1e.webp 1163w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-european-storm.png&#34; width=&#34;1163&#34; height=&#34;837&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;第二次世界大戦直前(1936)。フィリピンの帰属が間違ってますね。&lt;/p&gt;&#xA;&lt;p&gt;作成した勢力図は保存・読込ができます。利用者が作成したデータ「現代(2021)」「第一次世界大戦開戦(1914)」も追加されています。&lt;/p&gt;&#xA;&lt;p&gt;エリア単位で支配勢力を色塗りしていますが、エリアを分割したりすることもできるそうです。&lt;/p&gt;&#xA;&lt;p&gt;レイヤーのように複数の年代を並べて作り、切り替えていくこともできますが、これを使ったサンプルデータはまだなさそう。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-area-editor.png&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-area-editor_hu_f815a59716f8e217.webp 480w, https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-area-editor_hu_266e225a86b05ac5.webp 741w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2021/03/making-history-sandbox/history-sandbox-area-editor.png&#34; width=&#34;741&#34; height=&#34;583&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;自分の興味ある時代を再現したり、架空の年代や勢力を塗り分けたりするのも面白そうです。&lt;/p&gt;</description>
			</item>
			<item>
				<title>OpenVim - ブラウザで動く Vim 入門</title>
				<link>https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/</link>
				<pubDate>Fri, 21 Jun 2019 00:00:00 +0000</pubDate>
				<guid>https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/</guid>
				<description>&lt;p&gt;&lt;a href=&#34;https://www.openvim.com/&#34;&gt;OpenVim&lt;/a&gt; は、ブラウザ上で動く Vim のインタラクティブなチュートリアルです。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://www.openvim.com/&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/openvim_hu_d6d30218e49e7513.webp 480w, https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/openvim_hu_3609308acc65a6b5.webp 768w, https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/openvim_hu_63bfea3820fcc456.webp 1378w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2019/06/openvim-teaches-you-vim-on-browser/openvim.png&#34; width=&#34;1378&#34; height=&#34;773&#34; alt=&#34;&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;20章にわかれたチュートリアルをこなしていくことで、Vim の基本的なコマンドを一通り知ることができます。&lt;/p&gt;&#xA;&lt;p&gt;Unix サーバの管理を初めてまかされた、どうしよう、みたいな人には、コマンド表を見て覚えるよりちょっといいかもしれません。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;https://github.com/egaga/openvim&#34;&gt;ソースコードも公開されていて&lt;/a&gt;、たくさんのバグ報告や改善案が寄せられているようです。&lt;/p&gt;</description>
			</item>
			<item>
				<title>リアルなタイプライター体験ができるサイト OverType</title>
				<link>https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/</link>
				<pubDate>Mon, 03 Aug 2015 00:00:00 +0000</pubDate>
				<guid>https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/</guid>
				<description>&lt;p&gt;&lt;a href=&#34;http://uniqcode.com/typewriter/&#34;&gt;OverType&lt;/a&gt; は「生まれてこのかたタイプライターなんて見たこともない子供」にもタイプライターがどんなものか教えるという目的で作られた、ブラウザで動くタイプライター風エディタです。&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;http://uniqcode.com/typewriter/&#34;&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/overtype_hu_6e9ba3c0a5308c9c.webp 480w, https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/overtype_hu_1e330d43f3f00423.webp 768w, https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/overtype_hu_dd3ba6ec9507cdb2.webp 1131w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/overtype.png&#34; width=&#34;1131&#34; height=&#34;497&#34; alt=&#34;overtype&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;OverType は、既存のタイプライターシミュレーターの全てが再現に失敗しているタイプライターの基本的な機能 &lt;strong&gt;「戻るキーを押しても文字が消えない」 をきちんと再現&lt;/strong&gt;しています。&lt;/p&gt;&#xA;&lt;ul&gt;&#xA;&lt;li&gt;要物理キーボード&lt;/li&gt;&#xA;&lt;li&gt;没入感を得るには PC の音を鳴らすこと&lt;/li&gt;&#xA;&lt;li&gt;フリーズしたらページを再読み込み&lt;/li&gt;&#xA;&lt;/ul&gt;&#xA;&lt;p&gt;説明ページの「START!」を押すと、アプリが始まります。&lt;/p&gt;&#xA;&lt;p&gt;いつもの感覚で打ち始めると、すぐにハンマーが絡んだりして、打ったはずの文字が飛ばされてしまいます。タイプライターで打てる程度の速度で打つように抑えないといけません。&lt;/p&gt;&#xA;&lt;p&gt;以下のような操作をすると、よりタイプライターらしさが味わえるそうです。&lt;/p&gt;&#xA;&lt;ul&gt;&#xA;&lt;li&gt;カーソルキーで用紙を1/4行上下させる&lt;/li&gt;&#xA;&lt;li&gt;タブとシフト+タブで最寄のタブ桁へ移動&lt;/li&gt;&#xA;&lt;li&gt;ESCキーで赤文字になったり、ならなかったり (&lt;a href=&#34;https://en.wikipedia.org/wiki/Typewriter&#34;&gt;黒と赤のインクが交互に乗ってるリボンが使える機種があったとか&lt;/a&gt;)&lt;/li&gt;&#xA;&lt;li&gt;シフト/ESC は [CAPS LOCK]キーと押すことでロックできる。[CAPS LOCK]キーで解除&lt;/li&gt;&#xA;&lt;li&gt;ドル記号$を打ちたいときは、大文字のSを打ってからカーソルを戻して縦棒|を打つ&lt;/li&gt;&#xA;&lt;/ul&gt;&#xA;&lt;p&gt;画面上のスライダー Brokenness(壊れっぷり) を上げると、文字の縦方向の揃い方が崩れたり、インクの濃度や赤黒の切り替えがよりバラバラにおかしくなったり、さらに上げるといくつかのキーがまったく効かなくなったりします。&lt;/p&gt;&#xA;&lt;p&gt;すごい! なんて使いにくいんだ。&lt;/p&gt;&#xA;&lt;p&gt;&lt;picture&gt;&#xA;  &lt;source type=&#34;image/webp&#34; srcset=&#34;https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/Erika_9_typewriter_hu_8d40d6b359ff04f9.webp 480w, https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/Erika_9_typewriter_hu_48a1aa47a7279994.webp 768w, https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/Erika_9_typewriter_hu_1c7bf6c9a3bae05a.webp 1024w&#34; sizes=&#34;(max-width: 56rem) 100vw, 54rem&#34;&gt;&#xA;  &lt;img src=&#34;https://labs.cybozu.co.jp/blog/akky/2015/08/overtype-for-real-typewriter-experience/Erika_9_typewriter.jpg&#34; width=&#34;1024&#34; height=&#34;794&#34; alt=&#34;By Sommeregger (Own work) [CC BY-SA 3.0 or GFDL], via Wikimedia Commons&#34; loading=&#34;lazy&#34; decoding=&#34;async&#34;&gt;&#xA;&lt;/picture&gt;&lt;/p&gt;&#xA;&lt;p&gt;By Sommeregger (Own work) [&lt;a href=&#34;http://creativecommons.org/licenses/by-sa/3.0&#34;&gt;CC BY-SA 3.0&lt;/a&gt; or &lt;a href=&#34;http://www.gnu.org/copyleft/fdl.html&#34;&gt;GFDL&lt;/a&gt;], &lt;a href=&#34;https://commons.wikimedia.org/wiki/File%3AErika_9_typewriter.jpg&#34;&gt;via Wikimedia Commons&lt;/a&gt;&lt;/p&gt;&#xA;&lt;p&gt;via Hacker News&lt;/p&gt;</description>
			</item>
			<item>
				<title>Vistaの音声認識でPerlプログラミング - 喋ってコーディングしようとした男の奮闘記</title>
				<link>https://labs.cybozu.co.jp/blog/akky/2007/02/vista-edit-by-speech/</link>
				<pubDate>Wed, 07 Feb 2007 00:00:00 +0000</pubDate>
				<guid>https://labs.cybozu.co.jp/blog/akky/2007/02/vista-edit-by-speech/</guid>
				<description>&lt;p&gt;ウィンドウズ・ビスタの音声認識を使って、Perlスクリプトを書いて保存するまでの実演。&lt;/p&gt;&#xA;&lt;p&gt;まあ、自然文を書くことを想定して設計されている音声認識だから、それでプログラムを書こうというところに無茶はあるんだけれど。&lt;/p&gt;&#xA;&lt;p&gt;それにしてもこの奮闘っぷりが面白い。途中でPCを壊すんじゃないかとハラハラしたよ。&lt;/p&gt;&#xA;&lt;div style=&#34;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;&#34;&gt;&#xA;&#x9;&#x9;&#x9;&lt;iframe allow=&#34;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen&#34; loading=&#34;eager&#34; referrerpolicy=&#34;strict-origin-when-cross-origin&#34; src=&#34;https://www.youtube.com/embed/KyLqUf4cdwc?autoplay=0&amp;amp;controls=1&amp;amp;end=0&amp;amp;loop=0&amp;amp;mute=0&amp;amp;start=0&#34; style=&#34;position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;&#34; title=&#34;YouTube video&#34;&gt;&lt;/iframe&gt;&#xA;&#x9;&#x9;&lt;/div&gt;&#xA;&#xA;&lt;p&gt;[関連]&lt;/p&gt;&#xA;&lt;p&gt;&lt;a href=&#34;http://developer.cybozu.co.jp/akky/2007/02/vista-recognizes-malicious-speech-command/&#34;&gt;Vistaの音声認識セキュリティホールに思う&lt;/a&gt;&lt;/p&gt;&#xA;&lt;div style=&#34;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;&#34;&gt;&#xA;&#x9;&#x9;&#x9;&lt;iframe allow=&#34;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen&#34; loading=&#34;eager&#34; referrerpolicy=&#34;strict-origin-when-cross-origin&#34; src=&#34;https://www.youtube.com/embed/KyLqUf4cdwc?autoplay=0&amp;amp;controls=1&amp;amp;end=0&amp;amp;loop=0&amp;amp;mute=0&amp;amp;start=0&#34; style=&#34;position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;&#34; title=&#34;YouTube video&#34;&gt;&lt;/iframe&gt;&#xA;&#x9;&#x9;&lt;/div&gt;&#xA;&#xA;&lt;div style=&#34;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;&#34;&gt;&#xA;&#x9;&#x9;&#x9;&lt;iframe allow=&#34;accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share; fullscreen&#34; loading=&#34;eager&#34; referrerpolicy=&#34;strict-origin-when-cross-origin&#34; src=&#34;https://www.youtube.com/embed/QkD90ZV07zo?autoplay=0&amp;amp;controls=1&amp;amp;end=0&amp;amp;loop=0&amp;amp;mute=0&amp;amp;start=0&#34; style=&#34;position: absolute; top: 0; left: 0; width: 100%; height: 100%; border:0;&#34; title=&#34;YouTube video&#34;&gt;&lt;/iframe&gt;&#xA;&#x9;&#x9;&lt;/div&gt;</description>
			</item>
	</channel>
</rss>
