3D website design and development

Interactive websites

An interactive website answers what the visitor does. On this site, the “What I do” cards turn on a wheel as you scroll, each project locks into place on a circuit board that powers up, and in the stack you pick a project to watch the current run to every skill it used. Sound is part of it: a quiet cue for each action, behind one switch.

Scroll-driven storytelling (scrollytelling)

Scrollytelling turns a page into a sequence of scenes, played by the scroll. The classic side of this portfolio is one: the camera runs in through the fog to my name, the motto rolls into place as neon blocks, the projects are queued down a street, and after the last one the camera dashes down the street and turns the corner into the next section.

Immersive 3D in the browser: WebGL and Three.js

Room 404 is a building at night to walk through room by room: a hall, a workshop, a room for the projects, an archive and a roof, with rain on the windows and lightning over the city. It is built with Three.js and React Three Fiber, with models made in Blender, and reads the same content as the rest of the site, so a new project appears in both without touching the code. It adapts to the device it runs on, so the walk stays smooth on a phone.

3D website examples

Every example below is on this site, a click away:

• The arrival: the camera runs in through a fog city drawn live in the browser, with the dot of the i as the ember that leads the way down.
• My philosophy: three neon signs of lettered glass blocks that roll toward you as you scroll, and turn to the pointer.
• Selected work: projects as windows on circuit boards, queued down the street one city block apart.
• The stack: a tower in the fog, one floor per layer of a system and one lit window per skill.
• Room 404: the whole portfolio as a building to walk through.

Fast on a phone, readable by search engines

A 3D site still has to load on a phone and still has to be found. This one has its own pacing for touch, a calmer version for visitors who ask their browser for reduced motion, and a plain, readable page for every address, so search engines and language models read all of it without running a line of script. See the case study for how it is built.

Prices

Clients in Tunisia (TND)

Europe (EUR)

Rest of the world (USD)

Prices for clients in Tunisia, clients in Europe, clients outside Tunisia and Europe. Each range is where most projects of that kind land; you get a written quote after a first call about what you need. Domains, hosting, paid services and store fees are paid to their providers, in your name.

Proof

• This Portfolio: This site: a fog city drawn live in the browser, and Room 404, a building to walk through in 3D.

Questions

How much does a 3D website cost?

Most 3D or scroll-driven sites fall in 3,000 – 7,500 TND for clients in Tunisia, €1,500 – €4,500 in Europe and $1,650 – $5,000 elsewhere. What moves the price is the number of scenes and whether they need models made for them. You get a written quote after a first call.

Do 3D websites hurt SEO?

They can, when the whole page lives inside a canvas crawlers cannot read. The fix is to serve every address as plain HTML as well. This site is a WebGL scene, and each of its pages also exists as a readable page with its own title, description and structured data: that is what search engines index.

Do 3D websites work on phones?

Yes, when they are built for phones from the start. This site paces its scenes for a thumb and draws less on a phone’s screen, and Room 404 adapts its detail to the device so the walk stays smooth.

What about visitors who get motion sickness?

Their browser can ask for reduced motion, and this site then shows a calm version of every section, with the same content and nothing moved by the scroll.

Tell me about your project

Say what it is for, what you have already and by when. I reply with my questions, or with a time for a first call.

• Email: aliayditn02@gmail.com
• Phone: +(216) 44 674 320