imagegen-frontend-mobile

Generates premium mobile app screen and flow images for iOS, Android, and cross-platform concepts.

Updated Mar 4, 2026
One-click install
npx skills add https://github.com/gmolike/Claude-Template --skill imagegen-frontend-mobile-gmolike
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: imagegen-frontend-mobile
Source: https://github.com/gmolike/Claude-Template/tree/main/.agents/skills/imagegen-frontend-mobile
Command: npx skills add https://github.com/gmolike/Claude-Template --skill imagegen-frontend-mobile-gmolike

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Designing consistent, high-quality mobile app screen concepts is slow and generic AI image output often produces unreadable text, inconsistent design systems, and template-like results. This Skill provides a disciplined art-direction framework for generating premium, app-native mobile screen images and multi-screen flows. ## Core Features & Use Cases - Multi-Screen Flow Generation: Produces logically ordered screen sets (onboarding, auth, home, checkout) with a locked design bible ensuring palette, typography, and component consistency across every image. - Platform-Aware Art Direction: Adapts output to iOS-native, Android-native, or cross-platform premium modes with correct safe-area, navigation, and device mockup conventions. - Readability and Consistency Discipline: Enforces minimum text sizes, controlled color palettes, clean device framing, and anti-generic rules that avoid common AI design clichés. - Use Case: Ask for a 5-screen onboarding flow for a wellness app and receive five coherent, readable phone-mockup images that share one design system and form a believable user journey. ## Quick Start Generate a premium iOS onboarding flow with four screens for a habit-tracking app, shown in clean iPhone mockups.

Frequently Asked Questions about imagegen-frontend-mobile

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a multi-screen mobile app flow with AI images?

Request the specific screens you need, such as onboarding, sign in, and home, and the skill generates each as a separate image. It locks a design bible covering palette, typography, and components so all screens belong to one product system.

What tool creates consistent app screen mockups across multiple images?

This image-generation skill enforces multi-screen consistency through a fixed design bible covering device frame style, color palette, type scale, icon style, and component family. Every generated screen shares the same product identity.

Does it support both iOS and Android design styles?

Yes, it selects one platform mode per concept: iOS-native premium, Android-native premium, or cross-platform neutral. It applies appropriate safe-area handling, navigation patterns, and device mockups without mixing platform conventions.

Can it generate code from the app screen designs?

No, this skill generates images only and explicitly does not produce SwiftUI, React Native, Flutter, or HTML code. It is purely an art-direction and image-generation tool for visual concepts.

Why do AI-generated app screens often have unreadable small text?

Generic generators compress too much content into one screen. This skill enforces minimum text size discipline, splitting content into additional screens or regenerating when text becomes too small to read comfortably.

When should I not use this mobile image generation skill?

Avoid it for websites, landing pages, desktop dashboards, or any image-to-code workflow. It is scoped strictly to mobile app screen and flow imagery, not web design or frontend implementation.