Expert guide for automated and manual Web Accessibility (a11y) testing — axe-core, Pa11y, Playwright a11y, screen reader testing, and WCAG 2.2 Level AA/AAA compliance / Panduan ahli pengujian aksesibilitas web.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for AI image generation (Flux, DALL-E, Stable Diffusion), video generation (Sora, Runway), voice synthesis (ElevenLabs TTS), and speech recognition (Whisper STT) integration / Panduan ahli integrasi AI generasi gambar, video, suara (TTS), dan pengenalan suara (STT).
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
설치 방법 보기설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
<a name="english"></a>
brainstorming and zero-to-prod-orchestrator (Phase 5 - Core Feature Development & Media Generation) to integrate multimodal generative pipelines.ai-llm-integration-expert — Prompt engineering, reasoning model selection, and orchestration chains.file-upload-media-expert — Persistent storage (R2/S3), CDN distribution, and media pipeline handling.sse-websocket-streaming-expert — Progressive image generation streaming and real-time audio playback.async-queue-temporal-expert — Durable background queue execution for long-running video/audio generation.zero-trust-secret-vault — Secure API key rotation and credential vault for Replicate, OpenAI, and ElevenLabs.session-memory-manager — Store generation task metadata, prompt history, and asset references.Production-grade guide for integrating AI-powered media generation into web and mobile applications. Covers image generation (Flux 1.1 Pro, SDXL, DALL-E 3), video generation (Sora, Runway Gen-3), text-to-speech (ElevenLabs v3, OpenAI TTS), speech-to-text (Whisper large-v3, Deepgram Nova-3), and voice cloning. Includes async processing patterns, cost optimization, and content safety filtering.
Provider Selection Matrix:
| Provider | Model | Speed | Quality | Cost | Best For |
|---|---|---|---|---|---|
| Replicate | Flux 1.1 Pro | ~3s | ★★★★★ | $0.04/img | Photorealism, text rendering |
| Replicate | Flux Schnell | ~1s | ★★★★ | $0.003/img | High-volume, previews |
| OpenAI | DALL-E 3 | ~5s | ★★★★ | $0.04/img | Creative, prompt following |
| Stability | SDXL Turbo | ~2s | ★★★★ | $0.002/img | Self-hosted, customization |
Recommendation: Use Flux 1.1 Pro via Replicate for production quality. Use Flux Schnell for previews/drafts.
// Image generation with Replicate (Flux)
import Replicate from 'replicate';
const replicate = new Replicate({ auth: process.env.REPLICATE_API_TOKEN });
async function generateImage(prompt: string, options?: {
width?: number;
height?: number;
model?: 'flux-1.1-pro' | 'flux-schnell';
}) {
const model = options?.model ?? 'flux-1.1-pro';
const output = await replicate.run(
`black-forest-labs/${model}`,
{
input: {
prompt,
width: options?.width ?? 1024,
height: options?.height ?? 1024,
num_inference_steps: model === 'flux-schnell' ? 4 : 28,
},
}
);
return output; // URL to generated image
}
Provider Selection:
| Provider | Model | Latency | Expressiveness | Cost |
|---|---|---|---|---|
| ElevenLabs | eleven_v3 | ~500ms | ★★★★★ | $0.30/1K chars |
| ElevenLabs | eleven_flash_v2_5 | ~200ms | ★★★★ | $0.15/1K chars |
| OpenAI | tts-1-hd | ~300ms | ★★★ | $0.030/1K chars |
Recommendation: Use ElevenLabs eleven_v3 for expressive content. Use eleven_flash_v2_5 for real-time chatbots.
// ElevenLabs TTS streaming
async function textToSpeech(text: string, voiceId: string): Promise<ReadableStream> {
const response = await fetch(
`https://api.elevenlabs.io/v1/text-to-speech/${voiceId}/stream`,
{
method: 'POST',
headers: {
'xi-api-key': process.env.ELEVENLABS_API_KEY!,
'Content-Type': 'application/json',
},
body: JSON.stringify({
text,
model_id: 'eleven_v3',
voice_settings: { stability: 0.5, similarity_boost: 0.75 },
}),
}
);
return response.body!; // Stream audio chunks
}
// OpenAI Whisper transcription
import OpenAI from 'openai';
const openai = new OpenAI();
async function transcribeAudio(audioFile: File) {
const transcription = await openai.audio.transcriptions.create({
file: audioFile,
model: 'whisper-1',
response_format: 'verbose_json',
timestamp_granularities: ['word', 'segment'],
});
return transcription;
}
// Replicate video generation (async with webhook)
async function generateVideo(prompt: string) {
const prediction = await replicate.predictions.create({
model: 'minimax/video-01',
input: { prompt, duration: 5 },
webhook: `${process.env.APP_URL}/api/webhooks/replicate`,
webhook_events_filter: ['completed'],
});
return prediction.id; // Poll or wait for webhook
}
<a name="bahasa-indonesia"></a>
brainstorming dan zero-to-prod-orchestrator (Fase 5 - Pengembangan Fitur Utama & Generasi Media) untuk mengintegrasikan pipeline generatif multimodal.ai-llm-integration-expert — Rekayasa prompt, pemilihan model penalaran, dan rantai orkestrasi.file-upload-media-expert — Penyimpanan permanen (R2/S3), distribusi CDN, dan pipeline media.sse-websocket-streaming-expert — Streaming generasi gambar progresif dan pemutaran audio real-time.async-queue-temporal-expert — Eksekusi antrean background job untuk generasi video dan audio panjang.zero-trust-secret-vault — Rotasi kunci API aman dan brankas kredensial Replicate, OpenAI, dan ElevenLabs.session-memory-manager — Menyimpan metadata tugas generasi, riwayat prompt, dan referensi aset.Panduan tingkat produksi untuk mengintegrasikan generasi media berbasis AI ke dalam aplikasi web dan mobile modern. Mencakup generasi gambar (Flux 1.1 Pro, SDXL, DALL-E 3), generasi video (Sora, Runway Gen-3, MiniMax), text-to-speech (ElevenLabs v3, OpenAI TTS), speech-to-text (Whisper large-v3, Deepgram Nova-3), dan kloning audio. Dilengkapi pola pemrosesan asinkron via webhook, mitigasi biaya, serta penyaringan keamanan konten (NSFW/moderasi).
| Tipe Media | Provider & Model | Latensi | Kualitas Visual/Audio | Estimasi Biaya | Rekomendasi Penggunaan |
|---|---|---|---|---|---|
| Gambar | Replicate (Flux 1.1 Pro) | ~3 detik | ★★★★★ | $0.04 / gambar | Gambar fotorealistik & tipografi akurat |
| Gambar (Draft) | Replicate (Flux Schnell) | ~1 detik | ★★★★ | $0.003 / gambar | Pratinjau instan & volume tinggi |
| Gambar | OpenAI (DALL-E 3) | ~5 detik | ★★★★ | $0.04 / gambar | Ilustrasi kreatif & pemahaman prompt deskriptif |
| Suara (TTS) | ElevenLabs (eleven_v3) | ~500 ms | ★★★★★ | $0.30 / 1K karakter | Narasi audio buku & karakter ekspresif |
| Suara (Realtime) | ElevenLabs (eleven_flash_v2_5) | ~200 ms | ★★★★ | $0.15 / 1K karakter | Agen percakapan AI & voicebot interaktif |
| Transkripsi | OpenAI (Whisper large-v3) | Cepat | ★★★★★ | $0.006 / menit | Transkripsi rapat & subtitling multibahasa |
import Replicate from 'replicate';
const replicate = new Replicate({
auth: process.env.REPLICATE_API_TOKEN!,
});
interface ImageGenOptions {
width?: number;
height?: number;
mode?: 'production' | 'preview';
}
export async function hasilkanGambarAI(promptTeks: string, options: ImageGenOptions = {}) {
const isPreview = options.mode === 'preview';
const modelIdentifier = isPreview
? 'black-forest-labs/flux-schnell'
: 'black-forest-labs/flux-1.1-pro';
const output = await replicate.run(modelIdentifier, {
input: {
prompt: promptTeks,
width: options.width ?? 1024,
height: options.height ?? 1024,
num_inference_steps: isPreview ? 4 : 28,
output_format: 'webp',
output_quality: 90,
},
});
return output; // Mengembalikan URL langsung ke aset WebP yang dihasilkan
}
export async function streamSuaraTeks(teks: string, voiceId: string): Promise<ReadableStream<Uint8Array>> {
const response = await fetch(`https://api.elevenlabs.io/v1/text-to-speech/${voiceId}/stream`, {
method: 'POST',
headers: {
'xi-api-key': process.env.ELEVENLABS_API_KEY!,
'Content-Type': 'application/json',
},
body: JSON.stringify({
text: teks,
model_id: 'eleven_v3',
voice_settings: {
stability: 0.5,
similarity_boost: 0.8,
style: 0.2,
},
}),
});
if (!response.ok) {
throw new Error(`ElevenLabs API error: ${response.statusText}`);
}
return response.body as ReadableStream<Uint8Array>;
}
import OpenAI from 'openai';
import fs from 'fs';
const openai = new OpenAI({ apiKey: process.env.OPENAI_API_KEY });
export async function transkripsiAudio(fileBuffer: Buffer, namaFile: string) {
const file = await OpenAI.toFile(fileBuffer, namaFile);
const hasil = await openai.audio.transcriptions.create({
file,
model: 'whisper-1',
response_format: 'verbose_json',
timestamp_granularities: ['word', 'segment'],
});
return hasil;
}
BullMQ atau Inngest) untuk setiap operasi media yang memerlukan waktu komputasi >2 detik.아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
Expert guide for automated and manual Web Accessibility (a11y) testing — axe-core, Pa11y, Playwright a11y, screen reader testing, and WCAG 2.2 Level AA/AAA compliance / Panduan ahli pengujian aksesibilitas web.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for intelligent model cascading and routing — complexity-scored task routing from Fast (Composer 2.5, Grok 4.7/4.6) to Medium (Gemini 4 Argon, GPT-5.6 Sol, Claude Opus 5.5) and High (Claude Sonnet 5.5, Claude Fable 5.1, Muse Wonder) / Panduan ahli untuk kaskade dan routing model cerdas.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for intelligent model cascading and routing — complexity-scored task routing from Flash/Haiku to Sonnet/Opus/Astra, dynamic escalation with quality gates, 40-60% token cost reduction while maintaining output quality / Panduan ahli untuk kaskade dan routing model cerdas — routing tugas berbasis skor kompleksitas dari Flash/Haiku ke Sonnet/Opus/Astra, eskalasi dinamis dengan gerbang kualitas, pengurangan biaya token 40-60% dengan kualitas output terjaga.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Master guide for Affective Computing, emotional AI, and real-time sentiment analysis through native multimodal tokens (voice intonation and facial micro-expressions) / Panduan utama komputasi afektif, AI emosional, dan analisis sentimen real-time melalui token multimodal native.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for Affective Computing, emotional AI, and real-time sentiment analysis through native multimodal tokens (voice intonation and facial micro-expressions) / Panduan ahli komputasi afektif, AI emosional, dan analisis sentimen real-time melalui token multimodal native.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Expert guide for AI-assisted coding workflows — agentic code generation, multi-agent code swarms, self-healing CI/CD, automated PR review, spec-to-code pipelines, codebase knowledge graphs, and human-in-the-loop approval gates / Panduan ahli untuk workflow pengkodean berbasis AI — generasi kode agentic, code swarm multi-agen, CI/CD self-healing, review PR otomatis, pipeline spec-to-code, knowledge graph codebase, dan gate persetujuan human-in-the-loop.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.