Roughly

About this plugin

Meet Roughly: Turn Your Sketches Into Something Amazing

Hey there! So you've got rough sketches, wireframes, or half-baked ideas sitting in your Figma files, and you're thinking "this could be so much better if I just had the right image." That's exactly why Roughly exists.

The Story Behind It

We've all been there – you're designing something and you need the perfect image, but stock photos feel generic, hiring an artist takes forever, and your own drawing skills... well, let's just say they could use some help. Roughly bridges that gap by letting you take any frame in Figma and transform it using AI into exactly what you're envisioning.

Think of it as having a creative partner who never gets tired, never judges your rough sketches, and can work in any artistic style you throw at them.

How It Actually Works

Using Roughly is refreshingly simple:

1. Select your frame in Figma – could be a rough sketch, a placeholder, or even just some shapes
2. Pick your focus – what's the main subject? People, architecture, products, monsters (yes, monsters!)
3. Choose your style – photography, illustration, 3D rendering, hand-drawn, or painting
4. Fine-tune the details if you want, or just hit generate
5. The AI does its magic and drops a beautiful, high-quality image right back into your Figma frame. No switching between apps, no downloading and uploading – it just works where you already work.

The Cool Stuff You Can Do

1. Transform anything: Got a stick figure drawing? Turn it into a professional portrait. Rough product sketch? Make it look like a polished marketing photo.
2. Merge two ideas: This is where it gets fun. Select two different frames and Roughly will intelligently combine them. Maybe you have a person in one frame and a background in another – it'll figure out how to blend them naturally.
3. Use your own style guides: Found an image you love the look of? Set it as a style reference and Roughly will match that aesthetic while keeping your actual subject matter.
4. Write prompts right on your canvas: Just add text to your frame with specific instructions like "make the background darker" or "add some dramatic lighting" – Roughly reads these and incorporates them into the generation.
5. Control the output quality: Want super crisp results for final presentations? Turn on high quality. Need something with no background for your design? Enable transparent backgrounds and you'll get clean PNGs ready to layer.

What You'll Actually Use This For

1. Design mockups: Stop using placeholder images that don't quite fit. Generate exactly what belongs in your design.
2. Concept exploration: Quickly test different visual directions without waiting for custom assets.
3. Presentation polish: Turn your rough wireframes into something that looks intentional and professional.
4. Creative brainstorming: See your wild ideas come to life. Sometimes the AI surprises you with directions you hadn't considered.
5. Client presentations: Instead of saying "imagine there's a great photo here," you can actually show them what you mean.

The beauty is that it works with your existing workflow. You're not learning a new tool or changing how you design – you're just making what you already do way more powerful.

Getting Started

You'll need an OpenAI API key (don't worry, it walks you through getting one), and then you're off to the races. The plugin handles all the technical stuff behind the scenes, so you can focus on being creative rather than figuring out how AI works.

Ready to turn those rough ideas into something amazing?