imagegen-frontend-mobile

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

1|Updated Jan 10, 2024
One-click install
npx skills add https://github.com/noemdb/cfla --skill imagegen-frontend-mobile-noemdb
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: imagegen-frontend-mobile
Source: https://github.com/noemdb/cfla/tree/main/.agents/skills/imagegen-frontend-mobile
Command: npx skills add https://github.com/noemdb/cfla --skill imagegen-frontend-mobile-noemdb

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Designing mobile app concepts often produces generic, inconsistent mockups with unreadable text, weak navigation logic, and drifting design systems across screens. This Skill generates cohesive, app-native mobile screen images and multi-screen flow sets with controlled palettes, readable typography, and consistent device mockup framing. ## Core Features & Use Cases - Multi-Screen Flow Generation: Produces logically ordered screen sets such as onboarding, auth, home, detail, and checkout flows that feel like real product walkthroughs. - Platform-Aware Art Direction: Adapts output to iOS-native, Android-native, or cross-platform premium modes with correct safe-area and navigation patterns. - Design System Consistency: Locks an internal design bible covering palette, typography, iconography, texture, and device framing so every screen belongs to one product world. - Use Case: Ask for a five-screen fintech onboarding and home flow, and receive five consistent, readable phone-mockup images with a controlled palette and believable navigation progression. ## Quick Start Generate a five-screen iOS onboarding and home flow for a calm wellness app with a clean controlled color palette.

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?▼

Request the specific flow you need, such as onboarding to auth to home, and the skill generates each screen as a separate image. Screens follow a logical navigation order and share one consistent design system across the full set.

What types of mobile app screens can this skill generate?▼

It generates onboarding, auth, home dashboards, profile, settings, chat, ecommerce, fintech, health, fitness, productivity, and social app screens. It supports iOS-native, Android-native, and cross-platform premium visual modes.

Does this skill generate code like SwiftUI or React Native?▼

No, this skill generates images only. It does not write SwiftUI, React Native, Flutter, or HTML code, and it does not perform image-to-code conversion or frontend implementation.

Can I get raw screens without a phone mockup frame?▼

Yes, but the default output presents screens inside a clean iPhone or Android-style device mockup with even margins. You must explicitly request borderless or raw screen-only output to remove the device frame.

How does the skill keep multiple screens visually consistent?▼

It locks an internal design bible before generating the set, covering palette, typography, spacing, icon style, texture, and device framing. Every subsequent screen follows that same product system instead of drifting into a different design language.

Why do generated screens avoid small text and cluttered layouts?▼

The skill enforces strict readability and clarity rules, prioritizing comfortably readable titles, body copy, and labels over dense layouts. If content would shrink text too much, it simplifies the layout or splits content into additional screens.