PWA制作
これまでウェブページに配置して利用していたコンテンツ・スクリプト（JavaScript）を、シンプル設計のアプリケーションシェル（HTML・CSS）とマニフェスト（JSON）・スクリプト（Service WorkerなどのJS）などを合わせたものにのせたPWA（Progressive Web Apps）を制作します。
PWA
PWAとは、ウェブページと同じブラウズ性にネイティブアプリの操作性を加えたもので、スマートフォンなどのモバイル端末で高速表示とオフラインでの利用ができ、アプリのようにインストール・プッシュ通知することも可能です。
そのため、事前に読み込みができていれば地下鉄内や山間部などの電波が届かないところでも利用できます。
FUTURE ARTISTIC APPLICATION
未来アプリ（仮）
活用の可能性と限界を実験するために開発・試作・制作したPWAのサンプルです。（サーバーにより自動的に追加される広告がちょっとあれですが、、、。）
スマートフォンのChromeで開きインストールすると、並んだアプリの最後尾にアイコンが追加され、ネットワーク接続のないオフライン状態でも使用できます。
技術的にはウェブページがベースなので、オンライン状態のデスクトップ版ウェブブラウザーでも動作し、Chromeではアプリとして追加もできます。
アプリとして追加した後は一般的なアプリケーションのようにウェブブラウザーを通さず直接起動することができます。
特長
- アプリケーションシェル（App Shell）は、このサイトでも使用しているウェブサイト用フレームワーク「JVW 04」互換のサブセットにあたる「Java Sparrow」を新たに開発。
- アプリケーションシェルがウェブサイト用と互換性のあるサブセットのため、ウェブサイト用に制作したGUI描画・処理・結果描画を行うスクリプトを変更することなくのせることが可能。
- 今後制作するPWA内のコンテンツ・スクリプトは、PWA独自の機能を使用していなければ変更することなくウェブサイトにのせることが可能。
スマートフォンへのインストール
#301 まぜまぜ配色くん
NISHIKI
#303 いろいろ配色くん
COLOR SCHEME SIMULATOR
#304 ぴこぴこサイズくん
LAYOUT SIZE CALCULATOR
#305 ひょいひょいミリピクくん
mm-px CONVERTER
#306 どれどれ勘定科目くん
ACCOUNT TITLE SEARCHER
#307 つぎつぎ表示くん
LINEAR CONTENTS SLIDER
#308 ぴこぴこテンポくん
TEMPO CALCULATOR
#nnn（企画中）
?
#nnn（計画中）
?
#nnn（計画中）
?
#311 ぴこぴこ月齢くん
KAGUYA
開発ログ
- 2017/12/01
#305 mm-px CONVERTER
HTML用JavaScriptからの移植 -
基本設計・インストール実験
インストール後の更新が反映されるタイミング調査
（Service Workerを更新し最上部でさらに上にスクロールしようとすると再読込され、更新の反映は「再起動なし」または「次回起動時」のいずれかで行われる。） - 2017/12/01
#306 ACCOUNT TITLE SEARCHER
HTML用JavaScriptからの移植 -
同ドメインに複数アプリの配置実験
（Service Workerはそれぞれ動作可能）
start_urlより上位の共通データの利用実験
制作時間調査
（処理部分のスクリプトがあれば10分程度で完成） - 2017/12/06
#307 LINEAR CONTENTS SLIDER - スマホ横長・タブレットでのレスポンシブレイアウトの限界実験
- 2017/12/08
#303 COLOR SCHEME SIMULATOR
HTML用JavaScriptからの移植 -
制作時間調査
#301 NISHIKIに統合 - 2018/04/22
#303 COLOR SCHEME SIMULATOR
HTML用JavaScriptからの移植 -
GUIの効率化による操作性向上を目的としたレンダリング後のposition:fixed設定の実験
#301 NISHIKIに統合 - 2018/11/03
#302 3D COLOR SCHEME CALCULATOR -
SVG操作（stop-color, fill）の実験
（ローカルではsetAttributeが動作しない。おそらくgetElementByIdでSVGが取得できていない。）
#301 NISHIKIに統合 - 2018/12/08
#304 LAYOUT SIZE CALCULATOR
HSPからの移植 - Decimalの実験
- 2020/05/03
#311 KAGUYA
Flash用ActionScriptからの移植 -
SVG操作（transform, textContent）の実験
ベクター系なのでラスター系のような変形による劣化は発生しない。
（ローカルではsetAttributeが動作しない。おそらくgetElementByIdでSVGが取得できていない。） - 2022/08/03
#308 TEMPO CALCULATOR - Decimalの実験
- 2023/03/15
以前デスクトップ機器にインストールしたPWA -
起動しようとすると問題なく起動するものと「「（PAW名）」は現在サポートされていません 古いバージョンの Chrome アプリを Windows デバイスで使用できるのは、2022 年 12 月までです。新しいバージョンが利用可能かどうか確認してみてください。」と表示されるものがある。
「N件のサポートされていないアプリを削除」の対象ではないものの、上記のようにPWA名が表示される。 - 2024/02/11
#301 NISHIKI -
色変換に特化したライブラリー「COLOR CORE」を共有して利用する実験。
複数のスクリプトを統合の実験
既存の#302 3D COLOR SCHEME CALCULATORと#303 COLOR SCHEME SIMULATORをCOLOR CORE利用仕様に調整と統合用に改修し、COLOR CONVERTOERとCOLOR SCHEME PLANNNERを追加。
Copyright © Kurikaraya All Rights Reserved.