AIのデザイン画像を、
HTML/CSSのページに。

CHANGESデザインから変えた点

1. 灰色の線に、文章を入れましたデザイン画像で灰色の線だった所は、お店の説明・事例・流れ・質問の答えなどの文章にしています。
2. いちばん上の帯を「見本です」の表示にしました架空のお店の見本であること、デザイン画像と写真を生成AIで作ったことが最初に分かるように、帯の文を差しかえました。
3. 生地のチップで、椅子の色が変わるようにしましたデザイン画像の椅子の写真から、座面の色を6色作りました。押すと座面の色が変わり、選んだ生地に印と「選択中」が出ます。
4. 写真に重なっていた見出しは、文字で置き直しました「生地を選ぶ」の見出しが写真の中に焼きこまれていたので、写真からは消し、文字として重ねています。
5. 店名を差しかえましたデザイン画像の店名が、登録されている商標と読みが同じだったため、「はりのめ」に変えました。見比べの元の画像では、その店名の所をぼかしています。
6. 「No.」の札の形をそろえましたデザイン画像の上半分と下半分で札の形が少し違っていたので、上半分の形にそろえました。
7. 料金を税込の表示にしましたデザイン画像は税抜の料金でしたが、お店のページでは税込の総額を示すことが求められるため、税込（10%）に直しました。
8. 申し込みのボタンは動きません架空のお店なので、ボタンを押すと「見本のため動きません」と出ます。住所・電話・メールもダミーです。

SMARTPHONEスマホの表示