Inspect a live website for issues such as contrast, tap target size, phone layout, enlarged text, broken images, page weight, and template-like appearance. Get a concise plain-language report of the main findings with annotated screenshots for review or redesign discussions.
- Checking a public website’s mobile layout
- Finding contrast and tap target issues
- Preparing evidence for a redesign discussion
feimacode/open-design-agent-kit☆ 1KUpdated Nov 5, 2026
Turn reports, spreadsheets, PDFs, existing presentations, or repository files into a slide deck or one-page brief. It starts with a storyline and keeps facts and numbers traceable to their sources, so readers can check where the content came from.
- Create a release deck from a CHANGELOG
- Turn a spreadsheet into a board update
- Make an architecture review from ADRs
feimacode/open-design-agent-kit☆ 1KUpdated Nov 5, 2026
Get a second opinion on an Open Design artifact using its latest check screenshots, brief, and design system. Receive one verdict—ship, polish, or rework—and up to five specific fixes to guide the next design pass.
- Review an Open Design artifact before calling it done
- Get a second opinion on a landing page design
- Find a few concrete fixes for a design
feimacode/open-design-agent-kit☆ 1KUpdated Nov 5, 2026
Create a website-based design system by measuring its colors, fonts, spacing, and button states. Produce matching DESIGN.md and tokens.css files, then compare a sample against the site before saving.
- Extracting colors and typography from a website
- Creating a theme from a reference URL
- Documenting a brand’s visual style
feimacode/open-design-agent-kit☆ 1KUpdated Nov 5, 2026
Create visual designs such as landing pages, pitch decks, prototypes, dashboards, and components using bundled design templates and style systems. The supplied material describes a workflow for preparing, authoring, registering, and checking designs.
- Designing a landing page or marketing page
- Creating a pitch deck or presentation
- Mocking up a dashboard or prototype
feimacode/open-design-agent-kit☆ 1KUpdated Nov 5, 2026
Audit an existing website and create a linked redesign concept for its home page and up to three inner pages. It uses the site's real content and brand, addresses identified problems, and keeps the work marked as a concept until the owner agrees.
- Refresh an outdated business website
- Show a bakery a redesigned site concept
- Prepare a website redesign pitch
feimacode/open-design-agent-kit☆ 997Updated Nov 4, 2026
Create an app screen for one record, such as a support ticket or customer. Show its status, key details, relevant records, and a newest-first activity timeline, with clear states for missing records or denied access.
- Designing a customer or order detail screen
- Showing a support ticket's status and conversation
- Organizing related records and recent activity
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design an app form for creating or editing a record, collecting sign-up details, or completing checkout. Plan field labels and grouping, validation messages, preserved input after errors, a saving state, and a clear next step after success.
- Designing a record creation or edit form
- Collecting sign-up details clearly
- Planning checkout fields and validation
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design a connected AI chat flow from suggested prompts to a streaming reply, retryable errors, and an actionable result card. It helps create the key screens and transitions users encounter while talking with an assistant.
- Designing an assistant’s first chat screen
- Showing a reply as it streams in
- Planning a retry after a chat error
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design a record list screen with search, filters, sorting, selection, bulk actions, and pagination. It also covers empty, loading, and no-results states so people can find a record, act on several, or open one.
- Building a searchable customer or order list
- Adding filters and sorting to an admin table
- Designing bulk actions for selected records
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design a connected authentication flow for signing in, creating an account, resetting a password, and verifying by magic link or one-time code. It includes linked screens, wrong or expired code errors, and a welcome destination at the end.
- Mapping sign-in and account creation screens
- Adding password reset and email verification
- Designing one-time code error states
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Create a connected settings area with home, profile, notification preferences, subscription management, and account deletion. The screens include deletion confirmation and success, with links between each step and a route back to settings.
- Designing an app’s account settings area
- Connecting profile and notification screens
- Showing subscription details and cancellation options
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design a connected first-run experience that guides people from a welcome screen through goal selection and a permission request to the home screen. It can also include an optional paywall, with a clear way to continue for free.
- Designing first-run onboarding for a new app
- Letting users choose goals before shaping their home screen
- Explaining a permission request before the system prompt
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design an in-app search screen with a query field, filters, grouped results, highlighted matching terms, and recent searches. Include useful loading and no-results states so people can understand what happened and what to try next.
- Building search across articles, people, or files
- Adding filters and grouped results to an app
- Showing recent searches before a query is entered
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Create an app settings screen covering the sections a product needs, such as profile, notifications, security, billing, and integrations. Include clear controls, saved and error states, and a confirmation flow for account or workspace deletion.
- Organizing profile and notification preferences
- Designing a security settings page
- Showing a failed save with values preserved
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design a connected subscription flow covering plan selection, trial terms, upgrades, purchase restoration, success, and a win-back offer after cancellation. It includes billing details and store-required links, with clear ways to close or decline.
- Creating monthly and yearly plan screens
- Explaining trial conversion and billing terms
- Adding restore purchases and policy links
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Design the reusable frame for a web or mobile app, including its navigation, account menu, and initial work area. Choose a sidebar, top bar, tab bar, or icon rail to fit the platform, and establish navigation that later screens can share.
- Planning shared navigation for a new app
- Choosing a sidebar, top bar, or tab bar layout
- Designing an account menu and first-use empty state
feimacode/open-design-agent-kit☆ 997Updated Nov 3, 2026
Turn content into a Xiaohongshu-style series of knowledge cards, with a cover, one key point per card, and a closing summary. Large text, soft colors, and a screenshot-friendly layout support preparing image posts.
- Turning practical tips into a series of knowledge cards
- Preparing a carousel post for Xiaohongshu
- Creating image posts for WeChat Moments
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Creates quote or data cards to accompany Twitter or X posts. The wide layout combines a prominent short statement with author details, a category label, and a brand watermark, ready to capture as an image.
- Turning a short quote into a post image
- Creating a card to share data
- Sharing an insight with author details
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Map a mobile app journey across three or four phone frames in one HTML board. Simple gray content blocks, dashed arrows, numbered actions, and short annotations show how users move between screens before detailed visual design.
- Mapping onboarding through the home screen
- Reviewing the path from item details to confirmation
- Discussing screen transitions before visual design
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Create full-screen animated visuals with WebGL, a browser technology for GPU rendering. Combine shaders, 3D scenes, or particles with a text overlay, and deliver the result as one self-contained HTML file without external requests.
- Create a website hero animation
- Build generative art with a headline
- Prototype a 3D scene or particle field
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Create a desktop landing page wireframe, a simple layout made of grey boxes, with numbered markers and a matching specification panel. The result shows page structure alongside short implementation and user experience notes.
- Planning a desktop landing page layout
- Sharing implementation notes with developers
- Reviewing navigation, hero, and feature placement
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Research recent X/Twitter reactions to markets, companies, products, or communities. Produce a reusable Markdown briefing that groups supportive, critical, and neutral views, with citations, coverage details, and an assessment of overall sentiment.
- Checking reactions to a product on X/Twitter
- Comparing positive and negative views of a company or stock
- Reviewing social reactions to a market event
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026
Generates short, single-shot videos for product reveals, teasers, and ambient loops. Plans the subject, movement, and lighting, then saves an MP4 in the project folder using the selected model, duration, and aspect ratio.
- Creating a short product reveal video
- Generating a motion teaser
- Making an ambient background loop
feimacode/open-design-agent-kit☆ 997Updated Oct 31, 2026