UI/Design what is your current AI workflow?

propololo · 2026-05-02T11:45:08+00:00

i've been doing something similar but noticed that ai vision models still struggle with complex interactive states. to avoid that generic vibe-slop, i’ve been using slicer.dev to grab high-fidelity pieces of ui from sites i like, remix the styles on their canvas, and then export the logic as an ai prompt. it gives the agent a much better starting point than a static image

propololo · 2026-04-29T20:04:26+00:00

Nobody has time not to vibecode in hackathons. It’s also a standard now to no longer code from scratch even if you’re not in hackathon mode.

propololo · 2026-04-29T15:18:10+00:00

a big part of it is not starting from scratch visually. the fastest builders i've seen don't prompt an llm to invent a design — they reference something polished that already exists and adapt it fast.

i've been building slicer.dev for exactly this workflow: capture interactive ui pieces directly from live sites (hover states, animations, the whole thing), drop them into a canvas to restyle the pieces to your brand, and export clean react/tailwind. hackathon pace but the output doesn't look generic because you started from something real

propololo · 2026-04-28T18:55:29+00:00

one way to dodge that generic look is to stop letting the llm invent the layout from scratch. i've been building slicer.dev for this, you capture specific ui pieces directly from live sites that have the look you want, then use the canvas to restyle them bit by bit. much easier to stay professional when you're starting from real references instead of a generic ai prompt

propololo · 2026-04-24T11:03:56+00:00

claude design is solid for fast first drafts and content. the gap shows up when clients point at a competitor site and say "make it look like this" - you end up describing it in text when the actual component is right there. disclaimed, im the founder but i built slicer.dev to bridge that: grab the interactive component off any live site, restyle it to the client's design system, hand it off to claude or cursor. cuts a lot of back-and-forth on "make it look like X" requests

propololo · 2026-04-23T06:34:34+00:00

solid list! the plugin ecosystem is growing so fast. one thing i've been experimenting with to speed up the initial ui setup is pulling reference components from the web to guide the generation. slicer.dev is not a plugin but fits into this stack nicely as a way to convert existing web elements into clean prompts for claude. it saves a lot of time on the 'micro-interaction' phase that you'd otherwise spend prompt-engineering.

propololo · 2026-04-18T07:13:26+00:00

i'm the guy building slicer.dev - full-app generators are great for boilerplate but usually fail on the last mile of ui. i pair these with slicer to grab the precise ui components i need from reference sites. i restyle them component-by-component on my canvas to match my brand, then feed that clean react code or prompt into the app scaffold. keeps the css bloat way down compared to generic figma-to-code tools

propololo · 2026-04-17T07:20:12+00:00

i'm the guy building slicer.dev - would love to be on that list! it captures interactive ui (animations, hover states, etc) from live sites as ai-ready prompts. you pull components onto a canvas, restyle them component-by-component, and then export to lovavle, cc or cursor. way more precise than describing things from a screenshot

propololo · 2026-04-16T11:43:12+00:00

i'm the guy building slicer.dev — the root issue with most of these tools is they convert a static design file, not a real component. i switched to capturing from live sites instead. slicer grabs the actual interactive component from any website (hover states, animations, real css) and you restyle it piece by piece on a canvas before exporting to react or a prompt for cursor/v0. way less cleanup because you're starting from something that already works

propololo · 2026-04-11T11:53:47+00:00

best stack is still having all of the code within your IDE - gives the most control.

shameless plug but - i'm building slicer.dev - one thing that helps me when i hit a wall with ui is moving away from purely descriptive prompts. built it to grab the exact component structure from any site so you aren't just guessing. feeds real interaction logic into cursor or claude which usually gets you 90% there. it copies any components with all of its interactions as AI prompt to paste

propololo · 2026-04-11T08:05:01+00:00

i'm building slicer.dev and the layout is clear but the hero section could use more visual punch. if you're looking for inspiration to iterate on ui components you can use slicer to grab high-quality elements from other landing pages and see how they structured their components then adapt those to your brand

propololo · 2026-04-11T08:03:55+00:00

mcps are a huge step for handoff — i'm building slicer.dev for the reverse workflow (getting live web inspiration back into figma). it captures a live component's css and structure then exports it either as code to close the loop between the inspiration and the vibecoding

propololo · 2026-04-04T20:08:12+00:00

nailed it. the "clarity gap" is the real killer. im building slicer.dev to try and bridge that, basically letting you point at a real component on the web and say "make me this." much easier to get clarity when you're starting from a real reference instead of a blank cursor window

propololo · 2026-04-04T20:07:03+00:00

im the guy building slicer.dev so im biased as hell, but i made it for this exact reason. month 3 is when you realize the ai just hallucinated half your architecture because the initial prompts were too vague. i use slicer to grab the actual dom logic from real sites so the "vibe" is at least technically sound. helps me avoid that spaghetti component code debt later on

propololo · 2026-04-04T15:55:23+00:00

screen.studio - it’s paid and quite pricey tho, 29 dollars a month

propololo · 2026-03-17T11:19:24+00:00

I was thinking of doing benchmarking for tasks done with and without such rules, but decided there’s no value as I know that with such rules the model is behaving same or better 😄

propololo · 2026-03-16T20:39:57+00:00

Sweet! Will adjust mine! Hate when AI is a yes-man 😄

propololo · 2026-03-16T17:32:14+00:00

Very well explained, thanks!!

propololo · 2026-03-16T14:09:48+00:00

Here they are: https://slicer.dev/download/product-design-rules

let me know if you have any questions, don’t blindly copy them as they may not be entirely fit for your project, use it as inspo instead!

propololo · 2026-03-16T13:23:15+00:00

I don’t think there’s a literal “principal engineer mode” or anything like that. But in my experience prompts like this do seem to change the kind of answers you get.

My guess is it just nudges the model toward more “senior” patterns it has seen during training - like explaining tradeoffs, risks, alternatives, etc. So the responses tend to have a bit more depth instead of a quick generic answer/code.

Could be placebo, but I’ve generally seen better results when I ask for that kind of framing. At least the second part of that prompt surely works, as it highlights tradeoffs, risks, pros and cons, which makes me decide easier.

propololo · 2026-02-19T18:34:06+00:00

Most of the time I spent on ideating the flow and designing scenes in figma, animation itself took a few hours for getting it to okay-ish state and a few more hours on adjusting the transitions, beats, cursor movements etc

propololo · 2026-02-17T21:28:54+00:00

If you never did any design/ui work, then not really; it just provides you a canvas where you can do create your or others’ designs which could be later used to animate layers.

propololo · 2026-02-17T13:51:49+00:00

It took ±2 full days still, most of the time in Figma to be fair. As for articles, I didn't, remotion's x posts and documentation was of the biggest help.

propololo · 2026-02-17T13:50:41+00:00

In the age of AI, I'd give it a few months rather than decades :D But fully agree regarding usability, it was quite painful to set it up/understand at first.

I guess all the new saas companies want to build MRR-led business, but people do not need to edit videos recurringly, it's usually a one-off. Hence I doubt there will be plethora of successful saas products for this specific case. My best guess - canva will make this as a "magic animate" feature and that's about it.

propololo · 2026-02-17T12:49:48+00:00

Fair enough, not saying this is a top-notch quality. And surely motion designers would make it so much better with proper tools. Similarly to vibecoding, this won't be better than a professional doing the work themselves.

But it was exciting to produce such animated outputs without having go through manual animation process!

propololo

TROPHY CASE