The best idea in the project didn't fit on a phone

In 2024 I designed the website and wrote the copy for Jay Kosher, a kosher certification agency in Guadalajara. The part of that project I’m proudest of is also the part I would redesign today.

This is a short retrospective on why. The live site has changed since then; everything here is about my 2024 proposal.

1. The problem: a regulated process that sounds like paperwork

Getting a product certified as kosher takes seven steps: a request, a payment that sets the guidelines, a proposal with scope and cost, an advisor, a rabbinical audit, a certificate valid for one year, and surveillance visits during that year.

For a food company that has never been certified, that list reads like seven closed doors. And the site had a second audience: consumers looking for trust in a label. So the copy explained what kosher means before it tried to sell anything.

2. The idea: turn the process into a road

Instead of a list, I drew the process as a road with seven stops. Each stop answered two questions: what happens here, and who does it.

On a 1920 px screen, it worked. You could see the whole journey at once: where you start, where you end, and that it does end. That last part matters more than it seems. A process feels shorter when you can see its finish line.

3. Where it broke: the phone

On mobile, the road became a thumbnail with a “View full image” button. At 360 px, the text inside each stop was too small to read, so the button had to do the work.

That cost more than an extra tap:

  • The most useful content was hidden. The one section that explained how to become a client sat behind a button.
  • The steps weren’t real text. As an image, they couldn’t be read by screen readers or indexed by search engines.
  • The metaphor lost its point. A road you can’t see whole is just a picture of a road.

The root cause was simple. I designed the idea at desktop width and then tried to shrink it. The road depended on space, and the phone had none.

4. What I’d do today

  1. Start with the content model, not the picture. Seven steps, each with a number, a title, who acts, and one line of detail. Written as real text.
  2. Design the narrowest screen first. On a phone, a vertical stepper: one step per row, joined by a line. The road metaphor survives as a path you scroll down.
  3. Make the actor visible. A small label on each step: you, the agency, the advisor or the rabbi. That is the question a first-time client actually has.
  4. Let the desktop add, not replace. The winding road becomes a layout of the same HTML on wide screens, built with CSS, not exported as an image.
  5. Test it on a phone with someone who has never been certified. Two questions are enough: “Which step are you on?” and “What happens next?”

5. The lesson

A good idea that only works on one screen is half an idea. Design the content so it survives the smallest screen, then let bigger screens add delight.

I still like that road. I would just build it from the phone up.

If your service has a process your clients don’t understand, that’s usually where sales get stuck. Tell me about it and I’ll take a look.