Mert

AI coding agents need capable models, and that part is obvious by now. What is less obvious is that model capability is only half the problem. The other half is model fit.

A model that works beautifully for one coding task can be wasteful for another. A frontier reasoning model may be the right choice for architecture, migration planning, or debugging a subtle production issue. The same model may be unnecessary for formatting code, generating a small helper function, renaming symbols, summarizing diffs, or applying a known pattern.

So the real question is not only:

“Are you using the best model?”

It is also:

“Are you using the right model for this task?”

That is the part I think we should talk about more.

Table of Contents

• Overview
• The Hidden Problem: Model Fit
• Why One Model Is Not Enough
• Task Classes: What Kind of Coding Work Is This
• Model Profiles: How Much Intelligence Should the Task Get
• Why the Best Model Depends on the Harness
• Routing, Escalation, and Cascades
• Why This Matters in Real Repositories
• Conclusion

Overview

A lot of discussion around AI coding still treats model choice as a leaderboard problem. The assumption is simple: if one model is strongest overall, then using it everywhere should produce the best results. That is true sometimes, but it is also incomplete.

In practice, coding work is not one task. It is a mix of small edits, local reasoning, repository navigation, test interpretation, dependency awareness, code generation, code review, refactoring, migration planning, debugging, and long-horizon agentic work. These are not all equally difficult, and they do not all benefit from the same model size.

That means model selection is not just a capability decision. It is a systems design decision.

The largest or newest model may be the safest default for hard tasks, but it is not automatically the best default for every task. Larger models usually cost more. They can be slower. They may produce longer outputs than needed. They may burn tokens on reasoning that the task does not require. OpenAI’s own latency guidance makes this point directly: model size is one of the main factors influencing inference speed, and smaller models are usually faster and cheaper; used correctly, they can even outperform larger models for some workloads. (OpenAI Developers)

So the useful framing changes. It becomes less about “which model is best?” and more about this:

What is the smallest model that can reliably complete this coding task at the required quality level?

The Hidden Problem: Model Fit

When an AI coding workflow gets expensive or slow, we often blame token volume. Sometimes that is fair. Context bloat is real. Large repository prompts are expensive. Tool loops can multiply cost quickly.

But sometimes the issue is more basic: the wrong model is doing the wrong job.

A frontier model may be excellent at difficult multi-step coding work, but that does not mean it should handle every operation in the pipeline. Many coding-agent workflows contain tasks that are more operational than intellectual: classify the request, summarize a file, identify relevant paths, generate a test command, rewrite a small function, apply a style rule, or explain a diff. These tasks still require accuracy, but they often do not require the maximum available reasoning budget.

This is where model sizing becomes important.

A model can be “too small” for a task, causing bad patches, shallow reasoning, or missed edge cases. But a model can also be “too large” for a task, creating unnecessary cost and latency without materially improving the outcome. The second failure mode is quieter, because the answer may still be good. It just may be inefficient.

In other words, the problem is not always model capability. Sometimes it is mis-sized capability, and that distinction matters because once you move from “use the best model” to “size the model to the task,” the design space gets much more interesting.

Why One Model Is Not Enough

There is a quiet assumption in many coding-agent setups that one model should carry the whole workflow. Pick the strongest model you can afford, wire it into the agent, and let it handle everything.

That sounds clean, but real coding workflows do not behave that way.

A small bug fix is not the same as a cross-package refactor. A failing unit test is not the same as a flaky integration test. A code review comment is not the same as a schema migration. A repository-wide modernization is not the same as adding one missing null check.

The model market also no longer behaves like a single ladder where every better model is simply “more of the same.” Providers now expose families of models with different cost, latency, context, and reasoning tradeoffs. OpenAI, for example, explicitly presents frontier models for complex reasoning and coding while also pointing to smaller models for lower-latency, lower-cost workloads. (OpenAI Developers) Anthropic’s pricing page similarly shows large price differences across Claude model tiers, with higher-end models costing materially more per token than smaller ones. (Claude Platform) Google’s Gemini pricing also separates Pro and Flash-style options with different cost profiles. (Google AI for Developers)

So a single fixed model quickly starts to look less like a simplification and more like an accidental constraint.

The better framing is that a coding agent should not have one model, but a model portfolio. Once you accept that, at least two dimensions become worth choosing deliberately: task difficulty, meaning how much reasoning the work needs, and execution role, meaning where in the workflow the model is being used.

Those two decisions matter much more than they usually get credit for.

Task Classes: What Kind of Coding Work Is This

The first question is task class. Not all coding tasks deserve the same model budget, and the easiest way to waste money is to treat them as if they do.

Mechanical Tasks

Mechanical tasks are low-ambiguity operations. They include formatting, renaming, applying simple conventions, translating obvious patterns, generating boilerplate, extracting structured data from code, summarizing a small diff, or making a localized edit with clear instructions.

These tasks can often be handled by smaller or faster models, especially when the repository context is clean and the expected output is easy to validate.

The important point is not that these tasks are trivial. The important point is that they are bounded. The model does not need to discover a new architecture. It needs to execute a known operation correctly.

Local Reasoning Tasks

Local reasoning tasks require understanding a function, file, module, or narrow dependency chain. Examples include fixing a failing unit test, adding a small feature inside an existing pattern, explaining a bug, or modifying behavior in one bounded area of the codebase.

These tasks often benefit from a mid-sized model. The model needs enough reasoning to understand cause and effect, but it may not need the most expensive frontier model if the context is well-scoped and tests are available.

Repository Reasoning Tasks

Repository reasoning tasks require understanding conventions, cross-file relationships, hidden assumptions, or interactions between systems. Examples include changing a public API, updating a persistence layer, modifying authentication behavior, or refactoring a shared package.

This is where stronger models become more valuable. The difficulty is not just writing code. The difficulty is preserving behavior across a larger surface area.

Long-Horizon Agentic Tasks

Long-horizon tasks require planning, tool use, repeated verification, and recovery from mistakes. Examples include migrating a framework version, resolving a complex GitHub issue, implementing a feature across multiple packages, or debugging failures after several failed attempts.

This is the class where the strongest models are most defensible. Benchmarks such as SWE-bench Verified focus on real software issues and evaluate whether generated patches pass associated tests, which makes them more relevant to this kind of work than simple code-generation benchmarks. SWE-bench Verified is a human-filtered subset of 500 tasks, and the SWE-bench site also distinguishes between different harnesses and agent setups, which is important because the model is only one part of the result. (SWE-bench)

The important point is not that one class is better. The important point is that they have different model requirements.

A mechanical task optimizes for speed and cost. A long-horizon task optimizes for reliability and recovery. Those are not the same objective.

Model Profiles: How Much Intelligence Should the Task Get

The second question is model profile. Once you understand the task class, you can decide how much model you actually need.

Small and Fast

Small models are useful when the task is bounded, the expected output is short, and failure can be cheaply detected. They are good candidates for classification, extraction, simple transformations, file summaries, quick explanations, and narrow edits.

This profile is especially valuable inside coding agents because many agent steps are not the final patch. They are supporting operations: deciding what to inspect, summarizing what changed, checking whether a file is relevant, or generating a small intermediate artifact.

Using a frontier model for every supporting operation can make the whole agent feel expensive before it has even started solving the real problem.

Mid-Sized and Balanced

Mid-sized models are often the best default for day-to-day coding. They can usually handle common implementation tasks, local debugging, test-driven edits, and straightforward refactors while keeping cost and latency under control.

This profile matters because most coding work is not at the extreme frontier. It is not always a research-level debugging problem. It is often a known engineering task inside a known codebase.

That is where balanced models can be very effective: enough capability to reason, not so much cost that every iteration becomes expensive.

Frontier and Expensive

Frontier models should be reserved for tasks where failure is expensive, ambiguity is high, or reasoning depth matters. They are useful for architecture, difficult debugging, security-sensitive review, large refactors, migrations, and agentic loops where a bad early decision can waste many later steps.

The key is not to avoid frontier models. The key is to spend them deliberately.

A strong model is most valuable when it is applied to the part of the workflow where intelligence is actually scarce. If it is used everywhere, it becomes less like a precision instrument and more like a very expensive default setting.

Why the Best Model Depends on the Harness

This is probably the most important point in the whole article. The right model depends not only on the task, but also on the harness, because different coding-agent environments do not consume model intelligence the same way.

Some harnesses front-load a lot of context. Some use retrieval. Some rely heavily on shell feedback. Some run tests aggressively. Some ask the model to plan and execute. Some split work across sub-agents. Some keep a human tightly in the loop. Others run closer to batch mode.

That changes model requirements.

A smaller model with excellent context, strong tools, tight tests, and clear instructions may outperform a larger model operating with poor context and weak feedback. This is also why benchmarks should be read carefully. SWE-bench, for example, is not only a model benchmark; results depend on the agent scaffold, tools, retries, and evaluation setup. The SWE-bench leaderboard explicitly separates benchmark variants and notes the harness used for some comparisons. (SWE-bench)

The same applies in production. A model that is too weak for open-ended coding may be perfectly reliable when used as a sub-agent for search, summarization, or patch verification. A frontier model that performs well in an interactive IDE may be too expensive for a high-volume automated review pipeline. A model that is excellent for code generation may not be the best choice for cheap classification or test-log summarization.

So when people ask what the ideal coding model is, I think the honest answer is this:

There is no ideal model independent of the consumption model.

There is only the best fit for the task, the repository, the harness, the validation loop, the latency target, and the cost budget.

That is why model choice should be a routing decision, not a static preference.

Routing, Escalation, and Cascades

A practical way to think about model optimization is fairly simple.

Use a small model when the task is bounded, reversible, cheap to validate, or part of the agent’s internal workflow.

Use a mid-sized model when the task requires local reasoning, but the scope is still clear and tests or review can catch most mistakes.

Use a frontier model when the task is ambiguous, cross-cutting, high-risk, long-horizon, or expensive to get wrong.

But the more interesting pattern is not manual selection. It is routing.

Model routing means choosing the model dynamically based on the task. Model escalation means starting cheaper and moving upward only when needed. Model cascades mean trying one model first, validating the result, and escalating if confidence or correctness is insufficient.

This is not just a theoretical idea. The research direction is well established. FrugalGPT proposed prompt adaptation, LLM approximation, and LLM cascades as ways to reduce inference cost, and reported that cascades could match the performance of the best individual LLM with up to 98% cost reduction in their experiments. (arXiv) RouteLLM similarly frames model choice as a cost-performance routing problem, dynamically selecting between stronger and weaker models at inference time. (OpenReview) More recent routing work continues in the same direction: select models based on task requirements, cost, latency, and expected quality rather than treating one model as universally optimal. (arXiv)

For coding agents, this suggests a useful architecture:

Do not ask one model to do every job. Build a workflow that knows when to spend intelligence.

That can look like this:

• A small model classifies the task;
• A small or mid-sized model retrieves and summarizes relevant files;
• A mid-sized model attempts the patch;
• Tests, linters, or static analysis validate the result;
• A frontier model is invoked only when the task is hard, the patch fails, or the risk is high.

That is a very different cost profile from sending every step directly to the most expensive model.

It is also a better engineering posture. The goal is not to be cheap for its own sake. The goal is to reserve expensive reasoning for the moments where it changes the outcome.

Why This Matters in Real Repositories

This matters because coding-agent cost is not only a token problem. It is a workflow problem.

An agent that uses a frontier model to summarize every file may not need better summarization. It may need cheaper summarization. An agent that sends every lint fix to the largest model may not need more intelligence. It may need a mechanical edit path. An agent that uses the same model for task classification, repository search, code generation, test repair, and architectural reasoning may not need one better model. It may need a model-sizing strategy.

The economics become especially important once agents move from demos to real usage. Coding agents are iterative. They inspect files, call tools, run tests, read failures, revise patches, and sometimes repeat the loop many times. That means small inefficiencies compound quickly.

Prompt caching helps, and it should be part of the conversation. OpenAI states that prompt caching can reduce latency by up to 80% and input token costs by up to 90% for repeated prompt prefixes. (OpenAI Developers) But caching does not replace model sizing. Caching makes repeated context cheaper. Model sizing asks whether the expensive model needed to see that context in the first place.

The real optimization is layered:

better context, better routing, better validation, better caching, and better escalation.

That is why model selection deserves more engineering attention. Not just which model scores highest, but which model should do which part of the workflow, under which conditions, with which fallback path.

If we care about coding-agent performance, we should care about model capability. But we should also care about cost per successful task, latency per iteration, failure recovery, validation quality, and how often expensive reasoning is invoked unnecessarily.

That is not procurement detail. It is part of the runtime architecture of the agent.

Conclusion

A good AI coding workflow is not only about using a powerful model. It is about fit: fit to the task, fit to the repository, fit to the harness, and fit to the way the work is validated.

That is why I do not think coding agents should default to one model everywhere. Some tasks need the strongest available model. Some need a balanced model. Some need a small, fast model with good instructions and tight validation. Some need a cascade where the system starts cheap and escalates only when the task proves difficult.

The important shift is this:

Stop thinking of model choice as a leaderboard decision. Start thinking of it as a sizing problem.

Once you do that, cost and performance stop looking like opposing forces. They become part of the same engineering problem.

So if you are building coding-agent workflows, that naturally leads to a more useful question:

Are you using the best model, or are you using the right model at the right moment?

Google has not officially released Veo 4. The latest official video model is Veo 3.1, and the most recent expansion is Veo 3.1 Lite (April 2026 model card).

But the timing is interesting. Google I/O 2026 starts May 19 — the day after I’m writing this. The historical Veo cadence (May 2024 → Late 2024 → 2025 → Late 2025/Early 2026) makes Veo 4 the obvious flagship video model to watch. If you’re building agent or content pipelines, this is the week to have your migration checklist ready.

Sharing what I found while preparing for it.

TL;DR

• Veo 4: not announced as of May 18, 2026
• Veo 3.1: the official latest flagship
• Veo 3.1 Lite: April 2026 lower-cost variant
• Google I/O 2026: May 19-20 — best probability window for a Veo 4 reveal (~70% in my read)
• Veo 3.1 standard price: $0.40/sec at 720p/1080p

What’s officially live right now

Google’s DeepMind Veo page lists Veo 3.1 as the state-of-the-art model. The Gemini API video docs confirm:

• Text to video ✅
• Image to video ✅
• Native audio ✅
• First + last frame generation ✅
• Video extension (preview) ✅
• Reference images ✅
• 4K output (priced) ✅

There is no Veo 4 model card, no Vertex AI Veo 4 model ID, no Gemini API pricing entry for Veo 4 anywhere on Google domains as of this writing.

The release window math

My probability estimate:

Not a confirmed date. Just a read of Google’s release cadence and how I/O has been used for prior Veo announcements.

Current Veo 3.1 API pricing — the baseline Veo 4 has to beat

Per Gemini API pricing:

For an 8-second clip:

At 1,000 × 8s 720p clips per month, that’s $400 (Lite) → $3,200 (Standard). The unit cost matters at production scale.

What Veo 4 would actually need to ship

Not “prettier output.” Controllability.

Production teams need to revise one object, keep a face consistent across shots, or extend a scene without restarting. That’s the workflow jump that actually matters.

Three real routes to use Veo today

1. Gemini App / Flow      (creators, non-technical)
2. Gemini API             (developer)
   veo-3.1-generate-preview
   veo-3.1-fast-generate-preview
   veo-3.1-lite-generate-preview
3. Vertex AI              (enterprise, governance)
   veo-2.0-generate-001
   veo-3.0-generate-001
   veo-3.0-fast-generate-001
   veo-3.1-generate-preview
   veo-3.1-fast-generate-preview

My migration checklist before Veo 4 lands

Whether Veo 4 ships next week or in Q4 2026, the prep work is the same:

Don’t migrate just because newer. Migrate if it cuts retries, improves controllability, or unlocks a workflow Veo 3.1 can’t handle.

Code-wise, the cleanest pattern:

# config.py
VIDEO_MODEL = os.environ.get("VIDEO_MODEL", "veo-3.1-fast-generate-preview")

# generator.py
def generate_clip(prompt: str, **kwargs):
    return client.generate_videos(model=VIDEO_MODEL, prompt=prompt, **kwargs)

When Veo 4 lands, set VIDEO_MODEL=veo-4.0-generate-preview (assuming Google follows naming conventions) and re-run your eval set. If accepted-clip cost drops, migrate. If not, hold.

Where I track this stuff

Personally I keep an eye on the model availability and pricing changes through TokenMix.ai‘s model intelligence dashboard — it tracks 170+ models across vendors and surfaces when new model IDs appear, when prices shift, and when something gets deprecated. Helpful for not missing the moment a Veo 4 endpoint actually opens up. Full writeup of the Veo 4 release date analysis, all pricing tables, and the migration checklist is on the main site at tokenmix.ai/blog/veo-4-release-date-google-io-2026.

Bottom line

If you’re shipping video generation work this week, use Veo 3.1 (or Wan 2.6 if cost-per-second matters more than audio quality). Have your eval suite and config-driven model switch ready. Then watch the Google I/O 2026 keynote May 19-20 — if Veo 4 drops there, you can swap and re-bench in an afternoon. If it doesn’t drop, the prep work still applies for the next time Google ships a flagship.

Curious if anyone has insider signal on the Veo 4 timing — drop a comment if you’ve seen anything more concrete than “coming soon.”

All data verified May 18, 2026.

A week ago I opened a piece of code Claude Code had written for me. Looked at it and asked: “Wait — why did I tell it to do it this way?”

I couldn’t remember.

I asked Claude again. The session was already closed. The new agent shrugged: “Not sure why, but merging these seems fine.”

I blamed my memory at first. Started taking notes in Notion. Quit within a week — when you commit 30+ times a day with AI, hand-curated notes don’t scale.

Eventually I had to admit it: this isn’t a memory problem. It’s a missing tool.

The blank git has never filled

git has recorded what changed almost perfectly for 20 years. But right next to it sits a blank that’s never really been filled — why you changed it, and which alternatives you rejected.

When humans wrote code, that blank was invisible. The author carried the answer. You could ask the engineer across the desk, or even six months later they’d remember most of it.

The moment AI started writing code, the carrier vanished.

Agents review dozens of alternatives in a single session. They pick one. They discard the rest. Then the session closes and that reasoning is gone forever — not buried in some archive, just gone. The context
window evaporates with the session.

If you’ve been using Claude Code, Cursor, or any AI coding agent daily, you’ve probably felt this. Code you “wrote” last week feels foreign. Six months from now? You’ll just rewrite it.

What I built

I started small. A hook that ran after every git commit, asking Claude Code to dump three things to a file:

1. The original prompt I sent
2. The alternatives Claude considered
3. Why it picked the one it did

Two months in, that single hook was saving me hours every week. Every “wait, why did I do this?” moment turned into a 30-second lookup instead of a half-hour archaeology dig.

Then I started wondering:

• What if a team could read this together?
• What if a past session’s reasoning could auto-inject into the next session’s context?
• What if a PM, who never opens the IDE, could see why today’s decisions were made — in plain prose?

That hook became a product. It’s called AIFlare.

How it works (the interesting part)

AIFlare is three layers:

1. Claude Code Hooks that fire on specific lifecycle events
2. A local stdio MCP Server that Claude Code spawns per session
3. A backend that stores entries and powers a shared web timeline

Layer 1: Hooks

Claude Code’s hook system lets you attach scripts to lifecycle events. AIFlare attaches to four:

PostToolUse  (matcher: Bash + git commit)   →  capture context after commit
PostToolUse  (matcher: AskUserQuestion)     →  track when the agent asks the user
UserPromptSubmit                             →  accumulate prompts within a session
Stop / SessionEnd                            →  finalize session record

The most important is the first. The moment you run git commit, the hook fires a small Node.js script that:

1. Reads the latest commit hash via git rev-parse HEAD
2. Reads the cumulative prompts captured during this session
3. Asks Claude Code (via its internal context-capture Skill) to summarize intent, considered alternatives, and rejected paths
4. POSTs the result to the AIFlare backend, authenticated via per-user API key

All of this runs in the background — there’s no manual step in the developer’s flow. You commit, the entry appears in the timeline a few seconds later.

Layer 2: MCP Server

The local MCP server is a Node.js process spawned per Claude Code session via .mcp.json:

{
"mcpServers": {
  "aiflare": {
    "command": "node",
    "args": [".claude/mcp-server/dist/index.js"]
  }
}
}

It exposes 12 tools across 6 categories — session summary, daily/weekly digest, session compare, prompt evaluation, and a why lookup. Each category has both a fetch tool and a save tool. So when you run
/summarize inside Claude Code, the flow is:

1. MCP get_session_summary → returns structured aggregates from backend
2. Claude Code reads that, drafts a human-readable Markdown summary
3. MCP save_session_report → persists the Markdown back to the backend

This split matters: the LLM produces the prose, while the backend produces the facts. The two never confuse each other.

Layer 3: Backend

The backend is Kotlin + Spring Boot 4 with PostgreSQL (entry storage), Redis (session cache), and JWT auth for the web console + HMAC-SHA256 API keys for the hook and MCP.

Resource hierarchy is Org → Team → Project, scoped via a UserScopedRole table and a ScopedPermissionEvaluator wired into Spring’s @PreAuthorize. Soft delete via @SQLRestriction, JPA auditing for
createdBy / updatedBy, virtual threads on Java 21 for the OTel collector pipeline.

The web console is Next.js 16 + React 19 + Tailwind 4 + Zustand. Server components for SEO-facing pages, client components for the dashboard.

Nothing exotic in the stack. The interesting part is the data model and the capture loop, not the framework choice.

Context Inject: closing the loop

Here’s the feature that turned the tool from “useful notes” into something I rely on daily.

When you finish a session with /summarize, the Markdown report is stored to the backend with a sessionId. Days or weeks later, in a fresh Claude Code session, you can run:

/context-inject <sessionId>

The MCP tool fetches that past session’s report and injects it directly into the new session’s context. The new agent now knows what the last session decided, why, and what was rejected — before you’ve even typed
your first prompt.

This breaks the “every session starts from zero” problem. The decision history accumulates, and the agent gets smarter not from training, but from your team’s actual record.

Future ideas (not built yet):

• Auto-inject relevant past sessions based on the files you’re editing
• Warn the agent before it suggests a previously-rejected approach
• Enriched git blame that includes the original intent

What it looks like

(Cover image / inline screenshot would go here — timeline view, showing intent + alternatives + linked prompts in one card.)

Each entry is a card with:

• Intent — what the agent was trying to do
• Changes summary — auto-generated, more readable than raw diff
• Alternatives considered — including the ones rejected and why
• Linked prompts — the full user/AI conversation that led to this commit
• Files affected, tags, comments, favorites

The timeline reads more like a project blog feed than a git log. That’s intentional — non-engineers should be able to follow along.

Stack summary

Installer is a single Node.js script that places hooks, skills, and the MCP server into .claude/ and a pre-push hook into .git/hooks/. One curl command, cross-platform.

Open beta — free, no card

I launched as open beta two days ago. Free, no card required. Korean / English / Chinese from day one.

What I’d most love isn’t praise. It’s the brutally honest version:

Here’s exactly why I wouldn’t use this.

That’s the single most useful thing I can hear right now. If you try it and bounce, please tell me what made you bounce. Bug reports, “this is dumb because X,” “I’d use this if Y” — all of it.

You can try the web demo or install in one line at https://aiflare.dev.

What I’m learning so far

A few things have already surprised me from early users:

1. Non-engineers care more than I expected.
I thought this was a tool for engineers. Two PMs and a designer asked to be added to the beta in the first 48 hours, saying they wanted to follow team decisions without bothering engineering. That’s a use case I
underweighted.

2. The “rejected alternatives” piece is the wedge.
People think they want better commit summaries. What they actually want is to know what the agent didn’t do, and why. That’s the unique value I almost missed when scoping the MVP.

3. MCP + hooks together is more than either alone.
Hooks capture passively. MCP exposes actively. Either alone is half the story — passive capture without active retrieval is just a graveyard, and active tools without passive capture means manual data entry. The
combo is what makes the loop work.

Thanks for reading

If you’ve got a minute — try it at https://aiflare.dev, poke around the timeline, and send me the harshest, most specific feedback you can.

Or if you just have a thought from reading this, drop it in the comments. I’ll read every one.

Image cropping looks like a small feature.

At least, that is how it feels at the beginning.

You pick an image, show a crop box, let the user drag or resize it, and save the final output. Simple enough, right?

But once you try to build a cropper that works reliably in a real React Native app, the problem becomes much more interesting. You are no longer just drawing a rectangle over an image. You are dealing with gestures, layout measurement, image scaling, pixel mapping, native processing, output compression, and platform-specific performance concerns.

I recently read this GeekyAnts engineering article on building a production-ready image cropper in React Native, and I found it useful because it treats image cropping as a real product-level feature instead of a simple UI task.

I am not associated with GeekyAnts in any way. This is my own third-party developer perspective on the ideas discussed in the article.

Why image cropping is not just a UI problem

A basic cropper can be created fairly quickly.

A production-ready cropper is different.

In a real app, users expect the crop preview to match the final image exactly. If they carefully position a profile picture inside a crop window, the saved image should not shift by a few pixels. If they resize a cover image crop area, the final upload should reflect that same area accurately.

That accuracy is harder than it sounds because the crop box exists in screen coordinates, while the original image exists in image pixel coordinates.

The crop rectangle the user sees on the phone screen is not automatically the same rectangle that needs to be cropped from the actual image file.

This is where many implementations start breaking.

The real challenge: mapping UI coordinates to image pixels

When an image is displayed inside a React Native view, it is usually scaled to fit the available space.

Sometimes it is shown with contain behavior.

Sometimes it is shown with cover behavior.

Sometimes part of the image is clipped.

Sometimes the image is much larger than the device screen.

That means the crop box position on the UI must be converted back into the original image’s coordinate system before cropping.

For example, suppose the original image is 3000px wide, but it is displayed inside a 300px-wide container. A 100px crop area on screen may represent 1000px in the original image, depending on the scale ratio.

If the implementation ignores this conversion, the result may look close, but not correct.

A production-ready cropper needs to calculate:

How the image was scaled.

How much of the image is visible.

Whether any part is clipped.

Where the crop box sits inside the displayed image.

What that crop area means in original image pixels.

That is the difference between a cropper that feels polished and one that randomly disappoints users.

Why gestures matter so much

• Cropping is a highly interactive feature.
• Users drag the crop box.
• They resize it from corners.
• They expect boundaries to be respected.
• They expect the crop window to feel smooth.
• They expect the image not to jump around.
• This means gesture handling cannot be treated as an afterthought.
• For a profile photo, the crop area may need to remain square or circular.
• For a cover image, the crop area may need a wider rectangular shape.
• For a free-form cropper, width and height may change independently.
• Each mode has different rules.
• A square crop needs locked dimensions.
• A cover crop needs an aspect ratio.
• A draggable crop window needs boundary checks.
• A resizable crop window needs minimum size limits.
• The user only sees a simple interaction, but the code underneath has to constantly protect the crop area from invalid movement.

Keep the UI fast and the image processing

separate

One idea I liked from the original article is the separation between gesture interaction and actual image manipulation.

The crop box should move smoothly while the user interacts with it. That part belongs in the UI layer.

The actual image processing should happen only when the user confirms the crop.

This matters because cropping, resizing, rotating, or compressing images can be expensive operations. Running them repeatedly while a user is dragging a crop window would be a bad experience, especially on lower-end devices.

A better flow is:

• The user moves or resizes the crop window.
• The app updates lightweight UI state.
• The app calculates the final crop area.
• The crop operation runs only after confirmation.
• The final image is resized or compressed for upload.
• That architecture keeps the interface responsive and avoids unnecessary processing.

Why native image manipulation is a better fit

React Native is great for UI and interaction, but heavy image processing should usually not happen in JavaScript.

The source article uses expo-image-manipulator, which makes sense because the actual image operations are handled through native capabilities rather than trying to process large image data directly in the JavaScript runtime. The original article specifically points out support for operations like crop, resize, rotate, and flip through native execution. (GeekyAnts)

That is important for production apps.

High-resolution images can be huge. Loading or manipulating them inefficiently can create memory pressure, slow screens, or even crashes. Moving the expensive work closer to native APIs helps keep the React Native side focused on what it does best: rendering the interface and handling user interaction.

The UI details that make a cropper feel complete

A cropper is not only about the final output.

It also needs to feel clear while the user is using it.

Small visual details can make a big difference.

A dimmed overlay outside the crop area helps users focus.

Corner handles make resizing more obvious.

A rule-of-thirds grid helps with positioning.

A loading state avoids confusion while the final image is being processed.

Aspect-ratio options make the feature useful for different upload cases.

A circular preview can help when cropping profile photos.

These are not just cosmetic improvements. They reduce friction and make the feature easier to understand.

The best cropper UI is one where users do not need instructions. They should immediately understand what can be moved, what can be resized, and what area will be saved.

Profile crops and cover crops need different thinking

One mistake developers can make is assuming all image crops are the same.

They are not.

A profile image crop usually focuses on a subject. It often needs a square or circular result. The user wants control over face positioning and framing.

A cover image crop is usually wider. It may need to preserve a banner-like aspect ratio. The important content might be spread horizontally.

These two use cases have different constraints.

For profile images, keeping the crop area fixed to a square can simplify the experience.

For cover images, allowing a rectangular crop with a controlled aspect ratio may be better.

For general media uploads, a free crop mode may be useful.

Thinking about these modes early helps prevent messy logic later.

Output quality matters too

Cropping is not the final step.

After cropping, the app still needs to think about the output file.

• Should the image be resized?
• Should it be compressed?
• Should the output be JPEG or PNG?
• Should profile images and cover images use different target dimensions?
• Should upload limits be enforced before sending the file to the backend?

These questions matter because image uploads affect performance, storage, bandwidth, and user experience.

A cropper that produces huge files may look fine during testing but become a problem in production. A cropper that compresses too much may make user images look poor.

Production-ready image handling means finding the right balance between quality and performance.

My perspective

What I found valuable about this topic is that it shows how much engineering exists behind a feature users barely think about.

A cropper is not usually the main feature of an app. It is often just part of onboarding, profile setup, content creation, or media upload.

But if it feels broken, users notice immediately.

Bad crop output feels personal because users are often editing their own photos. A small mismatch between preview and result can make the app feel unreliable.

That is why I think image cropping is a good example of product-focused engineering. It forces developers to care about the gap between what the user sees and what the system actually processes.

The best implementation is not the one with the most features. It is the one where the final image matches the user’s intent.

What I would add in a real-world app

If I were building this for a production app, I would think beyond the basic crop interaction.

I would add clear crop presets for common use cases like profile, cover, thumbnail, and post image.

I would test the feature with very large images, portrait images, landscape images, screenshots, and low-resolution photos.

I would check behavior on both iOS and Android.

I would make sure the final output dimensions are predictable.

I would avoid processing the image until the user confirms.

I would also add error handling for failed crop operations, unsupported image formats, and permission issues.

The cropper itself is only one part of a larger media pipeline.

Final thoughts

Building a production-ready image cropper in React Native is a reminder that simple-looking features often hide the hardest details.

The main challenge is not drawing a crop box.
The real challenge is making sure gestures feel smooth, boundaries are respected, coordinates are mapped correctly, native processing is used efficiently, and the final image matches what the user saw.

For small projects, a third-party cropper may be enough.

For apps where image upload quality matters, a custom approach can give developers more control over the experience.

In the end, a good cropper is not about fancy UI. It is about trust.

When users crop an image, they expect the app to preserve their choice accurately. That is what makes the feature feel production-ready.

The App Store subtitle is only 30 characters. That is too small for brand fluff.

If your title already says what the app is, the subtitle should add a new search angle or make the install feel more obvious. Most indie listings do the opposite. They repeat the app name, repeat the category, or use words like “simple” and “powerful” that do not help Apple or the person scanning search results.

The subtitle has two jobs

Apple can use your app name, subtitle, and keyword field for search. Users can also see the subtitle on the product page and often in search results.

So the line has to do two jobs at once:

• add relevant keyword coverage
• help a human understand the app faster

That sounds obvious until you audit real listings. A lot of subtitles are basically decorative.

Weak pattern: “Simple habit tracker”

Better pattern: “Morning routines”

If the title already contains “Habit Tracker,” the better subtitle adds a specific use case instead of spending 30 characters on words the title already covered.

Bad subtitle pattern: brand echo

A lot of indie apps write the subtitle like a tiny billboard for the brand.

Bad:

HabitFox: Build habits with HabitFox

Better:

HabitFox Habit Tracker: Morning routines

The better version is still plain. That is fine. Plain usually wins in metadata.

It gives Apple “habit tracker” in the title and “morning routines” in the subtitle. It also gives the user a more specific reason to care. For a new app, the brand usually has no search demand yet, so repeating it is expensive.

Treat the subtitle like rented space in a very expensive airport. Every word needs a job.

Subtitle examples by category

Habit app

Weak: “Simple daily habit builder”

Better: “Morning routines”

Why it works: if the title already says “Habit Tracker,” the subtitle can move into a concrete moment instead of repeating daily habit language.

Budget app

Weak: “Track money and expenses”

Better: “Bills and cash flow”

Pair that with a title like “Budget Planner” and you get more useful combinations: budget bills, cash flow planner, money bills, expense planner if expense lives in the keyword field.

Focus timer

Weak: “Powerful focus timer”

Better: “Deep work sessions”

“Powerful” does not tell the user anything. “Deep work sessions” points to a real job the app helps with.

Sleep sounds app

Weak: “Relaxing sleep sounds”

Better: “Rain, fan, white noise”

If “Sleep Sounds” is already in the title, the subtitle can carry sound types users actually search for and recognize instantly.

Language app

Weak: “Learn any language fast”

Better: “Travel phrases first”

The second version is narrower, more believable, and easier to match with screenshot copy.

When to choose keyword coverage over conversion copy

It depends on what the title already covers.

If your title is mostly a brand name, the subtitle probably needs the category.

Example:

Luma: Photo editor

That subtitle is doing necessary category work because “Luma” alone tells Apple and users almost nothing.

If the title already has the category, the subtitle can be more specific.

Luma Photo Editor: Film presets

Now the title handles the broad category, and the subtitle gets to add a sharper reason to click.

Do not make the subtitle carry everything. Thirty characters cannot explain your whole product, keyword strategy, and positioning. Pick the missing piece that matters most.

Quick rule:

• Brand-only title? Use the subtitle to name the category or main job.
• Category title? Use the subtitle to add use case, audience, or outcome.
• Crowded category? Go narrower than the obvious head term.
• Weak screenshots? Make the subtitle and first screenshot tell the same story.

A 10-minute subtitle audit

Put your title, subtitle, and 100-character keyword field in one note. Circle every repeated word.

If the subtitle repeats the title, rewrite the subtitle first. That change is visible to users and can free the keyword field to cover missing pieces instead of patching vague metadata.

Then test the line against a stranger question: would someone understand the app faster after reading this?

If not, it is probably decorative. Decorative copy is expensive in App Store metadata.

A good subtitle is not clever. It is compressed. It adds one useful idea the title did not already say.

Soft CTA: want the title, subtitle, keyword field, and first screenshot reviewed together? Paste your App Store URL into ASO Playbook and start with the free audit: https://asoplaybook.ai

Original source: https://asoplaybook.ai/blog/app-store-subtitle-examples-ios-apps