Build an Instagram Story Aspect Ratio Tool with Claude Code

Social media design tool that resizes content to perfect Instagram Story dimensions (9:16). Content creators and marketers use it to optimize visual content for Instagram Stories engagement.

3,500 searches a month for “instagram story aspect ratio”WeekendA working first version in a day or two

The Claude Code prompt

Build an Instagram Story Aspect Ratio Tool web app. People search for "instagram story aspect ratio" about 3,500 times a month, plus related searches like "instagram story size", "story dimensions instagram", "instagram story maker". The goal is a tool that ranks for those searches and makes money.

What it should do:
Create an Instagram Story aspect ratio tool with image/video upload and automatic 9:16 formatting. Include text overlay positioning, sticker placement guides, and safe zone indicators. Add batch processing and story template library. Show preview with Instagram interface simulation. Focus on getting aspect ratio conversion working first.

How to build it:
1. Read this folder first. If it is empty, set up Next.js (App Router, TypeScript, Tailwind). Write a short PLAN.md with the pages, components, any library or API you need, and what you are leaving for later. Then build.
2. Put the tool itself on the homepage so a visitor can use it within seconds, with no sign-up. Do the processing in the browser where you can, so it is fast and cheap to run. Look at how Canva, Adobe Express, Kapwing do it and make ours simpler and faster.
3. Make it rank. Use "instagram story aspect ratio" in the title tag, H1 and meta description. Under the tool, add a short how-to and an FAQ with FAQPage schema, and add a sitemap and robots.txt. Scaffold these programmatic pages from one template and a data file: /instagram-story-size-[content-type], /story-aspect-ratio-[platform], /instagram-dimensions-[format].
4. Monetisation: Freemium: 20 stories/month, $6/mo unlimited + templates. Add a pricing page and the free usage limit, and leave Stripe checkout as a clearly marked stub with the environment variables it needs.
5. Run it locally and test the main flow end to end, including edge cases like empty input and very large files. Fix what breaks, then finish with a summary of what works, what is stubbed and how to deploy it to Vercel.

Paste it into Claude Code in an empty folder. It plans first, so read PLAN.md and steer before it starts building.

What people search for

instagram story aspect ratioinstagram story sizestory dimensions instagraminstagram story makerstory aspect ratioinstagram story resizerinstagram storystory dimensionssocial media designinstagram marketingstory makervertical content

Who you're up against

  • Canva : Design platform with Instagram Story templates
  • Adobe Express : Quick design tool with social media sizing
  • Kapwing : Online video editor with story tools

Pages that can rank

One template, many long-tail pages:

  • /instagram-story-size-[content-type]
  • /story-aspect-ratio-[platform]
  • /instagram-dimensions-[format]
  • /story-maker-[business-type]

Content to write

  • Perfect Instagram Story Dimensions and Design Guide
  • How to Create Engaging Instagram Stories with Proper Sizing
  • Instagram Story Design Best Practices for Better Engagement
  • Social Media Image Sizes: Complete Instagram Guide

How it makes money

Freemium: 20 stories/month, $6/mo unlimited + templates

More to build

More in Video tools · Every build idea