Basanto Studio × Térence Mbu
Design, custom development, a Sanity back office and go-live, for a French-Mexican creative studio that now publishes its own work.
Key Figures
The studio
Basanto Studio is a French-Mexican creative studio working between Mexico City and Paris. They do creative direction, photo and film campaigns, ongoing content and event coverage. 3 partners, 2 cultures, and one line that sums up how they sell: the image is the result, the thinking is the work.
The problem
Their work lived on Instagram. Instagram is where you get discovered, not where you get chosen. A brand about to hand over a campaign wants to see a body of work and understand how the studio operates. It is not going to piece that together by scrolling back through a profile.
The second point goes to the studio's own craft. On Instagram, the platform decides the frame and what gets cut. A studio whose craft is framing was letting someone else reframe its work.
So they needed a site that presents the work as one coherent body, in the 2 languages of their 2 markets. And one the team could feed themselves between 2 shoots, without going back through a developer.
How we worked
4 stages, from framing to handing over the accounts.
| Stage | What happened |
|---|---|
| 1. Framing and visual direction | The studio's identity and its references become a system: palette, type scale, spacing, components |
| 2. Development | The site built page by page on that system. Every decision made once, applied everywhere |
| 3. Sanity and handover | The back office built to measure, then the team trained on video with a written guide in French |
| 4. Go-live and transfer | Domain, performance and accessibility measured, third-party accounts opened in the studio's name |
One rule that held for the whole project
Every piece of information still unknown at the start was pulled out of the code and made editable in a minute. The site could therefore be built before the final content existed, then filled in without rewriting a single page.
We came to Térence to build our studio's website. Once we had walked him through what we needed, he adapted to it and brought ideas of his own to get to the best possible result. Our site is easy to use and fast. Térence was responsive and a good listener. We happily recommend his work.
Baptiste Soulé, co-founder, Basanto Studio
A design that holds for the images it has not seen yet
That is the real difficulty of a creative studio's site. A page is composed around 3 chosen photographs. The site will receive 300, in shapes nobody knows yet, added by someone else.
The usual reflex is to drop each image into a fixed-shape frame and trim whatever sticks out. It produces a flawless grid. It also amounts to publishing your own crop on the client's work: a vertical portrait squeezed into a horizontal slot loses the head and the feet. That is exactly what the studio was leaving behind when it left Instagram. Here, every photograph keeps the proportions it was framed in.
Then there is rhythm. An even grid produces a contact sheet, where everything is equal and nothing gets looked at. So the studio has a per-image setting to push one photograph full width. It is the one control that turns a generated page into a composed one, and it belongs to them.
Everything else sits in a system. Colours, sizes, spacing, margin rhythm: each value is decided once and becomes the site's only source. No component carries a hand-written value. A correction happens in one place and applies everywhere, today as on the day the identity evolves.
Sanity: a back office the team picked up in one session
The site runs on Sanity, a content manager you build to measure rather than adapt. That is what makes it possible to hand over something other than a generic dashboard the client has to translate for themselves.
The team already files its deliveries in 3 folders: photos only, photos and videos, videos only. The back office uses those same 3 folders, with the same names. Creating a project from the right folder pre-fills the format and hides the fields that do not apply: a photo project will never ask for a video link. A project that gets its film 6 months later moves folder in one click, losing nothing.
Every field carries its explanation under its label, in the studio's vocabulary rather than a developer's. Nobody ever has to guess what a field expects.
Handover did not stop at delivery. The team was trained on video, on its own content, and has a written guide in French it can reopen months later. Since then they add their projects, their photographs, their films and both languages themselves, from any time zone.
What the studio does on its own today
Add a project, its photographs and its films. Write both languages. Choose the order of the images and which ones run full width. Publish, unpublish, reorder. No developer, and no invoice.
| Element | Technical choice |
|---|---|
| Architecture | Next.js 16, pre-generated pages: the content is readable by Google without waiting for JavaScript |
| Content management | Sanity, structured around the studio's delivery folders rather than around the database |
| Photographs | Sent at full resolution, converted and resized by the site for every screen |
| Films | Hosted on YouTube, played back in the site's own player, nothing loads before the visitor clicks |
| Two languages | English at the root, Spanish on /es, shared addresses, links between versions readable by search engines |
| Motion | GSAP on scroll, switched off when the visitor has asked their browser for less movement |
| Handover | Video training, a written guide in French, and every account opened in the studio's name |
Two languages set on day one, because they cannot be retrofitted
Spanish was asked for later. The structure was laid on day one. A bilingual site cannot be added afterwards without rewriting everything: it is the kind of decision that costs nothing at the start and a rebuild 6 months in.
The site is fully translated, 375 lines of text per language. Each version points to the other through a real link a search engine can follow. That is the difference between a bilingual site and a site with a language switcher.
The rest sits in details a visitor only notices when they are missing. Switching language does not reset the filter they were reading through. A project keeps the same address in both versions. And the Spanish version is declared Mexican rather than Spanish, because the studio and its clients are.
Performance and accessibility, measured in production
4 pages out of 5 score 100 on performance. The homepage, the heaviest page on the site, is at 95. Accessibility, best practices and technical SEO are at 100. These figures are taken on the live site: anyone can run them again.
This is not an end-of-project tweak. A studio's photographs weigh several megabytes each. Sent as they are, they leave the visitor in front of a blank page and eat into the data plan of anyone looking on a phone. So the site receives the files at full resolution and builds lighter versions itself, in formats recent browsers decode better. Each screen gets the one that matches it. The studio has nothing to compress before sending.
Same logic on the films: nothing loads until the visitor clicks.
On accessibility, 8 greys were raised to the contrast thresholds of the WCAG 2.1 AA standard, without touching the visual direction. Image descriptions are required in the back office, in both languages. On a site whose subject is the image, describing what you show is not optional.
Your work deserves better than someone else's grid
You run a studio, a brand or a creative company. You want a site that shows your work the way you framed it, and that your team keeps alive without going back through a developer. Write to me. Basanto's is live: www.basantostudio.com.



