[kz] 三色ボールペンスタイルで思考を視覚化
- 2017.01.09
- application
- アプリ

こんにちは、@kazscapeです。
先日は、Workflowyの記事を書きましたが、さらに使い勝手を強化していきます。
標準のBold、Italic、Underlline
Workflowyには標準で、文字をBold(太字)、Italic(斜体)、Underline(下線)表示にする機能があります。
Boldする場合のショートカットはCtrl + B(MacはCommand + B)
ItalicはCtrl + I(MacはCommand + I)
UnderlineはCtrl + U(MacはCommand + U)
それぞれの見た目はこんな感じになります。

ところどころ太字になってたり、斜体になってたり、下線がひいてあるのわかりますか?
これでもまぁ、重要部分は強調されるのですが、ちょっとこう、訴えかけてこないですよね。
そこで、標準のBold、Italic、Underlineを視覚化してみます。そして、そのついでに、書籍「クラウド時代の思考ツールWorkFlowy入門 」の著者である彩郎さんのサイト「単純作業に心を込めて」のサイトで紹介されている三色ボールペン化にチャレンジしてみます。
三色ボールペン化の手引
ブラウザに拡張機能「Stylish」を追加
まずは、使っているブラウザに「Stylish」という拡張機能を追加します。
Chrome使いの方はChromeウェブストアから、Firefox使いの方はAdd-Onsからインストールすることができます。
以降、私はChrome使いなので、Chromeでご説明。

Stylishに三色ボールペン用のスタイルを設定
StylishでWorkflowyのスタイル設定をするので、Workflowyのページを表示しておき、ブラウザの左上に「Stylish」のアイコンをクリックすると、Workflowy.comを表示している際のスタイルを変更するためのウィンドウが表示されます。

「Create New Style」をクリックすると、「スタイルを追加」の新しい画面が表示されます。

左上の名前の部分は適当な名前を入力し、「コード1」の入力項目のところに、先程ご紹介した「単純作業に心を込めて」のサイトの三色ボールペン方式に関する記事『改・WorkFlowyで「三色ボールペン方式」』に記載されているスタイルを、Chrome用にしたものを書き込みます。

ご参考までに以下に記載しておきます。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
.contentUnderline { border-bottom: 2px #0000FF solid; text-decoration: none; } .contentUnderline.contentItalic { border-bottom: 2px #FF0000 solid; color: #000000; } .contentBold { font-weight: normal; background-color:#BCF5A9; } .contentItalic { font-style: normal; color: #FF0000; } .contentBold.contentItalic { background-color:#FFFFFF; color: #04B404; } .contentUnderline.contentItalic.contentBold { background-color:#BCF5A9; color: #000000; } |
Firefoxをご利用の方は、『改・WorkFlowyで「三色ボールペン方式」』に記載されているスタイルのままをコピー・ペーストすれば大丈夫。
単純にコピーしただけだと、インデントが見にくくなっているので、「Beauty」ボタンを押すと、インデントを整形してくれます。
その上で、左上の「保存」ボタンでスタイルを保存します。
さて、出来栄えはいかに!?
これまでの作業で、Bold、Italic、Underlineが三色ボールペンのように振る舞うように設定できました。
その出来栄えですが。

こんな感じです。
どのショートカットキーに、どの組み合わせで、どの装飾が割り当てられているかを覚えるまで大変ですが、やはり無機質な黒一辺倒の文字列より視覚的になりますね。
まとめ
今回は、彩郎さんのサイト「単純作業に心を込めて」のサイトで紹介されているWorkflowyの三色ボールペン化についてご紹介しました。
まだまだ使い方の深い部分がありそうなWorkflowy。
これからもひとつずつ、自分のツールにしていきます。
ではっ!
-
前の記事
[kz] 頭の中にあるものを全部出す。そして整理する 2017.01.09
-
次の記事
[kz] 機械学習とやらの勉強環境を作ろうと思ったら寂しい結果に終わった件 2017.01.16
Advertisement

コメントを書く