Skip to main content
Version: v2.4.0 (Current)

🚀 5-Minute Quickstart

Welcome to Artok Studio! This guide will take you from a blank canvas to a running HMI simulation using our AI-Native Workflow. See how Artok transforms natural language into high-performance embedded interfaces.

📺 Watch the AI in Action​

Before you start, watch how Artok handles complex layouts and styling with simple text prompts.

1. Create Your Project​

  1. Open the Artok Studio Editor.
  2. Click New Project and select a hardware template (e.g., STM32F429-Discovery).
  3. Name your project MyFirstHMI and click Create.

2. Generate Layout with AI​

Forget dragging widgets manually. Let the AI handle the heavy lifting.

  1. In the Top Bar, click the 🪄 AI Layout button.
  2. In the prompt box, type:

    "Create a professional industrial pump controller with a pressure gauge, a flow rate chart, and an emergency stop button."

  3. Click Generate. Watch as Artok intelligently places and sizes the components.

3. Add Intelligence with AI Interactions​

Now, let's make the "Emergency Stop" button functional without writing code.

  1. Select the Stop Button in the Widget Tree.
  2. Click the ⚡ AI Interactions button.
  3. Type: "When clicked, set the pressure gauge to zero and change the button color to bright red."
  4. Click Apply. The AI generates the backend Lua script for you automatically.

4. Test in the Live Simulator​

  1. Click the 💻 Live Simulator tab.
  2. Your HMI is now "Live." Click the Stop button to see the pressure gauge react instantly.
  3. This simulator uses the same logic engine as your hardware, ensuring a 1:1 behavior match.
PRO TIP: AI INSPIRATION

Not sure about the look? Use the 🎨 AI Inspiration button to generate visual moodboards or placeholder assets directly on your canvas to kickstart your design process.

Next Steps​

Now that you've built your first HMI, learn how to deploy it: