スマホ向けサイトをアプリっぽく見せるために半年間頑張ったことをまとめる - Qiita

この記事は リクルートライフスタイル Advent Calendar2018の20日目の投稿です。 はじめに この記事では スマホ向け web ページをアプリっぽく見せるための Tips を多く紹介します。 (CSS / JS / jQuery / React / WebGL の事例を紹介します) （注） React 環境でのサンプルコードが多めですが、実装方法はどの環境でも変わらないと思います。ライブラリも同種のものが存在しているはずです。 最近だと、僕の大好きなアプリで味わった体験を、どうすれば Web で再現できるかなーって考えていました。そうしたネイティブアプリをWebで模倣したときに、知ったTipsやテクニックをまとめていきます。 この記事に書いてあること アプリっぽい体験はどのようなものがあるか CSS / JS / jQuery / React / GLSL を利用したネイテ

[north_korea]

僕はユーザーにとって本当に必要なアニメーションがほとんどないということに気づいてアプリっぽく見せるのをやめた。それから無限スクロールはUX最悪なので、ページングはちゃんとURL遷移で実装すべき。

[cateching]

そのアプリっぽさは誰のため？

[jaxx2104]

現時点でのウェブとネイティブの差分がわかる記事。ただ近い将来この差は無くなっていくかもなと感じた。

[kno]

iOSがPWAにちゃんと対応したら起こして

[kikuchi1201]

うーーん、アプリでよいのでは？

[yug1224]

jQuery から React や WebGL まで使って、 Web で Native の動きを実現できるかを地道に頑張った話。例えば WebView でも動くのであれば、ユーザに違和感を感じさせずに同等の UX を提供することもできそう。

[n314]

無限スクロールで大量に表示した後移動して戻ってきたらまた最初からになるの、見る気なくすよね。

[yjkym]

ブコメが宗教臭

[sho_yamane]

アニメーション好きだけどアプリぐらいのパフォーマンス出るようになるまでは見せ物サイト以外は極力控えるべきなんだよな〜

[teracy_junk]

力作

[yarumato]

“突然レイアウトが変わるなどカクついた動き「web っぽい」、なめらかな動き「ネイティブっぽい」 ページから Web 特有のカクツキを無くそう ページになめらかさを足そう ブラウザの機能やパーツを隠そう”

[miho-satoh-satomi]

ウェブサイト スマホアプリっぽく