Rocket imports your screens and generates a working web app
After import, use prompts to refine:
Make the sidebar collapsible and add smooth transitions between pages. Connect Supabase for user authentication.
What to expect: A pixel-accurate implementation of your Figma design as a working web app. After import, iterate using chat exactly like any other Build task.
Refine the typography across the entire app. Use [font name] for headings and [font name] for body text. Set heading sizes to: h1 = 48px, h2 = 36px, h3 = 24px. Body text should be 16px with 1.6 line height. Increase the spacing between sections to 80px. Add 24px padding inside all card components.
What to expect: Updated typography and spacing applied consistently across all pages.
Update the color scheme to: primary = [hex code], secondary = [hex code], background = [hex code], text = [hex code], accent = [hex code]. Apply these consistently across all pages - buttons, links, headings, backgrounds, and borders. Keep the current layout and structure unchanged.
What to expect: A complete color refresh applied globally without affecting layout or functionality.
Add subtle animations throughout the app: fade-in on page load for hero sections, smooth hover transitions on buttons and cards (scale up slightly and add shadow), slide-in animations for content sections as they scroll into view, and a smooth page transition between routes. Keep animations performant - nothing should feel sluggish.
What to expect: Polished micro-interactions that make the app feel more refined and responsive.
Audit the design consistency across all pages. Make sure: all buttons use the same border radius, padding, and font weight. All cards have consistent shadows, borders, and padding. All form inputs match in style. Headings follow the same hierarchy everywhere. Fix any inconsistencies you find.
What to expect: A visually consistent app where every component follows the same design system.
Redesign the website at [client-site.com]. The client wants a modern, premium look. Keep the existing content structure but transform the visual design: updated typography (use a clean sans-serif like Inter or DM Sans), new color palette based on [brand color], more whitespace, modern card layouts, and improved mobile responsiveness. The homepage, about page, and contact page are the priority.
What to expect: A redesigned version of the client’s site that preserves their content while dramatically improving the visual design.
Redesign the landing page at [url] with a focus on conversion. Move the primary CTA above the fold. Add a sticky header with a CTA button. Improve the social proof section - make testimonials more prominent with photos and company logos. Add urgency elements (limited time offer, spots remaining). Streamline the pricing section to reduce decision fatigue.
What to expect: A conversion-optimized redesign of the existing landing page.
Redesign my portfolio at [url]. I want a minimal, editorial aesthetic - lots of whitespace, large project images, clean typography. Use a monochrome palette with one accent color ([hex code]). The project grid should use a masonry layout. Add smooth hover animations on project cards and a full-screen project detail view.
What to expect: A redesigned portfolio with a refined, editorial aesthetic.
What are the current design trends for [type of app/website - e.g., SaaS dashboards, e-commerce, fintech apps] in 2026? Cover visual design (typography, color, layout), interaction patterns, and UX conventions. Include 5-10 examples of well-designed products in this category and explain what makes them effective.
What to expect: A trend report with specific examples and design principles you can reference in your work.
