- Role
- Designer & Developer
- Year
- 2026
- Stack
- Next.js · React · TypeScript
- Status
- Live
Where this lives
BSMetallic is Bram's custom metalwork business in Zoersel. The work ranges from steel-and-glass doors and large window constructions to furniture, railings and smaller one-off pieces. Every commission is different, which made the real project photography the most important content on the site.
I handled both design and development. The goal was not to turn the company into a generic construction brand, but to build a calm, premium frame around the work: enough structure to explain the offer, enough space to let each realisation speak for itself.
The website had to communicate range without becoming a catalogue. A visitor looking for a steel door should immediately recognise the service, while someone interested in a custom cabinet or railing still needs to feel that the same maker can help them.
The second constraint was trust. This is commissioned work in people's homes, so clear contact, real photography, readable project context and a polished mobile experience mattered more than decorative effects.
Finally, the production layer had to be real: a working contact flow, a safe review process, proper metadata and a deployment setup that could keep the site current after launch.
Quiet design, strong craftsmanship
The interface stays deliberately restrained so the project photography, materials and details remain the focus.
Photography leads
Large, rounded image frames and deliberate crops give the real metalwork priority throughout the site.
Editorial, not industrial
Cormorant Garamond brings character to headings; Manrope keeps navigation, labels and body copy precise and accessible.
From overview to detail
A central project model drives the realisations overview, dynamic detail pages, galleries and related-project navigation.
The same hierarchy at every size
The editorial grids collapse cleanly, while the compact mobile header keeps every page and Instagram within reach.
Real projects, not stock imagery
A selection of the photography that shapes the live website and its project portfolio.
A small site with complete production flows
The visible experience stays simple; the implementation behind contact, reviews and publishing does the heavier work.
Dynamic realisation architecture
Seven project routes are generated from one typed data source, including galleries, multi-realisation groupings and deterministic related-project cards.
Production contact flow
The contact form validates and escapes input server-side, uses a honeypot, and sends through Resend with the visitor address as reply-to.
Moderated customer reviews
Submissions never publish immediately. Bram receives signed approve/reject links; approval strips the email and writes the public review through the GitHub Contents API, triggering the normal deployment flow.
SEO and production polish
Unique metadata, canonical URLs, Open Graph data, sitemap and robots routes support the custom-domain Vercel deployment.
A complete digital home for BSMetallic
The result is a focused commercial website that makes the work understandable without over-explaining it. Visitors can move from the homepage into individual realisations, compare related projects and contact Bram without losing the visual thread.
The finished build combines the parts a small business site actually needs: responsive presentation, a maintainable project model, direct Instagram access, reliable email delivery, moderated reviews and a production SEO baseline on a custom domain.
For AZEC Digital, BSMetallic is a complete client case: brand-sensitive design and frontend craft, backed by the less visible server and publishing flows needed to keep the site useful after launch.
BSMetallic is live at bsmetallic.com. The case is a good example of the kind of client work I like most: a tangible craft, strong source material and a digital product that stays quiet enough to let both speak.