Artifacts are one of the most innovative and useful AI features of the past year, and one of the reasons we chose Claude as our chatbot of 2024 With the latest update, Artifact is now available to all Claude users, including those on the free plan

Claude's AI startup, Anthropic, has also brought Artifacts to mobile, allowing users to view and create Artifacts on its iOS and Android apps Each Artifact can also be shared and remixed

This feature allows users to have Claude create code, text blocks, or graphics and display them precisely in the sidebar This is a great way to prototype applications or create fun quick games

When Artifacts first launched, I created seven relatively complex Artifact ideas, including language flashcards, animators, and recipe apps Now that the feature is free, I have come up with seven more ideas

The more specific the initial prompt, the better, but each new instance of Claude is the beginning of a conversation, so I can easily add more details and features with follow-up prompts

Here, we used the terms “React” and “artifact” to instruct Claude to code using Javascript React and to work with the artifact

One thing to remember with Claude is that the three words “make it better” work wonders They come back with logical upgrades and changes Likewise, if you are dealing with code or graphics, the words “prettier,” as we have done with each of these prompts, are also sufficient for a major upgrade

First, have Claude create a simple calculator application It should appear in the sidebar and be usable Follow up with Claude and request a “scientific calculator feature” or a specific color scheme to upgrade

Prompt “Create a simple React calculator app that can perform basic arithmetic operations Display the code and render the output as an interactive artifact”

Next up is your first game This time, Claude is asked to generate a simple 3x3 grid for a three-way game in which the AI controls the opposing player Again, we can let Claude use a different color scheme, add grid options, and score tracking

Prompt “Design a three-way game using React Include game logic for win conditions and draws, a 3x3 grid, and a second player controlled by the AI Display the code and render a playable game as an artifact”

I've been coding for years as a hobby and after “hello, world” the first application most people create is a simple to-do list This is what we are asking Claude to do, and it can be extended by adding icons, gamification elements, and even pre-set tasks

Prompt “Develop a simple to-do list application using React Include the ability to add, complete, and delete tasks Display the code and render an interactive application as a deliverable”

Pomodoro Timer is a great way to keep track of specific tasks and stay focused If you create a timer in Claude, you can add customizations, set duration, and even add your own topics ToDo List It can also be integrated with applications

Prompt “Develop a React-based Pomodoro Timer application Include customizable work and rest times, circular progress indicators, and audio notifications Use efficient state management and hooks Display code and render functional timers as deliverables”

You won't get Photoshop in this next prompt, so set your sights a little lower Upgrade to include more colors, a wider range of shapes, and even pen and canvas size options

Prompt “Create a simple React-based drawing application Include tools for freehand drawing, adding shapes, and changing colors Implement undo functionality and the ability to save your drawing as SVG It displays the code and renders a usable drawing application as an artifact”

Making a keyboard is the more complex of what Claude can do, but it can be done However, making a keyboard is possible You can modify it by asking Claude to make it better You can also ask for more sounds or a lesson guide

Prompt “Using React, design an SVG-based interactive piano keyboard Create a one-octave keyboard that plays a corresponding note when a key is clicked Include visual feedback when keys are pressed Display the chords and render a playable piano as an artifact”

Finally, a fun diversion If you have spent more time customizing avatars for games than playing them (if you remember, you have created a Mii for the Nintendo Wii), you will enjoy this prompt This prompt can also be upgraded with more features, colors, and styles

Prompt “Develop a React component for creating customizable avatars Include options for face shape, eyes, nose, mouth, and hair Use SVG for the avatar parts Display the code and render the interactive avatar creator as an artifact”