DEV Community

yulan qiao
yulan qiao

Posted on

Building Writely with Kiro: From PRD to Browser Extension in Hours 🎉

#kiro

Youtube

  1. Introduction

During the Kiro Hackathon, our team built Writely, a browser extension designed to help non-native English speakers write more confidently, efficiently, and naturally. With Writely, you can translate as you type, polish text into different tones, or get multiple rewrites of a sentence — all without leaving your browser.

Our goal was simple: remove the constant friction of switching between translators, grammar checkers, and writing tools, and give people a one-stop assistant right where they need it.

  1. The Problem We Wanted to Solve

As non-native speakers ourselves, we’ve all felt these pain points:

  • Struggling to express complex ideas in English with limited vocabulary.
  • Translations that are technically correct but sound awkward or impolite.
  • Writing that feels monotonous or lacks variety.
  • Losing flow by switching between multiple apps just to finish one email.

We wanted to solve all of this in one lightweight, browser-based tool.

  1. How We Used Kiro

We started with a plain-language PRD. Instead of diving into code, we gave this spec to Kiro’s Spec feature.

Kiro did something amazing:

  • It broke our PRD into detailed requirements and tasks, almost like a project manager.
  • It generated not just snippets, but a full architecture + clean UI that matched our design.
  • When some tests failed, Kiro automatically fixed and re-ran them.

The output was already solid — from UI to architecture — and only needed a few refinements. This was a huge time saver and made the whole process beginner-friendly, even for teammates without a coding background.

  1. Features We Built

With Kiro’s help, we shipped three core features:

  • Real-time translate-as-you-type: Type in one language, and watch it transform into English directly in the input box.
  • Smart text polishing with tone options: Highlight text and choose from Formal, Casual, Fluent, or Reasoning modes.
  • Alternative sentence structures: Instantly see 3 variations of a sentence with different flows or structures.

All of this is wrapped in a clean, non-intrusive UI that feels natural in everyday writing.

  1. What Surprised Us About Kiro
  • The task breakdown was so clear that even non-coders could follow along.
  • It felt like working with another teammate who never gets tired of boilerplate.
  • The output wasn’t half-baked — the UI and architecture were already strong, just needing detail tweaks.

This completely changed the way we approached development.

  1. Key Learnings
  • A good PRD is everything — the clearer your spec, the better Kiro performs.
  • Spec-to-code lets you focus on product design instead of setup and debugging.
  • Collaboration is smoother when everyone can see structured tasks, regardless of coding background.
  1. What’s Next for Writely
  • We want to take Writely further by:
  • Adding more tone options (e.g., academic, creative).
  • Expanding beyond English/Chinese to more languages.
  • Polishing the UI/UX for a public release.
  1. Conclusion

Writely showed us how powerful spec-driven development can be. With Kiro, we spent less time on setup and debugging, and more time turning an idea into a real product.

Thanks to Kiro for making building feel this smooth. I’m officially #kiro

Top comments (0)