先日アートとデザインというポストをしたのだけど、これも良く考えるのだけど、webにおけるアートってなんだろう。
webって基本的にユーザがアクションして見るもの。絵とは少し違う。映像とも少し違う。目的がある、ユーザが操作する。
ユーザがいて操作するという、先のポストのルールで言えばアートになり得ないのだけど、それでもwebをアート化するにはどうすればいいのだろう。
挙げたようにただの絵ではなく映像ではなく、そしてブラウザゲームでもなく。
答えは出ないし無いのかもしれないし出す必要も無いのかもしれないけれど。
前から思ってて手をつけることができなかったのだけれど
・パララックス
・ポートフォリオが画面に入ったらロードする
・構成を変えてスライダの実験
・iPhoneXRを買ったのでノッチへの対処
・XRの大きな画面ともう少し小さな画面とでブレイクポイントを別ける
・jsライブラリやどこかしらのアイコンにSVGを使うテスト
・初めて閲覧した時にだけポートフォリオを表示し、次のブログページに遷移するとポートフォリオを表示させない（重くて何度も見ることになるので
etc…
いろいろある。
なんとか勉強してみにつけたい
動きの設定はまだ甘いけど、まあとりあえずは良しとして、それよりMobile Safariで見るとぬるぬる動くのにmacで見るとぎこちない動きをする
スタイルで動く要素にwill-change:transformとすれば描画前に読み込んでくれて描画遅れを防ぐ、とあったんだけど変わらないのよなあ
ガクガク動くのはカッコ悪いからなんとかしたい
wordpressからのsns投稿、全文じゃなくて抜粋するにはディスクリプションに一部をコピペなりしないといけないのか…
なんとかデフォルトとして設定できないものか
fromとtoに書く、top-middleとかの意味がよくわからず、書き直してリロードしてを繰り返してたんだけど、ようやく解説してあるサイトを見つけた
https://tr.you84815.space/basicscroll/data.html
middle- bottomと書くと、要素の中央（middle）がビューポートの下部（ bottom）に達した時にアニメーションが始まる、ということらしい。
これで少しは制御しやすくなったかも。
あとはpropsの中身がよくわからない。透明度は.01から.99だからわかりやすいのだけど、ここの
https://codepen.io/electerious/pen/QGNxxx
0から100pxがわかりにくい
position:relativeのことだと思うんだけど、アニメーションしてズレて動くから値が掴みにくい
このへんはもっといじってみないとわかんないな
てか素直にjqueryのを探した方が使いやすいかもしれないけど、他のjsに非依存というのは利点だと思うから、なんとかモノにしたい
なんとか導入してみたけれどまだコピペの域を出ない
内容を把握した上で弄れば多彩な表現ができるのだけど、jsなのかbasicscroll独自のものなのかわからないけど、何をどう書いたらいいのかがわからない
でもひとまずは置くことができたので少しずつ触っていこう
試しててうまく動かないからここの見た目がアレなことになってる。
デモ通りに、そのままコピペすると動く。でもその中から自分の使いたいものだけ残すと動かない…
jsを弄ればいいんだろうけどまだ仕組みがよくわかってないから難しい。
パララックスというたいして実用的ではないものにこんなに時間を割いていいものか。
あ、動いた。
試しにwordpressから、さっきの静的ページのjsを読み込んでみたら動いた。
js内の記述がおかしかったかも。
まだ試しているbasicscroll。
どうやっても動かない。何かがおかしいと思ってこことは別にページを作ってみた。
https://y38.org/scrolltest/
ここではちゃんと動く。
jsの呼び出しをbody末尾に記述するんだけど、もしかしたらwordpressが吐き出してるもろもろが悪さしてるのか？
パララックス試してみたいだけで他のなんでもいいのかとしれないけど、せっかくなら新しいの試したかったのに、もしwordpressが悪さしてるのだったら使えない…困った。
