WorkFlowy

とっても便利なクラウドアウトライナーです。

シンプルながら、いろんな使い方ができるツールでもあります。

  • ToDoリストとして
  • プロジェクトを細かいタスクに分解するプロジェクト管理ツールとして
  • アイデアを膨らませるツールとして、
  • 本格的に文章を書くツールとして

などなど。

機能的には相当満足しているんですが、私には一つ大きな不満がありました。

それは「味気ない」

ツールに「さわり心地」を求めたい

見た目や触り心地を気にせず、「機能がよければいい」という人もいるかと思うんですが、私はダメなほうです。

ツールは、使っていて楽しくないと嫌だなぁと思います。

アナログの手帳なら触り心地がすごく気になりますし、デジタルツールでも見た目がすごく気になります。

気になるというか、そこが寂しいと使う気が失せてくるんですよね。

WorkFlowyはとても魅力的なツールなので、しばらく味気ないのを我慢して使っていたんですが、先日とうとう限界を迎えて、いじくることにしました。

やってみて「もっと早くやっとくんだったな」としみじみ思ったので、まとめてみたいと思います。

もう完全に別のツールなんじゃないかってくらい、触っているときの心地よさが違うんですよ。

WorkFlowyの見た目をCSSでアレンジ

今回やったのは、CSS(スタイルシート)をいじくることで、WorkFlowyの見た目を変えるというもの。

やり方については、倉下さん(@rashita2)や、彩郎さん(@irodraw)が親切にまとめられているので、そちらをご参照ください。

倉下憲忠さん/R-style

参考: 『Stylish』でWorkflowyの見た目をカスタマイズした

彩郎さん/単純作業に心を込めて

参考:アドオン「Stylish」で「WorkFlowy専用Firefox」に機能を追加する

私は、FirefoxでWorkFlowyを使っているので、FirefoxにStylishをインストールする方法を使いました。

WorkFlowyのアレンジ箇所と実際のCSS

今回、アレンジしたのは、以下のポイント。

実際のCSSも載せておくので、気に入ったものがあればそのままコピペして使ってください。

  • タグをオレンジに
  • 見出しを太文字に
  • 下線でハイライトができるように
  • シートの色をベージュに
  • フォントをメイリオに

タグをオレンジに

デフォルトのWorkFlowyで一番不満だったのはタグの色。

灰色で目立たない。タグなのに見にくい。なので、色を変えました。

/* タグをオレンジに */
.contentTag{
color: #ff6600 !important;
}

見出しを太文字に

見出しを太文字にすると明らかに見やすくなります。

パッと見ただけで、ここから違うノードだと分かるようになるので。

/* 見出しを太文字に指定 */
div.project.selected > div.children > div > div.name div.content {
font-weight: bold !important;
}

下線で、ハイライトができるように

これは、彩郎さんが提案されている「WorkFlowyで三色ボールペン方式」を、一部だけ真似させてもらったものです。

私は、絶対に落としたくない大事なプロジェクトに色をつけて目立たせています。

/* 下線でハイライト */
.contentUnderline{
background-color:#ff9999;
text-decoration:none;
}

シートの色をベージュに

アナログの手帳でもそうなんですが、真っ白より、ベージュのほうが好みなので。

/* 背景色をベージュに指定 */
.page {
background: #FFFEEC !important;
}

フォントをメイリオに

これは完全に好みですが、私はメイリオが好きなので。

以下のCSSの”Meiryo”となっているところを他のフォントに置き換えてやれば、お好きなフォントにすることもできます。

/* フォントにメイリオを指定 */
#documentView {
font-family: Meiryo, Sana, Calibri, Trebuchet, Verdana, sans-serif;
}

アレンジ後のWorkFlowy

そうして生まれ変わったWorkFlowyが、こちら。WorkFlowy・CSSカスタマイズ後

 

一方、こちらがデフォルトのWorkFlowy。なんとも味気ない…。WorkFlowy・デフォルト画面

いや、もう完全に別のツールです。

もちろん機能は何も変わっていないんですが、頭の中で別のツールとして認識されているとしか思えないほど、楽しさが違います。

もうちょっと触ってやるかー!と思えるこの感じ。

触り心地のいい手帳を手にしたときと同じです。

少し前、「かき氷のシロップはすべて同じ味付けで、違うように感じるのは色と香りによる錯覚」という話が、ずいぶんシェアされていましたが、それだけ色や香りが、味の感じ方に大きな影響を与えるということでしょう。

デジタルツールであろうと同じじゃないかと思います。

見た目が違うだけで、同じツールなのにまったく別物に感じさせてしまう。

「便利なのは分かってるのに、なぜかWorkFlowyがしっくりこない…」と感じている方は、一度、見た目のカスタマイズから入るのもアリかもしれません。

スポンサードリンク

【コーチングについてのご案内】

コーチングについて、ご興味のある方はこちらまで

新規のコーチングの受付状況

・5月:残1名

・6月:残1名

・7月:残3名

なお、その他のお問い合わせはこちらのフォームからどうぞ!