redesign-existing-projects

Audit UI design patterns and apply targeted upgrades to existing websites and apps.

1|Updated Apr 27, 2026
One-click install
npx skills add https://github.com/dwaynimay/IoTProject --skill redesign-existing-projects-dwaynimay
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: redesign-existing-projects
Source: https://github.com/dwaynimay/IoTProject/tree/main/.agents/skills/redesign-existing-projects
Command: npx skills add https://github.com/dwaynimay/IoTProject --skill redesign-existing-projects-dwaynimay

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams improve the visual quality, usability, and perceived polish of an existing website or app, while preserving current functionality and staying on the project’s existing styling stack.

Core Features & Use Cases

  • Design audit and gap identification: Evaluates typography, color/surfaces, layout, interactivity, content, component patterns, iconography, and accessibility issues to pinpoint generic or broken UI patterns.
  • Targeted upgrades without rewrites: Applies focused fixes (e.g., font/typography scale, palette cleanup, hover/focus states, spacing/grid corrections, and state handling) that work with vanilla CSS or any CSS framework.
  • Practical upgrade sequencing: Provides a prioritized order of improvements to maximize visual impact with minimal risk during iterative changes.

Quick Start

Ask for a redesign audit and upgrade plan for your current project, then implement the fixes in the provided priority order while keeping the existing framework and behavior intact.

Frequently Asked Questions about redesign-existing-projects

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

FAQPage Schema
How do I redesign an existing app's UI without breaking functionality?

To redesign an existing app's UI without breaking functionality, you apply targeted upgrades like font swaps, palette cleanup, and state polishing while preserving the current CSS framework and avoiding a full rewrite.

Can I improve my website's UI without migrating to a new CSS framework?

Yes, you can improve your website's UI without migrating frameworks by auditing typography, color, and layout patterns, then applying focused fixes that work with vanilla CSS or your existing CSS framework.

What is a UI design audit and how does it improve frontend accessibility?

A UI design audit evaluates typography, color, layout, and component patterns to identify accessibility issues and generic UI, resulting in a prioritized upgrade plan that improves visual polish and usability iteratively.

What is the best way to prioritize UI upgrades for an existing website?

The best way to prioritize UI upgrades is to follow a practical sequencing order that maximizes visual impact with minimal risk, starting with high-impact changes like font scale and palette cleanup before moving to interactivity.

How do I fix broken UI design patterns without rewriting from scratch?

You fix broken UI design patterns by applying targeted upgrades such as correcting spacing grids, adding hover and focus states, and polishing typography, which keeps code changes reviewable and avoids rewriting from scratch.

Does a UI redesign audit work with vanilla CSS or only specific frameworks?

A UI redesign audit works with any CSS framework or vanilla CSS, evaluating surfaces and interactivity to pinpoint generic patterns and applying framework-agnostic fixes that preserve existing functionality and styling stack.