Field app · paired with Renato Garcia13 min read

Directo · Creator

The app of the person who produces the offer inside the store, and the model that decides who publishes on whose behalf

35: screens across four tracks, with the home screen as the only center.
3 axes: decide what each person sees and on whose behalf they publish.
9: personas with empathy maps, plus the house's list of market numbers.
16: screens of an alternative, delivered with the diagnosis beside them.

Paired with designer Renato Garcia. Client: Directo. Product: Creator. Period: August and September 2026.

The home screen of the person who worksThe home screen answers one question: what do I do now. The answer is one task, with its reward and its distance, not a list to choose from. Below it come the day, the queue ordered by reward per minute, and the level. The whole scroll is 1,320 pixels tall and the scroll is the deliverable, not the first frame.

00 File


Client	Directo
Product	Creator · the app of the person who produces the offer's content
Role	product design paired with Renato Garcia. Market research, personas, the diagnosis of the previous proposal, the app design and the authorisation model, made by the two of us
With	Renato Garcia · design partner, shared process
Scope	35 screens across four tracks, the authorization model, and the build board
Validation	with the client team, decision by decision
Platform	mobile, plus a web panel for the people who decide
Tools	Figma, FigJam
Period	August and September 2026

One line. The offers feed only exists if somebody produces the offer inside a store. This is that person's app: a task per product, a reservation with a deadline, a reward only after approval, and an authorization model that decides what they see and on whose behalf they publish.

01 Summary

Problem. The TicTac feed needs new offers every day: photo, copy and price of a product in a real store. The person who does that is what the market calls a creator, and their app did not exist. A flow had been designed before, and it started from premises the sector's platforms had already dropped.

What I did. I sized the market from public sources, wrote nine personas with empathy maps, measured the existing flow point by point against what the sector's platforms do, and designed the alternative: 35 screens across four tracks, with six rules written before the first pixel. Plus the authorization model, which is the piece the old design flattened into a list of three account types.

Result. The 35 screens, the authorization model with three axes and four types of link, the nine-row table that says what each one sees, and the build board written backwards from the final state, with an owner and a deadline on every step.

Role. Product design paired with Renato Garcia. Research, personas, the diagnosis, the design and the authorisation model came out of the two of us, and the client team validated them.

02 Context

TicTac is a feed of offers from physical stores. Retailers and brands advertise; the person near the store buys; and the person who produces the content of the offer is what the market calls a creator, someone who photographs and writes about the product on the shelf.

The money in that chain has a name: retail media budget, the amount a brand pays to show up in the channel where the purchase happens. It was the fastest growing media market in Brazil over the last three years.

That matters for the design because it changes who the user is. Not only the buyer. Also the people who work: the store merchandiser, the brand representative, and the person producing content on their own. Each one sees a different slice of the same data, and that was the hardest part of the project.

What the platform has that a social network does not. It knows the product's barcode, that store's stock, and the brand's priority. So it does not ask for generic content: it points at the right shelf. That is the product, and it is what decided the shape of the home screen for the people who work.

03 Constraint

CPF Seguro, the company's fraud-protection product, runs inside this one, embedded under Directo's brand. Two cases that meet in the same app.

Whoever produces the content never sees the money. Budget, paid reach and campaign return belong to the manager, never to the person executing. If it shows up on the executor's screen, that is a scope defect, not a layout choice.

One hat at a time. The same person can work at a store, represent a brand, and serve through an agency. Those three things grant different permissions over the same product, and the screen has to say which one is in effect right now.

The app does not decide the region. The person producing does not choose where the post lands: that comes from the approved link. If the screen asks for that choice, it opens a decision the person has no authority to make.

Two designers, one shared process. Renato and I work as design partners. Research, decisions and screens went through both of us, and not one product decision here was made alone. When we disagreed, the tiebreaker was the data, not who had been around longer.

04 The problem in numbers

The numbers below are public, gathered by me to hold up the product discussion. They are here because they are what explains why the design moved toward the people who work, and not only toward the people who buy.

The gap on the shelf. Out-of-stock in Brazilian food retail was measured at 12.9% in March 2024, against 6% to 8% in retail overall, and 38% of the causes originate inside the store. Each percentage point of out-of-stock is worth 0.5% to 1% of revenue, and 30% of the people who don't find the product buy from a competitor the same day.

The money that pays for it. Retail media budget in Brazil should reach US$ 1.67 billion in 2026, up 38.4%, the third year in a row leading global growth.

The base of people producing content. There are 1.28 million people in Brazil with ten thousand followers or more. Half of them earn up to R$ 5,000 a month, and only 6% go past R$ 20,000. Content produced by those people converted 6.73 times better in the first quarter of 2026, against 4.27 the quarter before.

The proof that the base sells when it can see the upside. In TikTok Shop's first year in Brazil, sales volume grew 102 times, and the number of people selling through affiliation grew 46 times.

Cross the four: retail loses revenue to gaps on the shelf, and 38% of that gap starts inside the store, where nobody is looking. There are more than a million people producing content and earning little. A platform connecting the two ends needs two things at once: a card that sells, and a person in the field with a task, a deadline and a reward. The feed was half the problem.

05 Exploration

Nine people, not five

Before designing the app of the person who produces the offer, I wrote nine personas, each with an empathy map and a value proposition side by side.

The draft had five and left four holes, and each hole was one side of the business: the buyer, without whom there are no sales; the retailer's product team, the technical validator, because the platform's inventory is the retailer's own app; the agency, which the client names as one of its four audiences; and the mall shop owner, the most fragile offer in the chain.

One of those personas changed chairs because of a data point: in 2026 retail media budget sits in brand marketing (71%) and e-commerce (54%), while in-store promotion budget fell from 37% to 11%. That persona stopped being the promotions team and became the e-commerce team.

The proposal that already existed, measured against the market

There was a flow designed before I joined that front. Instead of giving an opinion, I measured it point by point against what the sector's platforms do today, and wrote the two columns side by side: what the screen asks for, and what the market does instead.

Six findings came out. The three that changed the design the most:

The screen asked for the persona before login. No platform in the sector asks that at the door: the account is single and the role comes from an approved link. Asking at the door closes the door on someone who is both, and that person exists.
The automatic suggestion showed the store's interest ("high stock, 47 units") and hid the interest of the person about to produce. The sector's platforms rank by performance signals and show the estimated commission.
The person producing typed in the price and the discount. Margin belongs to whoever holds the stock. In the market, the store publishes the range and the person picks inside it.

The answer was not a critique document. It was a designed alternative, 16 screens, with a cover carrying the diagnosis and the design side by side. Bringing a measured alternative instead of an opinion is what makes the conversation fit in one meeting.

06 Decisions

D1 · Authorization is three axes that multiply

The question that opened the app design was "what can this person do". The answer that existed was a list of three account types. It does not hold, because the same person works at a store, represents a brand and serves through an agency at the same time.

Before that there was a simpler and more important split: these are two people, not one. Whoever executes gets a task, produces and publishes. Whoever decides sets budget, audience and campaign, and works in a web panel. The app belongs to the one who executes, and that is what explains everything it does not show.

The model that shipped has three axes: who authorizes, the scope and the degree. The scope has three cuts that intersect: place, product and action. The degree has four steps, each demanding more verification than the last: see, execute, publish directly, and speak on behalf of the entity. What shows up on screen is the multiplication of the three.

Why: the reference that solves this comes from banking, not from apps. Corporate signing authority answers four things at once: who signs, up to how much, on whose behalf, and until when.

Written consequence: the chain never grows. A sub-scope is always smaller than or equal to the scope, the degree never rises, and validity shortens each time it is passed on. An agency with the execute degree cannot grant the represent degree even if it wanted to.

The authorization tree1400×1123The model written before the screens: the three axes, the formula that resolves what shows up, and the three rules the design enacts. Revocation cascades, exclusivity is a flag on the contract, and one hat at a time.

D2 · Whoever executes never sees budget, paid reach or campaign return

There is a table of nine rows by four columns answering, for each type of link, what the person sees: stock, price, exposure, priority, other people on the same task, budget, exclusive task, who revokes and who pays.

The budget row is never across all four columns.

Why: information granularity is a business rule, not a screen preference. The person who works at the store is the only one who sees the stock count; someone who got an invitation from a nearby store sees only whether it is in stock, running low, or gone. Without that distinction, two people photograph the same shelf and one of them works for free.

How the design solves it: reserve before executing, with a visible deadline, and the task shows as blocked for everyone else while it is reserved.

Who sees what1600×378Nine rows of information across four types of link. This table decides what each screen shows, and it exists because "who sees what" cannot be settled screen by screen.

D3 · Write the list backwards, and separate the reversible from the structural

This decision is not mine, and it is the most useful one in the project.

I presented the nine personas with their empathy maps. The client's answer was that it was too theoretical and never touched execution, and that the way in was different: start from the resolved state. If I were in the future, how would I want things to be, and what did I do in the past to get there. The same conversation brought the second ruler, Bezos's: most decisions are reversible, so decide fast and correct fast; only the structural ones deserve deliberation.

What I did was turn both into a board. First the resolved state, with a date and a written scene. Then the steps that lead to it, each one with what breaks if it is missing, the owner, and the deadline. And the decisions in two boxes. Reversible: the card's proportions, the order of the elements, the button label, which type ships first. That does not open a meeting; whoever is doing the work decides and tells the others. Structural: where the price comes from, who gets an operator login, whether a brand can push content without store approval. Those go to the table.

Why the persona was not enough: it answers the why and it does not produce an order of construction. Somebody who has to decide on Monday needs a list with owners, not an empathy map.

What I gave up: consensus on everything. A reversible decision taken alone annoys somebody once; a structural decision taken alone costs a quarter.

What I learned: I had brought the method I knew instead of the method the decision was asking for. The personas are still in the file and still useful, but they became an input to the board, not the deliverable.

D4 · The price never passes through the hands of the person publishing

Whoever produces the offer does not type a price. They scan the product's barcode on the shelf, the system looks that item up in the catalog, and it returns the current offer with its price.

Why: prices in a store are dynamic, and the margin belongs to whoever holds the stock. A mistyped price in a supermarket is not a screen defect, it is a queue at the register and a product sold at a value nobody authorized.

What that forces: the barcode reader stops being a convenience and becomes a mandatory piece of the first release.

D5 · Nothing publishes outside a campaign

Every published piece of content is tied to a campaign, and the campaign is created beforehand by whoever decides. The person producing arrives, sees the available campaigns, and picks one. With no active campaign, the publish button does not exist.

Why: loose content has nobody paying for it and nobody answering for it. Tying it to the campaign is what turns work into something billable, and it is also what gives the brand the right to refuse.

07 Craft

The single flow, 35 screens1600×1213All 35 screens on one board. Entry is linear on the left, the home screen is the only center, and four tracks come out of it, one per tab: the task, create, earnings and account. No track talks to another, and all of them return to the center. A grey arrow is the main path with the gesture written above it, an accent arrow is an exit from the center, and a warning arrow is a detour, with the reason beside it.

Your links786×2600The full scroll of the links screen, which is where the authorization model shows up for the person using it. Four relationships, not a list of companies, and only one of them is in effect at a time.

Link with the store — The two relationships that change the screen the most, side by side. Someone who works at the store sees the stock count. Someone who got an invitation from a nearby store sees only in stock, running low, or gone, because a count is inside data. On the right, whoever decides the post

Open invitation — The two relationships that change the screen the most, side by side. Someone who works at the store sees the stock count. Someone who got an invitation from a nearby store sees only in stock, running low, or gone, because a count is inside data. On the right, whoever decides the post

The open task — FlowThe task from start to finish. The reservation locks it for 45 minutes and it shows as blocked for everyone else, otherwise two people photograph the same shelf and one works for free. On the last screen the person reports how many units they found, and the app shows what the system claimed: the gap between nine and twelve is the data the brand is buying.

Reserved, with a deadline — FlowThe task from start to finish. The reservation locks it for 45 minutes and it shows as blocked for everyone else, otherwise two people photograph the same shelf and one works for free. On the last screen the person reports how many units they found, and the app shows what the system claimed: the gap between nine and twelve is the data the brand is buying.

Six rules written before the design, and that is what has to survive, not the pixels: the home screen's hierarchy, what the person never sees, reserve before executing, location as chrome and not configuration, reward only after approval, and the campaign tied on after publishing.
The home screen is 1,320 pixels tall because it scrolls, and the whole scroll is the deliverable. Context, the task for right now, the day, the queue and the level, in that order.
Two new pieces entered the client's system because of this app: the task card and the context bar.
Authorization became an interface piece with four states: in effect, active, under review and revoked. The accent exists only where the person is right now, because three accented cards make the accent stop meaning anything.

08 Result

35 screens with no repetition, across four tracks, with the home screen as the only center.
An authorization model with three axes, four types of link and four degrees, plus the nine-row table that says what each one sees. The budget row is never, across all four columns.
16 screens of an alternative for entry and roles, delivered with the diagnosis of what existed beside it, point by point.
Nine personas with empathy maps and value propositions, and the list of market numbers any proposal in the house can reuse.
A build board written backwards from the final state, with what breaks if a step is missing, the owner and the deadline, and the decisions split into reversible and structural.
And the conversation that opened afterwards: adapting the house design system for this client instead of them keeping their own. It was agreed as a long-term foundation, not a sprint item, and it is the first time the language has been asked for outside the house's own products.

09 What I would do differently

I wrote nine personas from market data, not from interviews. They rest on public sources and on conversations with the client team, which beats taste. It is not the same as having talked to a store merchandiser inside the store. The supermarket visit was agreed as a next step, and it should have been the first one.

The two questions only the field answers are still open: how much time the person has between two tasks, and what they do when the product the task asks for is not on the shelf.

The authorization model is the most fragile design in the project, and not because it is wrong. It depends on contracts: who signs, who revokes, who pays. While those three answers belong to the business and not to the product, the design carries one assumption per screen. It is written on the board, but a written assumption is still an assumption.

Fontes

Out-of-stock in Brazilian food retail, in-store causes and revenue effect: Central do Varejo, March 2024
Retail media budget in Brazil, 2026 and forecast: eMarketer, via Meio & Mensagem
Sales volume and affiliates in TikTok Shop's first year in Brazil: TikTok Newsroom
Base of people producing content in Brazil and income bands: Forbes and BrandLovrs
Conversion of content produced by those people, Q1 2026: Videowise
Retail media budget distribution by budget owner: Skai
Platform references used in the diagnosis: TikTok Shop, Nextdoor, Field Agent, Roamler and BEES Force

Next case

N26 · Rules