ランダムは求めているランダムではない件
とりあえず、完全ランダムに10この点を用意してみる
とりあえず、ランダムに10個の点を配置。
各点には position: absolute; を指定し、leftとtopの値として0〜99%のランダム値を設定。
確かに偏りがあるように見える。
そういうものなのだが、見た目的に微妙。
ランダムに手を加える（50の値に寄せる）
「一方で、メリハリのある表現のためには「ほとんどの要素は同じ位置で、少しだけ外れた場所にいる」といったランダムさが有効です。」とのことなので、ちょっといじってみる。
50に寄せる感じ。
50に寄っているのはわかるが、寄りすぎじゃないか？
もうちょっと端の値も取れるようにする。
ランダムに手を加える（もうちょっと範囲を広げる）
50によりつつ、ある程度端の値も取りうるようにする。正規分布だったらどうだろうか。
さっきよりも悪くなってないか・・・？いまいち！！！
うまくいかないから、適当に調整してみる
どうだ？
うーん、、、あと一歩。。。。。。
うまくいかないから、適当に調整してみる。その２
どうだ？
若干良くなったか？？うーーーんなんとも言えぬ！！！
考え方を変えよう。8個は50中心の分布に収めて、残り2個は必ず外寄り（0-25% or 75-100%）にしたらどうだろう。
どうだ？
まぁまぁかな？なんていうかわからなくなってきたね！！
考え方を変えよう。点が重ならないようにする（重なる値が出てきたら、random()再実行）
left, topそれぞれ、既存の点の+-3%の範囲内にある場合は値再取得。3%だと大幅には被らないが、多少かぶるところも出てくる。
結構バラバラ感はあるかな？端に寄っているようにも見えるか？
上の考え方で、ramdom()ではなく中央よりの値を取得するように変更してみる
（left, topそれぞれ、既存の点の+-3%の範囲内にある場合は値再取得。3%だと大幅には被らないが、多少かぶるところも出てくる。）
中央寄りな気がするが、前のやつよりはばらけてるかな。
上の考え方で、完全に被らないようにする。
left, topそれぞれではなく、実際の位置から近いものの場合に再取得。
中央寄りな気がするが、前のやつよりはばらけてるかな。
アニメーションと組み合わせてみる（ポワーン）
上の調整したバージョン
random()そのままバージョン
アニメーションつけたら、random()そのままでもそれほど気にならないね！
アニメーションと組み合わせてみる（上からポロポロ降ってくる）
調整したバージョン
random()そのままバージョン
うっすら分かってはいたけど、そもそも横１列に並べる！ってパターンだったらrandom()そのままで気にならないね。動いてるから尚更。
アニメーションと組み合わせてみる（ぱっ！！）
調整したバージョン
topは25%に寄るように調整してある。leftは2個は左側、2個は右側に寄るようにしている。
random()そのままバージョン
カエルにかぶるぜ！
結構いい感じにできたのでは？上が25%の位置にちょっとよりすぎかなぁ。。。