Help us understand the problem. What is going on with this article?

様々な日本語文章を、目線移動無く早く読めるオープンソースツール(Riot Shield)を公開しました

TL;DR

https://ampcpmgp.github.io/riot-shield/

11213.gif

概要

tdual さんのツイートを見て、目線移動無く文を読むと早く読めるということを知り、開発に至りました。
日々読んでいる記事や論文など、今より早く読めると QoL が上がるため、ワクワク感を持って取り組みました。

利用モジュール

形態素解析

形態素解析には kuromoji.js を使いました。多くの文章でより良い結果が得られて使いやすかったです。(結構前に作られたツールなのに凄い・・)
区切りの良いところで表示するために if 文を多用して力業で解決しています。感じ良く表示されるという曖昧な答えの中で、コーディングするのはだいぶ苦労しました。

ビューライブラリ

ビューライブラリには Svelte を採用しました。非常にサクサク開発出来て、書いていてとても楽しかったです。コーディングにおいて楽しさは正義。本当に素晴らしいライブラリだと思います。

UIデザイン

UIデザインにはニューモーフィズムを採用しました。 Nuemorphism UI をベースに利用し、不足分は Neumorphism.io で補いました。最初に出会ったときにコレだ!っと思っていて、何かで形にしたいと考えていました。出来上がってからも見栄えには非常に満足です。
ただ、 Nuemorphism UI 自体の css が 500kb 近くあってそれなりに重いこと、モーダルを実装するためだけに bootstrap, jquery, popper.js の依存が必要になったことで、もう少し軽量なライブラリがあったら良かったなと思いました。余裕が出来たら実装してみたいです。

その他ツール

他には自作モック作成ツールの am-mocktimes を利用したり、ユニットテストには ava を利用したりしています。利用モジュールの一覧は package.json よりご覧ください。自分はどれも便利だと感じています。

使ってみて

文章によっては一部表示が長くなったり、逆に短すぎたりすることもありますが、10記事ほど試し読みした感じでは、恩恵を十分に受けれているように感じました。これからも色々記事を読んでみて、気になったところは微調整していこうと思います。

何か要望などありましたら issue から連絡貰えると出来る限り対応しようと思います。

ブラウザ上で同じことができるツールがあったらコメントで教えていただけると幸いです。(自分のググり力では見つけることが出来ませんでした)

ソースコード

https://github.com/ampcpmgp/riot-shield

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした