Beeknoee Logo
Đăng nhậpĐăng ký miễn phí

lnkiai/m3e-canvas

Public

Sketch Material 3 Expressive screens in the browser and turn them into vibe-coding prompts.

design-toolmaterial-3-expressivematerial-designmaterial3nextjspromptreactvibe-coding
Star9.9kFork1.1kWatch37Mở trên GitHub
Beeknoee

Bee AI phân tích repositoryBETA

AI đọc README và cây file để tóm tắt, gợi ý cách dùng và đánh giá repository. Mọi con số lấy từ kho Bee, không do AI ước lượng.

Cập nhật lần cuối: 31/10/2026

Đăng nhập để hỏi Bee AI

Tóm tắt bởi Bee AI

M3E Canvas là công cụ thiết kế trên trình duyệt giúp dựng giao diện Material 3 Expressive, liên kết các màn hình và tạo prompt cho các công cụ AI coding như Claude Code hay Cursor.

  • Hỗ trợ kéo thả đầy đủ linh kiện Material 3 Expressive cùng cơ chế kết nối từ tính (magnetic connections).
  • Thiết lập chuyển màn hình thông qua thao tác chạm hoặc vuốt kèm hiệu ứng xem trước tương tác trực tiếp.
  • Xuất thiết kế thành prompt lập trình cho Android hoặc Web bằng 4 ngôn ngữ (Anh, Nhật, Trung, Hàn).
  • Hoạt động hoàn toàn trên trình duyệt, lưu trữ qua localStorage và gửi API trực tiếp nếu dùng trợ lý AI.

Lưu ý

  • Trình chỉnh sửa trên điện thoại bị giới hạn ở 1 màn hình và chỉ hỗ trợ nút bấm; trải nghiệm đầy đủ yêu cầu trình duyệt máy tính.
  • Tính năng chia sẻ liên kết và bản nháp AI (AI drafts) hiện đang ở giai đoạn thử nghiệm (beta).

Điểm BeeTính thuần từ số liệu trong kho Bee, không phải AI chấm: bách phân vị sao 30% · độ tươi lần push 25% · fork và watcher 15% · README, giấy phép, mô tả 20% · có bản phát hành 10%.

  • Độ phổ biến88
  • Độ tươi80
  • Cộng đồng36
  • Tài liệu100
  • Phát hành20
  • Mức độ khóDễ tiếp cận
  • Phù hợp vớiLập trình viên
  • Loại dự ánCông cụ
  • Giấy phépMIT

Kiến trúc & Công nghệ

Công nghệ AI nhận ra từ README và cây file — chỉ những mục nằm trong danh sách Bee kiểm.

Tech stack

  • TypeScript
  • React
  • Next.js
  • Android
  • OpenAI API
  • Anthropic API
  • Gemini API

Kiến trúc tổng quan

Repository → công nghệ chính → các thư mục cấp 1 có thật trong repo; vai trò do AI mô tả.

  • app/Mã nguồn trang và định tuyến Next.js App Router.
  • components/Các thành phần UI của canvas, bộ phận M3E và thanh công cụ.
  • docs/Tài liệu hướng dẫn bổ sung của dự án.
  • lib/Các hàm tiện ích và logic xử lý dữ liệu canvas, prompt.
  • public/Tệp tĩnh và tài nguyên công khai phục vụ web.

Hướng dẫn nhanh

Các bước để bắt đầu với repository này.

bash
git clone https://github.com/lnkiai/m3e-canvas.git
cd m3e-canvas

Các use case chính

Những ứng dụng có thể xây dựng từ repository này.

  • Phác thảo nhanh màn hình ứng dụng chuẩn Material 3 Expressive trên điện thoại và máy tính.
  • Tạo prompt chi tiết từ giao diện trực quan để đưa vào Claude Code, Codex, Cursor hay Gemini CLI.
  • Thử nghiệm luồng chuyển màn hình (tap/swipe) và các hiệu ứng động Material Design trước khi lập trình.
  • Chia sẻ bản thiết kế thông qua liên kết trực tiếp trên canvas hoặc xuất ảnh màn hình dạng PNG.

Repository tương tự

Cùng chủ đề trong kho Bee.

  1. 1freeCodeCamp/freeCodeCampfreeCodeCamp.org's open-source codebase and curriculum. Learn math, programming, and computer science for free.458.3k+468
  2. 2morluto/reaReverse engineer anything with agents, from app behavior down to native binaries.415.4k+36.9k
  3. 3react/reactThe library for web and native user interfaces.251.9k+155
  4. 4flutter/flutterFlutter makes it easy and fast to build beautiful apps for mobile and beyond180.8k+471
  5. 5f/prompts.chatf.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy.175.4k+1k

Nội dung do AI sinh, có thể sai hoặc thiếu — số liệu lấy từ kho Bee, không do AI ước lượng. Cập nhật lần cuối: 31/10/2026.

Đăng nhập