ハートアニメーション付きポップアップ
詳細
概要
モダンなポップアップで、ハートアニメーションとライクカウンターを搭載。
プロンプト
白い背景に、黒の1ピクセル枠があるポップアップを作成してください。ポップアップ内には、'SF Pro Text Bold'フォントを使用した'Like'アイコン付きのボタンが含まれている必要があります。ボタンはクリック時に押された状態になる黒い長方形です。ボタンをクリックすると、赤いハートがボタンから美しいランダム効果とともに、正弦曲線に沿ってアニメーションします。複数回クリックすると、複数のハートが生成され、それぞれがフェードアウトします。ポップアップには「50 Likes」から始まるカウンターも表示されます。 構造: - ポップアップ: 300x200ピクセル、丸みのある角と黒の1ピクセル枠。 - ボタン: 100x40ピクセル、黒い背景に'Like'のテキスト/アイコン。 インタラクション: - ボタンクリック: ハートのアニメーションをトリガー;ボタンが押された状態 (視覚的フィードバック)。 アニメーション: - ハートアニメーション: 正弦曲線に沿って上昇し、2秒後にフェードアウト;同時に複数のアニメーションをサポート。 - ライクカウンター: ボタンクリックごとに増加。 要件: - デザイン: モダンでミニマル、視覚的フィードバックが明確。 - 機能: スムーズなアニメーション、正確なカウンター更新、直感的なユーザーインタラクション。
元のプロンプト
Сделай на белом фоне поап с бордюром 1 пиксель черным; белый попап с кнопкой Like (шрифт SF Pro text bold) кнопка прямогольная черная при нажатии есть состояние прессед при нажатии на кнопку из кнопки должно вылетать красное сердечко по синусоиде рандомно красивый эффект. если много раз нажать то вылетят много сердечек и растворятся. При этом на попапе меняется цифра с количеством 50 Likes Q: Какой стиль должен быть у попапа и кнопки? A: Попап 300x200 пикселей с закругленными углами, кнопка 100x40 пикселей. Q: Как именно должна работать анимация с сердечком? A: Сердечко должно подниматься вверх по синусоиде и исчезать через 2 секунды.
生成コストの概要
モデル名: o3-mini-high
応答時間: 128.23 sec.
結果トークン: 7,502
コスト: $0.03367320