限定公開

【Claude公式】宇宙のキーストロークを他のAIで試す
Claude公式のプロンプトを他のAIでも試す用です。 docs.anthropic.com/claude/page/cosmic-keystrokes プロンプト実行時にAIを切り替えて実行します。
投稿日時:
- プロンプト実行例
- プロンプトを見る
Claude公式のプロンプトを他のAIでも試します。
変数1
html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4<meta charset="UTF-8">
5<meta name="viewport" content="width=device-width, initial-scale=1.0">
6<title>Word Adventure Game</title>
7<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
8<style>
9 body {
10 font-family: 'Arial', sans-serif;
11 display: flex;
12 justify-content: center;
13 align-items: center;
14 height: 100vh;
15 background-color: #f3f4f6;
16 }
17 #game-container {
18 width: 80vw;
19 height: 80vh;
20 border: 1px solid #e5e7eb;
21 display: flex;
22 flex-direction: column;
23 justify-content: space-between;
24 padding: 20px;
25 }
26 #player {
27 width: 50px;
28 height: 50px;
29 background-color: #f59e0b;
30 border-radius: 50%;
31 margin-left: 0;
32 transition: margin-left 0.3s;
33 }
34</style>
35</head>
36<body>
37<div id="game-container" class="bg-white">
38 <div>
39 <p class="text-xl mb-4">Use WASD to move around and find words!</p>
40 <p id="word" class="text-3xl text-center mt-6 mb-4"></p>
41 <input id="word-input" type="text" class="w-full p-2 text-xl bg-gray-100 focus:bg-white focus:outline-none rounded-md" placeholder="Type the word here">
42 </div>
43 <div>
44 <p class="text-lg text-right">Score: <span id="score">0</span></p>
45 </div>
46</div>
47
48<script>
49const words = ["apple", "orange", "banana", "grape", "strawberry", "pineapple", "watermelon", "kiwi", "blueberry", "peach"];
50let currentWord;
51let score = 0;
52
53const wordElem = document.getElementById('word');
54const wordInput = document.getElementById('word-input');
55const scoreElem = document.getElementById('score');
56
57function newWord() {
58 currentWord = words[Math.floor(Math.random() * words.length)];
59 wordElem.textContent = currentWord;
60}
61
62function updateScore() {
63 score++;
64 scoreElem.textContent = score;
65}
66
67newWord();
68
69wordInput.addEventListener('input', () => {
70 if (wordInput.value.trim() === currentWord) {
71 updateScore();
72 wordInput.value = '';
73 newWord();
74 }
75});
76
77document.addEventListener('keydown', (event) => {
78 const key = event.key.toLowerCase();
79 if (key === 'a' || key === 'w' || key === 's' || key === 'd') {
80 const player = document.getElementById('player');
81 const marginLeft = parseInt(window.getComputedStyle(player).marginLeft, 10);
82 const movement = 20;
83 if (key === 'a') {
84 player.style.marginLeft = `${Math.max(marginLeft - movement, 0)}px`;
85 } else if (key === 'd') {
86 player.style.marginLeft = `${Math.min(marginLeft + movement, window.innerWidth - 70)}px`;
87 }
88 }
89});
90</script>
91</body>
92</html>コメント 0
他のプロンプトもチェック
GPTs
分析・推論
ニュース記事などのURLを貼ると、ネット炎上対策の専門家として問題点、肯定的・否定的視点での分析、予想されるX(旧ツイッター)での批判ポスト、ネット炎上対策のためのアドバイスなどの回答を提供します。さらに深い分析やアドバイスを答えたり、ネット炎上に関するどんな質問にも専門家として回答してくれます。1074499GPTs
キャラクター作成
▼最新作はこちら▼ https://oshiete.ai/item_lists/73557973863457792 あなたの顔写真を送付するだけで顔面偏差値を数字で出力してくれます。各項目別に点数付けしてくれて、顔の強みや特徴まで分析してくれるツール。客観的評価を知りたい方はぜひ使ってみてください。622.99K10.7KGPTs
情報収集
お客様の会社の特徴を入力すると、近い業種業態での生成AI活用事例を紹介します。「どのようにAIを使ったらいいか分からない」という方は、ぜひお使いください。62156546