📚 SenseCraft HMI Documentation

Official Documentation for SenseCraft HMI Platform

A no-code UI builder for e-paper and e-ink displays

🌐 View Documentation • 🐛 Report Bug • 💡 Request Feature

---

🎯 About This Project

This repository contains the official documentation for SenseCraft HMI - an innovative no-code platform that empowers users to design beautiful user interfaces for e-paper and e-ink displays without writing a single line of code.

🌟 What is SenseCraft HMI?

SenseCraft HMI is a comprehensive platform that includes:

• 🎨 Canvas Editor - Drag-and-drop UI design tool
• 🤖 AI Generator - AI-powered layout generation
• 🖼️ Gallery - Pre-made templates and designs
• 🌐 Web Integration - Real-time data display
• 📡 RSS Support - Dynamic content updates
• 📱 Multi-device Support - Compatible with various e-paper displays

📖 Documentation Features

• 🌍 Multi-language Support - Available in English, Chinese (简体中文), Japanese (日本語), and Spanish (Español)
• 🔍 Full-text Search - Find what you need quickly
• 📱 Responsive Design - Perfect on desktop, tablet, and mobile
• 🎯 Easy Navigation - Organized by topics and difficulty levels
• 💡 Rich Examples - Code snippets, tutorials, and best practices

---

🚀 Quick Start

Prerequisites

Before you begin, ensure you have the following installed:

• Node.js v18.0 or higher
• npm v9.0 or higher
• Git

Installation

1. Clone the repository

   git clone https://github.com/Seeed-Solution/sensecraft-hmi-docs.git
   cd sensecraft-hmi-docs

2. Install dependencies

   npm install

3. Start development server

   npm run dev

4. Open in your browser

   Navigate to http://localhost:4321

   The site will automatically reload when you make changes! 🔄

---

🤝 How to Contribute

We welcome contributions from the community! Whether you're fixing a typo, improving documentation, or adding new content, your help is appreciated.

📝 Contributing Documentation

1️⃣ Edit Existing Content

Find the file you want to edit:

src/content/docs/
├── en/     # English
├── zh/     # 简体中文
├── ja/     # 日本語
└── es/     # Español

Make your changes and submit a pull request!

2️⃣ Add New Pages

Create a new .md or .mdx file in the appropriate language folder:

---
title: Your Page Title
description: Brief description that appears in search results
---

# Your Page Title

Write your content here using Markdown...

3️⃣ Multi-language Guidelines

When adding new content, please provide translations in all supported languages:

• ✅ English (en/) - Required
• ✅ Chinese (zh/) - Required
• ✅ Japanese (ja/) - Required
• ✅ Spanish (es/) - Required

Keep the same file structure across all languages:

en/guides/your-guide.md
zh/guides/your-guide.md
ja/guides/your-guide.md
es/guides/your-guide.md

🎨 Content Guidelines

Markdown Formatting

# Heading 1
## Heading 2
### Heading 3

**Bold text**
*Italic text*
`Inline code`

- Bullet point 1
- Bullet point 2

1. Numbered list
2. Second item

Code Blocks

```python
# Python example
import sensecraft_hmi

display = sensecraft_hmi.Display()
display.show_text("Hello World")
```

Callouts/Admonitions

:::tip[Pro Tip]
Use AI Generator to quickly create layouts!
:::

:::note
This feature requires firmware v2.0 or higher.
:::

:::caution
Always backup your designs before updating firmware.
:::

:::danger
Incorrect voltage may damage your display!
:::

Images

1. Place images in src/assets/ or public/
2. Reference in your markdown:

![Alt text](../../assets/your-image.png)

Tables

| Feature | Support | Status |
|---------|---------|--------|
| E-Paper | 7.5" | ✅ |
| Color | Spectra 6 | ✅ |
| No-Code | Yes | ✅ |

🔍 Before Submitting

Please ensure:

• ✅ Content is technically accurate
• ✅ All code examples are tested
• ✅ Images are properly displayed
• ✅ Links are working
• ✅ No spelling/grammar errors
• ✅ Follows existing documentation style
• ✅ Multi-language versions are consistent

🐛 Reporting Issues

Found a problem? Please open an issue with:

• 📝 Clear description of the problem
• 📍 Link to the page (if applicable)
• 💡 Suggested solution (if you have one)

---

🛠️ Development Commands

Command	Description
npm install	Install dependencies
npm run dev	Start development server (port 4321)
npm run build	Build for production
npm run preview	Preview production build
npm run astro	Run Astro CLI commands

🔧 Troubleshooting

Module not found error

rm -rf node_modules package-lock.json
npm install

Port already in use

npm run dev -- --port 3000

Build errors

• Check for syntax errors in Markdown files
• Ensure all image paths are correct
• Verify frontmatter YAML format
• Check for broken links

---

📁 Project Structure

sensecraft-hmi-docs/
├── src/
│   ├── content/
│   │   └── docs/           # Documentation content
│   │       ├── en/         # English
│   │       ├── zh/         # Chinese
│   │       ├── ja/         # Japanese
│   │       └── es/         # Spanish
│   ├── assets/             # Images and media
│   └── styles/             # Custom CSS
├── public/                 # Static assets
├── dist/                   # Build output
├── astro.config.mjs        # Astro configuration
└── package.json            # Dependencies

---

🌍 Supported Languages

Language	Code	Status	Maintainer
English	en	✅ Active	Core Team
简体中文	zh	✅ Active	Core Team
日本語	ja	✅ Active	Core Team
Español	es	✅ Active	Core Team

Want to add a new language? Open an issue to discuss!

---

🔗 Useful Links

• 📚 Astro Documentation
• ⭐ Starlight Theme
• ✍️ Markdown Guide
• 🎨 SenseCraft HMI Platform
• 🏪 Seeed Studio

---

📄 License

This documentation is open source and available under the MIT License.

---

💬 Get Help

Questions? Issues? Suggestions?

💬 GitHub Discussions • 🐛 Issue Tracker • ✉️ Contact Us

---

Built with ❤️ by Seeed Studio

⭐ Star us on GitHub if this documentation helped you!