Name: flutter-build-responsive-layout
Rating: 72 (1 reviews)
Author: flutter

flutter-build-responsive-layout

Use `LayoutBuilder`, `MediaQuery`, or `Expanded/Flexible` to create a layout that adapts to different screen sizes. Use when you need the UI to look good on both mobile and tablet/desktop form factors.

Quality

88%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Quality

Content

77%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

A well-structured, highly actionable skill with complete code examples and workflows that include validation feedback loops. Its main weaknesses are some redundant explanation of Flutter fundamentals and a lack of file-level progressive disclosure.

Suggestions

Trim explanations of Flutter basics Claude already knows — e.g., the Expanded/Flexible semantics bullet and the 'Constraints go down. Sizes go up.' rule — into leaner directive bullets to improve conciseness.

Now that the body exceeds ~130 lines, consider moving the two full code examples into a references/ file (e.g., EXAMPLES.md) and linking from the Examples section to add one-level-deep progressive disclosure.

Add the term 'responsive' to the description or section headings, since it is the most common phrasing users say when they need this skill.

Dimension	Reasoning	Score
Conciseness	Mostly efficient directive bullets, but it explains Flutter basics Claude already knows (Expanded vs Flexible semantics and the 'Constraints go down. Sizes go up. Parent sets position.' rule), so it could be tightened; not a 3 because of that unnecessary explanation, not a 1 because it is not padded with fluff.	2 / 3
Actionability	Two complete, executable Dart examples plus concrete APIs and breakpoint values (largeScreenMinWidth = 600, SliverGridDelegateWithMaxCrossAxisExtent, BoxConstraints(maxWidth:)) make it copy-paste ready; not a 2 because the code is real and complete rather than pseudocode.	3 / 3
Workflow Clarity	Both workflows are sequenced checklists with explicit validation and feedback steps ('Run validator -> resize the application window -> review layout transitions -> fix overflow errors'); not a 2 because validation checkpoints are explicit rather than implicit.	3 / 3
Progressive Disclosure	It is a well-organized single file with a TOC and clear sections, but all content is inline with no one-level-deep references, and at ~130 lines it exceeds the under-50-line simple-skill exception; not a 3 because there are no signaled external references, not a 1 because the structure is clean rather than a monolithic wall.	2 / 3
	Total	10 / 12 Passed

Description

100%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A concise, well-constructed description that states concrete widget-based actions and pairs them with an explicit 'Use when' trigger tied to form factors. It is distinctive within the Flutter skill space.

Dimension	Reasoning	Score
Specificity	The description names multiple specific concrete actions — 'Use `LayoutBuilder`, `MediaQuery`, or `Expanded/Flexible` to create a layout that adapts to different screen sizes' — rather than a vague domain label, matching the 'lists multiple specific concrete actions' anchor.	3 / 3
Completeness	The first clause answers what (build an adaptive layout with named widgets) and 'Use when you need the UI to look good on both mobile and tablet/desktop form factors' gives an explicit 'Use when' trigger for when, so both are clearly addressed.	3 / 3
Trigger Term Quality	It covers natural phrasings a user would say — 'adapts to different screen sizes', 'mobile and tablet/desktop form factors', 'UI to look good' — giving good keyword coverage; it is not a 2 because the coverage is broad even though 'responsive' itself is absent.	3 / 3
Distinctiveness Conflict Risk	The niche (Flutter adaptive/responsive layout via specific widgets) with distinct form-factor triggers is unlikely to overlap unrelated skills; not a 2 because the domain and triggers are specific rather than generic.	3 / 3
	Total	12 / 12 Passed

Validation

93%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
metadata_version	'metadata.version' is missing	Warning

	Total	15 / 16 Passed

Repository: flutter/agent-plugins
Path: skills/flutter-build-responsive-layout/SKILL.md
Commit: 8aaa41d

Reviewed: about 12 hours ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.