skills.rest
AniTrend
AniTrendOFFICIAL
Explore all skills by this author →
Website𝕏@anitrend_appGitHub

product-designer

Produce repository-grounded implementation plans for AniTrend Compose UI redesigns.

51|6|Updated Mar 10, 2019
Search Tags:#android#material3#compose ui#ux planning#state handling#preview strategy
One-click install
npx skills add https://github.com/AniTrend/anitrend-v2 --skill product-designer-anitrend
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: product-designer
Source: https://github.com/AniTrend/anitrend-v2/tree/main/.agents/skills/product-designer
Command: npx skills add https://github.com/AniTrend/anitrend-v2 --skill product-designer-anitrend

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It solves the risk of ambiguous, over-scoped UI changes by guiding the creation of a realistic, repository-grounded implementation plan for AniTrend Compose screens and interaction-heavy surfaces.

Core Features & Use Cases

  • Scoped Compose screen planning: Breaks UI work into small, incremental slices that engineers can implement safely in iterative PRs.
  • Hierarchy-first interaction design: Defines component boundaries, control choices, and state presentation (loading/empty/error/populated/partial) without vague redesign language.
  • Preview-first quality assurance: Requires a preview validation matrix using AniTrend preview providers and theme wrappers to catch layout, density, and accessibility issues before runtime.

Quick Start

Ask for a plan to redesign a specific AniTrend Compose screen section and include the current UX goal, key constraints, and what should explicitly not change.

Frequently Asked Questions about product-designer

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

FAQPage Schema
How do I plan a Jetpack Compose screen redesign without over-scoping the engineering work?▼

To plan a Compose screen redesign safely, break UI work into small, incremental slices that engineers can implement iteratively. Define component boundaries and state presentation explicitly to avoid ambiguous redesign language.

What's the best way to handle all UI states when refactoring a Material3 hierarchy in Compose?▼

Handling UI states in a Material3 refactor requires explicit decomposition of loading, empty, error, populated, and partial states. Define component boundaries and control choices clearly to ensure all interaction models are scoped correctly.

How do I validate Compose UI layout and accessibility issues before runtime?▼

Validate Compose UI layout and accessibility before runtime by using a preview validation matrix. This matrix leverages existing preview providers and theme wrappers to catch density issues and layout regressions early.

Can I use ASCII hierarchy mocks for planning Android Compose interaction-heavy screens?▼

Yes, ASCII hierarchy mocks are required when UI changes occur in Compose interaction-heavy screens. They provide a clear, repository-grounded visual structure that helps scope incremental PRs and define component boundaries.

Does product-designer work with existing AniTrend preview variants for state handling validation?▼

Yes, the product-designer approach works with existing AniTrend preview variants by requiring a preview validation matrix. This ensures state handling and theme wrapper coverage catches layout and density issues before runtime.

Related Skills

Explore More Design & Creative Skills→
inehemiasminehemiasm

jetpack-compose-m3

Guide Wear OS Compose Material3 migration and development with Jetpack Compose components.

Community
Advanced
Envy-7zEnvy-7z

mobile-ui-slicing-playbook

Break mobile UI development into verifiable slices across Android Compose, Android XML, and Flutter.

Community
Intermediate
duylinhdang1998duylinhdang1998

jetpack-compose

Build declarative Android UIs with Jetpack Compose and Material3.

Community
Intermediate
ShaheerKhawajaShaheerKhawaja
8

productionos-designer-upgrade

Audit web application interfaces and generate design systems, mockups, and implementation plans.

Community
Advanced