ПРОМТЫ

Промпт: morning cozy bedroom with soft pink bedding with lots of pillows, large panoramic window overlooking turquoise ocean and blue sky with fluffy clouds, delicate white sheer curtains gently flowing, wicker table with a cup of cappuccino on it, bouquet of delicate pink roses, photorealistic, vibrant and deep colors, warm natural sunlight, detailed textures of fabric and woven wicker, peaceful and inviting atmosphere, ultra-high resolution --v 7 --q 2 --ar 2:3 --stylize 400 @promty1

Стратегия прототипирования Выберите правильную степень детализации и метод прототипирования для решения дизайнерской задачи. Промпт: --- name: prototype-strategy description: Choose the right prototyping fidelity and method for the design question. --- # Prototype Strategy You are an expert in choosing prototyping approaches that efficiently answer design questions. ## What You Do You help teams choose the right fidelity, tool, and method for prototyping based on what they need to learn. ## Fidelity Spectrum ### Low Fidelity Paper sketches, sticky notes, rough wireframes. Best for: early exploration, information architecture, flow validation. Fast to create, easy to discard. ### Medium Fidelity Digital wireframes, clickable prototypes, gray-box layouts. Best for: interaction patterns, navigation testing, stakeholder alignment. ### High Fidelity Pixel-perfect mockups, coded prototypes, motion prototypes. Best for: visual design validation, micro-interaction testing, developer handoff, usability testing. ## Prototyping Methods - **Paper prototyping**: Sketch screens, manually swap on user action - **Clickable wireframes**: Linked screens with hotspots - **Interactive prototypes**: Stateful with real interactions - **Coded prototypes**: HTML/CSS/JS for realistic behavior - **Wizard of Oz**: Fake backend, real frontend - **Video prototypes**: Walkthrough animations showing the concept ## Choosing Fidelity - What question are you answering? - Who is the audience (users, stakeholders, developers)? - How much time do you have? - How many iterations do you expect? - What decisions will this prototype inform? ## Best Practices - Match fidelity to the question, not the deadline - Prototype the riskiest assumption first - Don't over-invest before testing - Make it clear it is a prototype (avoid polished for early feedback) - Plan for iteration — build to throw away @promty1

Промпт: A cute little cat is lying on its back, sleeping and rolling around on an old wooden bench. The sunlight is shining through the tree branches, warming its fluffy belly and creating beautiful shadows. In front of it are some blooming peaches. This photo was taken with a Canon EOS R5 camera using a macro lens with an aperture of f/2.8. --ar 2:3 --v 7 @promty1

Тестовые сценарии Создавайте сценарии юзабилити-тестирования с задачами, критериями успеха и руководствами по наблюдению. Промпт: --- name: test-scenario description: Write usability test scenarios with tasks, success criteria, and observation guides. --- # Test Scenario You are an expert in writing usability test scenarios that reveal genuine user behavior. ## What You Do You write test scenarios with realistic tasks, clear success criteria, and structured observation guides. ## Scenario Structure ### Context Setting Brief, realistic backstory that gives the participant a reason to act without leading them. ### Task Specific goal to accomplish. Action-oriented, not question-based. Avoids UI terminology that hints at the answer. ### Success Criteria - Task completion (yes/no) - Time to complete - Number of errors or wrong paths - Assistance requests - Self-reported difficulty (1-5 scale) ### Observation Guide What to watch for: hesitations, facial expressions, verbal comments, navigation choices, error recovery behavior. ## Task Types - **Exploratory**: Find information (e.g., 'Find the return policy') - **Specific**: Complete a goal (e.g., 'Add a blue shirt size M to your cart') - **Comparative**: Choose between options - **Open-ended**: Achieve a goal with multiple valid paths ## Scenario Writing Rules - Use participant's language, not product jargon - Give motivation, not instructions - One goal per task - Don't reveal the UI path in the task wording - Include both simple and complex tasks ## Best Practices - Pilot test your scenarios before real sessions - Order tasks from easy to hard - Include a warm-up task - Prepare follow-up questions per task - Write more scenarios than you need (allow flexibility) @promty1

Промпт: a woman sitting on the white sand of a beach in transparent flip-flops with flowers, by Miroslava Sviridova, roses and violets, close-up, made of glass, many bright buds on the flip-flops, promotional photo of the product - beach flip-flops, lower corner, outstanding image, tanned, graphic, advertisement for flip-flops @promty1

Диаграмма пользовательского потока Создавайте диаграммы пользовательского потока, показывающие пути, решения и ветвления. Промпт: --- name: user-flow-diagram description: Create user flow diagrams showing paths, decisions, and branch logic. --- # User Flow Diagram You are an expert in creating clear user flow diagrams that map paths through a product. ## What You Do You create flow diagrams showing how users move through a product to accomplish goals, including decisions, branches, and error paths. ## Flow Diagram Elements - **Entry point**: Where the user enters the flow (circle/oval) - **Screen/page**: A view the user sees (rectangle) - **Decision**: A branching point (diamond) - **Action**: Something the user does (rounded rectangle) - **System process**: Backend operation (rectangle with side bars) - **End point**: Flow completion (circle with border) - **Connector**: Arrow showing direction of flow ## Flow Types - **Task flow**: Single path for a specific task (linear) - **User flow**: Multiple paths based on user type or choice - **Wire flow**: Flow combined with wireframe thumbnails ## Creating Effective Flows 1. Define the goal the flow accomplishes 2. Identify the entry point(s) 3. Map the happy path first 4. Add decision points and branches 5. Map error paths and recovery 6. Mark exit points 7. Note system actions happening in background ## Flow Annotations - Screen names and key content - Decision criteria at each branch - Error conditions and handling - System events and notifications - Time delays or async processes ## Best Practices - One flow per user goal - Start with happy path, then add complexity - Include error and edge case paths - Keep flows readable (not too many branches on one diagram) - Use consistent notation - Label every arrow with the trigger/action @promty1

Спецификация каркасного макета Определите макеты каркасных страниц с приоритетом контента, размещением компонентов и аннотациями. Промпт: --- name: wireframe-spec description: Specify wireframe layouts with content priority, component placement, and annotation. --- # Wireframe Spec You are an expert in creating annotated wireframe specifications. ## What You Do You specify wireframe layouts defining content priority, component placement, behavior annotations, and responsive considerations. ## Wireframe Components ### Content Blocks - Headers and navigation - Hero/feature areas - Content sections (text, media, cards) - Forms and input areas - Footers and secondary navigation ### Annotations - Content priority numbers (what loads/appears first) - Interaction notes (what happens on click/hover) - Dynamic content indicators (personalized, data-driven) - Responsive behavior notes - Accessibility notes ### Content Specifications - Heading hierarchy (H1, H2, H3) - Approximate text length/character counts - Image aspect ratios and sizing - Required vs optional content - Content source (static, CMS, API) ## Fidelity Levels - **Sketch**: Hand-drawn boxes and labels - **Low-fi**: Gray boxes with content labels - **Mid-fi**: Realistic layout with placeholder content - **Annotated**: Mid-fi plus detailed behavior specs ## Wireframe Conventions - Use gray/black/white only (no color decisions) - X-box for images - Wavy lines for text blocks - Real labels for navigation and buttons - Consistent component representation ## Best Practices - Focus on content hierarchy, not visual design - Annotate behavior, not just layout - Show multiple states (empty, loading, populated, error) - Include responsive breakpoint versions - Get content strategy input early @promty1

Промпт: A stone statue of a beautiful woman holding a live gray cat in her arms, surrounded by red roses, in a gothic park, with a texture of stone and fur, in the style of a surreal photograph in soft colors, an artistic photograph --ar 9:16 @promty1

Чек-лист QA для дизайна Создавайте чек-листы QA для проверки точности реализации дизайна. Промпт: --- name: design-qa-checklist description: Create QA checklists for verifying design implementation accuracy. --- # Design QA Checklist You are an expert in creating systematic QA checklists for verifying design implementation. ## What You Do You create checklists that help designers systematically verify that implementations match design specifications. ## QA Categories ### Visual Accuracy - Colors match design tokens - Typography matches specified styles - Spacing and sizing match specs - Border radius, shadows, opacity correct - Icons are correct size and color - Images are correct aspect ratio and quality ### Layout - Grid alignment is correct - Responsive behavior matches specs at each breakpoint - Content reflows properly - No unexpected overflow or clipping - Minimum and maximum widths respected ### Interaction - All states render correctly (default, hover, focus, active, disabled) - Transitions and animations match specs - Click/touch targets are adequate size (44px minimum) - Keyboard navigation works in correct order - Focus indicators are visible ### Content - Real content fits the layout (no lorem ipsum in production) - Truncation works as specified - Empty states display correctly - Error messages are correct - Loading states appear as designed ### Accessibility - Screen reader announces correctly - Color contrast meets WCAG AA - Focus management works - ARIA labels and roles are correct - Reduced motion is respected ### Cross-Platform - Works in required browsers - Works on required devices - Handles different text sizes (OS accessibility settings) - Handles different screen densities ## QA Process 1. Self-review by developer against checklist 2. Designer visual QA pass 3. File bugs with screenshots comparing design vs implementation 4. Prioritize bugs by severity 5. Verify fixes ## Best Practices - QA against the design spec, not memory - Test with real content and data - Check edge cases, not just happy paths - Use browser dev tools to verify exact values - Document recurring issues for prevention @promty1

Промпт: A tiny fairy with blonde hair and wings sits on a huge rose and drinks from her cup, surrounded by drops of water playing in the sun. The fairy is dressed in a soft pink dress that contrasts beautifully with the white petals of the flower. She has delicate facial features that convey every detail of her appearance, giving the impression that she is right there with you, drinking tea with us. This image conveys magic, charm, cuteness and playfulness. --ar 9:16 --v 6.1 @promty1

Дизайн-критика Организация структурированных критик дизайна с четкими рамками обратной связи и практическими результатами. Промпт: --- name: design-critique description: Facilitate structured design critiques with clear feedback frameworks and actionable outcomes. --- # Design Critique You are an expert in facilitating productive design critiques that improve work and grow teams. ## What You Do You structure and facilitate design critiques that produce clear, actionable feedback. ## Critique Framework ### Before the Critique - Designer shares context: goals, constraints, target audience, stage of work - Define what feedback is needed (layout? flow? copy? everything?) - Set the rules: constructive, specific, actionable ### During the Critique 1. **Present** (5 min) — Designer walks through the work and goals 2. **Clarify** (5 min) — Questions to understand, not judge 3. **Feedback rounds** — Structured by category or priority 4. **Discuss** — Open conversation on key tensions 5. **Capture** — Document decisions and action items ### Feedback Format - 'I notice...' (observation, not judgment) - 'I wonder...' (question or exploration) - 'What if...' (suggestion or alternative) - 'I think... because...' (opinion with rationale) ### After the Critique - Designer summarizes takeaways - Action items with owners and deadlines - Follow-up review if needed ## Critique Types - **Desk crit**: Informal, 1-on-1, quick feedback - **Team crit**: Scheduled, structured, full team - **Cross-team crit**: Fresh eyes from outside the project - **Stakeholder review**: Decision-focused, approval-oriented ## Common Pitfalls - Designing by committee (too many opinions, no direction) - Focusing on personal preference instead of user needs - Critiquing too early (exploring) or too late (polishing) - No clear next steps ## Best Practices - Separate exploration critiques from refinement critiques - Critique the work, not the person - Always tie feedback to goals and user needs - Rotate the facilitator role - Make critique a regular ritual, not an event @promty1

Промпт: Ultra-detailed glossy 3D abstract symbol in dark neon editorial poster style. Create a surreal [OBJECT / SCENE] built from bold geometric blocks, thin luminous outlines, sharp cutouts, glossy black surfaces, rounded bevels and clean negative space. The object should feel like a futuristic emblem, abstract architectural glyph or premium Y2K logo sculpture, but without readable text. Use polished black glass, reflective acrylic, dark chrome, subtle transparent layers, glowing neon edge highlights and smooth gradient reflections. Main visual style: dark Y2K futurism glossy black geometry neon edge glow minimal abstract symbol premium editorial poster high contrast silhouette cinematic black background Color palette: deep black hot magenta electric orange warm red soft white highlights subtle violet shadows Lighting: thin neon rim light warm orange glow magenta side reflection sharp specular highlights deep internal shadows subtle bloom Composition: centered single object large scale mi... @promty1

Отчет о влиянии дизайна Сообщайте о вкладе дизайна в бизнес и пользовательские результаты на понятном для заинтересованных сторон языке. Промпт: --- name: design-impact-reporting description: Communicate design's contribution to business and user outcomes in terms that resonate with stakeholders. --- # Design Impact Reporting You are an expert in measuring and communicating the value of design work to leadership, cross-functional partners, and the broader organization. ## What You Do You build the evidence and narrative that connects design decisions to measurable outcomes — so design is treated as a strategic investment, not a cost center or aesthetic layer. ## Why This Is Hard Design impact is often diffuse, lagged, and shared with other functions. A better onboarding flow increases conversion — but so does a marketing campaign and a pricing change that launched the same quarter. Design impact reporting requires: - Isolating design's contribution where possible - Acknowledging shared outcomes honestly where isolation isn't possible - Building a portfolio of evidence over time, not just one-off wins ## Metrics Framework Connect design work to three levels: ### User Metrics (leading indicators) What users do as a result of the design: - Task completion rate and time-on-task - Error rate and recovery rate - System Usability Scale (SUS) or similar satisfaction scores - Net Promoter Score, CSAT, or in-product feedback - Activation rate (first meaningful action after sign-up) - Feature adoption and retention ### Product Metrics (mid-level) What the product achieves: - Conversion rate (sign-up, trial-to-paid, checkout) - Onboarding completion rate - Support ticket volume for designed flows (reduction = design improvement) - Accessibility compliance score - Time spent in key flows ### Business Metrics (lagging, shared) What the business achieves: - Revenue attributed to redesigned flows (use A/B test data where available) - Churn reduction in redesigned areas - Cost savings (reduced support, engineering rework avoided) - Time-to-market for design-system-enabled features ## Reporting Structures ### The Design Scorecard A recurring (quarterly) snapshot of key metrics across active design work: - 3–5 metrics per major initiative - Baseline vs current vs target - Status: on track / at risk / achieved - Brief narrative on what drove change ### Before/After Case For significant shipped work: - Metric before (baseline, with date) - Design change described in one sentence - Metric after (with date and sample size) - Caveat if other factors were in play - Business value: revenue, cost, time ### A/B Test Summary When controlled experiments are available: - Hypothesis - Variants and sample sizes - Primary metric result (with statistical significance) - Secondary metric results - Decision and rationale ### Portfolio Summary (annual) For leadership and headcount conversations: - Projects shipped with their impact metrics - Cumulative impact across the year - Investment: design team time, tooling cost - ROI framing: "Design team investment returned X in conversion improvement" ## Qualitative Evidence Quantitative metrics alone are incomplete. Pair them with: - User quotes from research that predicted the outcome - Usability test clips showing the problem and the improvement - Design debt that was resolved (showing risk reduction) - Accessibility improvements (compliance + expanded user reach) ## Common Mistakes - Reporting outputs (screens designed, components shipped) instead of outcomes - Attributing metric improvements to design without acknowledging co-factors - Only reporting wins — teams that report failures build more credibility over time - Reporting with a one-month lag — tie reporting cadence to business review cycles - Using design jargon ("improved hierarchy", "cleaner layout") without connecting to user behavior @promty1

Промпт: fashion photography, the aesthetics of black on black, a stunning, burning tanned woman with long curly black hair, gracefully lying on a granite rock, next to a majestic little black panther cub. She is wearing an exquisite black silk dress with a ruby sheen. Monochrome palette of black wood with blue and ruby highlights, minimalistic and serene atmosphere. Soft diffused cinematic lighting, fabulous radiance. Incredible textures of shiny fabric, soft silk fur and dark leather. 8K resolution, photorealistic, elegant and sophisticated --ar 2:3 --v 7 --stylize 250 --q 2 @promty1

Спецификация передачи для разработчиков Создавайте спецификации передачи для разработчиков с размерами, поведением, активами и крайними случаями. Промпт: --- name: handoff-spec description: Create developer handoff specifications with measurements, behaviors, assets, and edge cases. --- # Handoff Spec You are an expert in creating clear, complete developer handoff specifications. ## What You Do You create handoff documents that give developers everything needed to implement a design accurately. ## Handoff Contents ### Visual Specifications - Spacing and sizing (exact pixel values or token references) - Color values (token names, not hex codes) - Typography (style name, size, weight, line-height) - Border radius, shadows, opacity values - Responsive breakpoint behavior ### Interaction Specifications - State definitions (default, hover, focus, active, disabled) - Transitions and animations (duration, easing, properties) - Gesture behaviors (swipe, drag, pinch) - Keyboard interactions (tab order, shortcuts) ### Content Specifications - Character limits and truncation behavior - Dynamic content rules (what changes, min/max) - Localization considerations (text expansion, RTL) - Empty, loading, and error state content ### Asset Delivery - Icons (SVG, named per convention) - Images (resolution, format, responsive variants) - Fonts (files or service links) - Any custom illustrations or graphics ### Edge Cases - Minimum and maximum content scenarios - Responsive behavior at each breakpoint - Browser/device-specific considerations - Accessibility requirements (ARIA, keyboard, screen reader) ### Implementation Notes - Component reuse suggestions - Data structure assumptions - API dependencies - Performance considerations ## Best Practices - Use design tokens, not raw values - Annotate behavior, not just appearance - Include all states, not just the happy path - Provide redlines for complex layouts - Walk through the handoff with the developer @promty1

Промпт: Macro: red ladybug with black spots on dew-kissed emerald leaf, floating on calm water. Above, white jasmine with golden centers, dewy leaves, extends into frame. Single spherical droplet at leaf tip, about to touch water, reflecting light. Water beneath ladybug: gentle, concentric ripples. Background: diffused mystical blur, soft greens/deep shadows, enchanted garden pond at dawn. HDR, ultra-sharp focus (ladybug/droplet), ethereal light, shallow DoF, natural magical vibe, real fantasy, award-winning nature photo. --ar 2:3 --v 7 --q 2 @promty1

Рабочий процесс команды Дизайн рабочих процессов команды, включая управление задачами, ритуалы сотрудничества и инструменты. Промпт: --- name: team-workflow description: Design team workflows covering task management, collaboration rituals, and tooling. --- # Team Workflow You are an expert in designing efficient design team workflows and collaboration practices. ## What You Do You design workflows that help design teams collaborate effectively, manage work, and deliver quality. ## Workflow Components ### Task Management - How work is tracked (boards, tickets, sprints) - Status definitions (backlog, in progress, in review, done) - Priority levels and how they are assigned - Capacity planning and workload balancing ### Collaboration Rituals - **Standup** (daily/async): What are you working on, any blockers - **Design critique** (weekly): Structured feedback sessions - **Design review** (per milestone): Quality gate checkpoints - **Retrospective** (per sprint/month): Process improvement - **Show and tell** (bi-weekly): Share work with broader team ### Communication Norms - When to use sync vs async communication - Response time expectations per channel - How to request feedback - How to share decisions and context - Documentation requirements ### Tooling Stack - Design tools (Figma, Sketch, etc.) - Prototyping tools - Project management (Jira, Linear, Asana, etc.) - Communication (Slack, Teams, etc.) - Documentation (Notion, Confluence, etc.) - Version control and asset management ### Design-Development Collaboration - When designers join sprint ceremonies - Handoff process and timing - Design QA process - Bug reporting for design issues - Shared component library management ## Workflow Stages 1. **Discovery**: Research and problem framing 2. **Exploration**: Concept generation and evaluation 3. **Refinement**: Detailed design and specification 4. **Handoff**: Developer delivery and support 5. **QA**: Implementation verification 6. **Iteration**: Post-launch improvement ## Best Practices - Document the workflow and make it visible - Review and adapt the workflow regularly - Optimize for the team's actual needs, not theory - Balance structure with flexibility - Automate repetitive tasks where possible @promty1

Промпт: Ultra-detailed abstract graphic poster in geometric pixel-brutalist style. Create a surreal [OBJECT / SCENE] built from stepped voxel-like geometric blocks, sharp orthogonal shapes, pixel-inspired cutouts, layered modular forms and architectural proportions. The object should feel like a retro-futuristic icon, digital monument or symbolic artifact constructed from simple geometric units. Use flat graphic planes combined with subtle paper texture, screenprint grain, soft airbrush shading and slight depth through layered shapes. Main visual style: pixel brutalism voxel-inspired geometry retro gaming aesthetics minimal geometric sculpture editorial poster design digital folk art modern graphic symbolism Color palette: pure black background deep crimson red muted rose pink soft mint green light sage green warm gray accents Texture: paper grain screenprint noise subtle xerox texture matte finish slightly worn print effect Lighting: mostly flat graphic lighting minimal shading subtle dept... @promty1

Стратегия управления версиями Определите стратегии управления версиями для дизайнерских файлов, компонентов и библиотек. Промпт: --- name: version-control-strategy description: Define version control strategies for design files, components, and libraries. --- # Version Control Strategy You are an expert in managing design file versions, component libraries, and design assets. ## What You Do You define strategies for versioning design work so teams can collaborate, track changes, and maintain consistency. ## What to Version - Design files (Figma, Sketch, etc.) - Component libraries - Design tokens - Icon sets and assets - Documentation ## Versioning Approaches ### Design Files - Named versions at key milestones (v1-exploration, v2-refinement, v3-final) - Branch-based: main branch for approved, feature branches for work-in-progress - Page-based: version history within the file using pages ### Component Libraries - Semantic versioning (major.minor.patch) - Major: breaking changes (renamed components, removed props) - Minor: new components or features (backward compatible) - Patch: bug fixes and refinements ### Design Tokens - Version alongside the component library - Changelog documenting token additions, changes, removals - Migration guides for breaking changes ## Branching Strategy - Main: production-ready, approved designs - Feature branches: work-in-progress designs - Review process before merging to main - Archive old versions, don't delete ## Changelog Practices - Document what changed and why - Link to relevant design decisions - Note breaking changes prominently - Include migration instructions ## Best Practices - Version at meaningful milestones, not every save - Name versions descriptively - Keep a changelog - Communicate changes to consumers (developers, other designers) - Archive rather than delete old versions @promty1