アナログ時計ジェネレータLite更新！ーGoogleサイトで作るグループウェア(178)ー
🙇🏻いつも、Googleサイトで作るグループウェアを見ていただき、ありがとうございます！
この記事を読んで欲しい方
企業DXや学校DXの進め方に悩んでいる方
クラウドアプリの導入に悩んでいる方
自分だけのGoogleサイトを作ってみたい方
①アナログ時計ジェネレータLite（無料版）更新
みなさんこんにちは。
Claude使っていますか？
今回は、以前作っていたアナログ時計ジェネレータLiteの更新です。（このプログラム自体はすべてClaude上で作成しています。）
プロ版（現在未公開。9月に有料で公開します）に組み込んでいた、設定JSONの入出力をLite版（無料）にも組み込みました。これで、デザイン設定の譲渡やRemixが可能になりました。
また、下記のようにClaude等のAIを使った、JSONでのデザイン案の生成も可能となりました。
②Lite版の機能について
Lite版ではプロ版との差別化で、いくつかの内容を整理し、設定のバリエーションを制限しています。
●フォント：サンセリフ、セリフ、装飾のフォント数を20字体と半分程度に制限しています。プロ版では現在42字体です。
●数字パターン：通常(1-12)とローマ数字(I-XII)に制限しています。プロ版では更に、交互(II I)、ミニマル(II I I)、4分割(3,6,9,12)、4分割ローマ数字が追加されます。
●材質：使える材質を光沢とメタリックに制限しています。プロ版では更にパール、サテン、放射状、放射状（ハイライト）が追加されます。
●針の形状：使える針を直線、長方形、台形、ドルフィンの４つに制限しています。プロ版では、ペンシル、アロー、アルファー、バトン、ローサンジュ、リーフ、遮眼子、ブレゲ、スペードが追加されます。
●設定ファイルの保存と読込：JSONファイルで保存・読込できます。
Lite版には搭載されておらず、プロ版にのみある機能としては、
●内枠：Lite版にはありません。プロ版にはbeta版として搭載しています。文字盤や外枠のデザインの自由度が大幅に拡張されます。
設定ァイルの保存と読込の機能がLite版に付いたことで、Lite版でも設定JSONファイルをAIに読み込ませて、不完全ですがAIにデザインさせることもできるようになりました。
③使い方
使い方は、直感的なデザインにしていますので、マニュアルは不要だとおもいます。
タブは、設定とプレビュー、コード生成に分かれています。
設定とプレビューでは、時計のデザインをします。コード生成タブでは、Webに貼り付けるHTMLコードの生成、コードのコピー、設定JSONファイルの保存・読込のボタンがあります。
生成したコードをコピーして、Googleサイトの埋め込む＞埋め込みコードに貼り付けると、動作するアナログ時計がサイトに埋め込まれます。
さらに画面の下部のボタンは、生成・コピーしたHTMLコードを再圧縮するサイトへのリンク、Notion用にアナログ時計を埋め込むサイトへのリンク、Claude AIへJSONを読み込ませてデザインさせるためのリンクが配置されています。
さらに、その下には、サンプルのアナログ時計と、その設定JSONファイルのダウンロードボタンがあります。
JSONファイルをダウンロードして、コード生成タブ＞設定読込ボタンで読み込むと、サンプルの時計を画面上に再現し、修正することができます。
このように、コード生成タブ＞設定保存で保存した設定JSONファイルを配布することで、デザインしたアナログ時計のRemixが可能になります。
④おわりに
いかがでしたでしょうか？
夏休み期間をつかって、ずっと開発をしていましたが、ようやく公開できる形になってきました。
今回のようなアナログ時計ジェネレータの開発は、デジタル・プロダクト・デザインとは何かを考える、良いきっかけとなったと感じています。
９月にはプロ版（有料）を公開しますが、今までにないような、美しく高級な動くアナログ時計をデザインすることができています。（予定価格は1980円で少し高めですが、Claudeに相談して価格を提案されました。）
この記事が参加している募集
この記事が気に入ったらサポートをしてみませんか？