Tencent SkillHub · AI

Vibe Design

Create visual designs with AI tools. Covers prompting for UI/graphics, Midjourney techniques, Figma AI workflow, and iteration patterns.

skill openclawclawhub Free

0 Downloads

0 Stars

0 Installs

0 Score

High Signal

Create visual designs with AI tools. Covers prompting for UI/graphics, Midjourney techniques, Figma AI workflow, and iteration patterns.

⬇ 0 downloads ★ 0 stars Unverified but indexed

Install for OpenClaw

Quick setup

Download the package from Yavira.
Extract the archive and review SKILL.md first.
Import or place the package into your OpenClaw setup.

Requirements

Target platform: OpenClaw
Install method: Manual import
Extraction: Extract archive
Prerequisites: OpenClaw
Primary doc: SKILL.md

Package facts

Download mode: Yavira redirect
Package format: ZIP package
Source platform: Tencent SkillHub
What's included: SKILL.md, figma.md, image-gen.md, prompting.md, tools.md, ui-design.md

Validation

Use the Yavira download entry.
Review SKILL.md after the package is downloaded.
Confirm the extracted package contains the expected setup assets.

Install with your agent

Agent handoff

Hand the extracted package to your coding agent with a concrete install brief instead of figuring it out manually.

Download the package from Yavira.
Extract it into a folder your agent can access.
Paste one of the prompts below and point your agent at the extracted folder.

New install

I downloaded a skill package from Yavira. Read SKILL.md from the extracted folder and install it by following the included instructions. Tell me what you changed and call out any manual steps you could not complete.

Upgrade existing

I downloaded an updated skill package from Yavira. Read SKILL.md from the extracted folder, compare it with my current installation, and upgrade it while preserving any custom configuration unless the package docs explicitly say otherwise. Summarize what changed and any follow-up checks I should run.

Open Send to Agent page Open JSON manifest Open Markdown brief

Trust & source

Release facts

Source: Tencent SkillHub
Verification: Indexed source record
Version: 1.0.0

Provenance

Publisher: ivangdavila
Source page: View original listing
Canonical URL: Open canonical page

Documentation

ClawHub primary doc Primary doc: SKILL.md 11 sections Open source page

What is Vibe Design

Design where you describe what you want and let AI generate visuals, layouts, and assets. You iterate based on results rather than pixel-pushing from scratch. Same philosophy as vibe coding applied to visual design. Core principle: AI handles exploration and generation. You handle curation and refinement.

Quick Reference

TopicFilePrompting for visualsprompting.mdUI/UX design with AIui-design.mdImage generation tipsimage-gen.mdFigma AI workflowfigma.mdTools by use casetools.md

1. Use Design Vocabulary, Not Art Vocabulary

AI responds differently to design vs art terms. ❌ Art words: "beautiful", "fantasy", "render", "painting", "stunning" ✅ Design words: "interface", "layout", "component", "spacing", "hierarchy" Bad: "beautiful mobile banking product, minimal futuristic style" Good: "mobile banking app UI in Material Design 3, clean layout, consistent spacing, data cards with financial metrics"

2. Anchor with Design Systems

Adding a design system name drastically improves structure: "Material Design 3" → balanced spacing, cards, shadows "Apple HIG" → soft radii, clear typography, native feel "IBM Carbon" → enterprise dashboard layouts "Atlassian" → B2B tone, crisp typography

3. Layer Your Prompts

Build prompts with structure: [Project type] UI design for [product/audience], [style keywords], [layout type], [color palette], [design system reference], [rendering style]

4. Aspect Ratios Matter

Web: --ar 16:9 Mobile: --ar 4:5 or --ar 9:16 Square/icons: --ar 1:1 Always specify for consistent output

5. Iterate, Don't Perfect First Try

Vibe design = rapid exploration. Generate 4-8 variants Identify elements that work Remix: "Like image 2, but with the color palette from image 3" Refine winner in production tool (Figma, etc.)

6. AI for Exploration, Tools for Production

AI generates: Mood, direction, concepts, rough layouts Production tools refine: Pixel-perfect spacing, real content, responsive behavior Don't try to get production-ready from AI. Use it for the 80% exploration, finish the 20% manually.

7. Reference Over Description

When possible, show don't tell: Attach reference images Link to existing designs you like Use "in the style of [specific designer/brand]"

8. Design System Consistency

For production work: Export AI concepts as references, not finals Rebuild in your design system Maintain your spacing, typography, and color tokens AI inspiration → human implementation

9. Know the Tool Strengths

ToolBest ForMidjourneyArtistic concepts, mood explorationFigma AIUI iteration, production designDALL-E/GPTQuick mockups, image editingStable DiffusionCustom training, open-source controlCanvaMarketing assets, social media See tools.md for detailed comparison.

Category context

Agent frameworks, memory systems, reasoning layers, and model-native orchestration.

Source: Tencent SkillHub

Largest current source with strong distribution and engagement signals.

Package contents

Included in package

6 Docs

SKILL.md Primary doc
figma.md Docs
image-gen.md Docs
prompting.md Docs
tools.md Docs
ui-design.md Docs