Fig. 01 — Product · Web & mobile
Pixel
NFC business cards: one tap to share your contact, one platform for everything else.
- Role
- CTO & sole developer
- Period
- 2025 — present

By the numbers
- commits on the web platform
- 1,800+
- Prisma data models
- 76
- API routes, 32 of them for mobile
- 95
- automated tests
- ~4,800

01The card design changes as you scroll 
02A phone moves up to the card 
03Tap: a notification appears 
04The contact card is saved
§ 01
The product
PIXEL sells NFC business cards in PVC or metal (gold, rose gold, silver, black). Each card is linked to a digital profile: hold it near any iPhone or Android phone and the profile opens or the contact is saved. No app is needed on either side.
The main market is Saudi Arabia, so everything is bilingual English / Arabic. Individuals buy a card and can subscribe to PIXEL Connect to receive the details of people they meet. Companies get a B2B portal to manage employees, order cards in bulk and centralise their leads.
§ 02
My role
I'm the CTO and the only developer. I built PIXEL from scratch: the web platform (Next.js, Prisma, custom authentication, B2B, payments, infrastructure, a 3D landing page), then the iOS / Android app and its API.
§ 03
What I built
- A card editor with a live 3D preview, public profiles and drag-and-drop links.
- Sharing by NFC or QR code through single-use links that expire after 10 minutes.
- PIXEL Connect: a contact-back form, lead management and follow-up.
- A company portal: employees, org units and roles, a permission audit log, exports.
- A full shop: cart, discount codes, Moyasar payments (Apple Pay, Google Pay), OTO shipping, order tracking.
- Automatic PDF/X-4 CMYK print files for the card printer.
- An Expo app: cards, contacts, AI business-card scanning, QR sharing, Face ID lock.
- Nine scheduled jobs: renewals, stuck payments, daily digests, file clean-up.
§ 04
Technical challenges
- A scroll-driven 3D landing page: the card (WebGL) turns through six designs, a phone rises and the card taps it. The phone is HTML, re-aligned with the 3D scene every frame.
- Arabic printing: opentype.js placed Arabic vowel marks incorrectly. Printing now uses HarfBuzz compiled to WebAssembly, the same engine Chrome uses, so the PDF matches the on-screen preview exactly.
- Mobile API security: tokens separated from the web by a strictly verified audience, rotating refresh tokens that revoke the session on reuse, 404 instead of 403 so nothing leaks.
- AI card scanning (Claude): ten synthetic test cards, measured cost, and prompt caching that brings it down to $0.0072 per scan (-38%).
- An audit culture: a first audit rated the system "fragile". After the fixes, the pre-launch audit found no critical issues, and 22 guard tests check the architecture rules on every build.
- Deployment: builds on CI, migrations checked against a real Postgres, post-deploy smoke tests with automatic rollback.
§ 05
Stack
- Next.js 16
- React 19
- TypeScript
- PostgreSQL
- Prisma
- React Three Fiber
- Expo
- React Native
- Claude API
- Moyasar
- S3
- Sentry
- PostHog
- Jest
- Playwright
- GitHub Actions
- PM2
- nginx
- Cloudflare



Next project
Probook →A product to build, a contract, or just a question? Write to me, I reply quickly.
Let's work together