Drawing

PureSAF

Two directions for an Istanbul architecture practice.

PureSAF case study cover
What it is
Website · Two directions
Year
2026
What we ran
Drawing · Building
Built with
Next.js · React · Tailwind · shadcn/ui · Motion · Vercel

The practice

PureSAF is an architecture, interior design and construction group in Başakşehir, Istanbul, working across Türkiye and the Middle East. Three businesses under one name, a Gulf audience reading in two languages, and a portfolio that has to speak before any copy does. Through Walnut, our own software firm, we designed and built two complete directions to find out which story the practice should tell.

PureSAF designs buildings, builds them, and exports the materials and furniture that go inside them through a separate trade arm. The existing web presence split that story across several sites. The brief was one front door that could hold architecture, interiors, construction and trade without turning into a brochure with ten headings.

Gallery or agency?

Architecture sites usually go one of two ways. The gallery: work first, almost no words. Or the agency: a guided pitch with numbers, services, process and FAQ that answers a buyer's questions before they ask.

Instead of arguing it in a deck, we built both, end to end, on the same stack and the same content model, so the client could click through real pages, on a real phone, and feel the difference.

Direction A: the gallery

The home page is nothing but work: an eight-cell masonry pattern of mixed tile sizes, rendered in grayscale so the portfolio reads as one body of work, then blooming into colour under the cursor. No hero headline, no slogan. Every corner is square, the navigation is 11px letter-spaced labels, and the type pairs Montserrat headings with Questrial text and a Cormorant Garamond italic reserved for the founder's voice.

Direction B: the agency

Direction B leads with a full-bleed render under a giant, translucent wordmark, a live service card and the three numbers a buyer looks for first. Then it walks the visitor down a guided page: a statement that reveals word by word, core services, a "first sketch to finished space" process, FAQ and the team.

It is warmer and more persuasive. It is also, unmistakably, a template: the structure could belong to any studio.

Decisions that carried across both

  • Content as data. Every page reads from typed files: departments, projects, team, contact. Both directions share one source.
  • Arabic is a column, not a toggle. Addresses and hours sit in English and Arabic side by side, the Arabic set right-to-left with its own typographic rules.
  • WhatsApp first. The channel this audience actually answers sits next to email and phone everywhere.
  • Trade links out. The export business has different buyers, so it is handed off to its own site rather than diluting the design story.

Where it landed

Both directions are fully built and deployable. Neither is finished until real project photography replaces the stock placeholders, and that single dependency shaped the recommendation: the gallery wins once the photos exist; until then, the agency flow carries the story with the one real render the practice has. Because both share one content model, switching later is a deployment, not a rebuild.

Project imagery, awards and client logos in the builds are placeholders pending the client's assets. The studio figures in Direction B come from the client's existing site and are pending verification.