Interactive build

Company website

Narusec, Explained in Motion

A bilingual company site for Narusec, a Greek software and AI team. It had to establish the wider practice without burying Foni, its voice product, so the interface stays quiet and lets two deliberate animations carry the explanation.

  • Next.js
  • React
  • TypeScript
  • Tailwind
  • Motion
Narusec brand plate with the N mark, orange voice waves, and three voice-pipeline stages

The Brief

Narusec needed one site to do two jobs: establish a credible software practice and make Foni, its Greek voice product, understandable before a call. The easy answer was more service copy. That would explain everything and demonstrate almost nothing.

I kept the company story broad, then made the voice product the sharp end of it. The visual system is restrained: warm neutral surfaces, one orange accent, self-hosted type, and motion only where it reveals how the product behaves.

Let the Site Explain It

The hero reacts to the pointer instead of running a decorative light show on its own. Deeper in the site, the voice pipeline turns a fairly abstract system into three legible beats: listen, decide, speak. Switch scenes below, change the language, or replay the flow.

Two live fragments from the site

SOFTWARE · AI · BUSINESS AUTOMATION

Custom softwareand AI systems that solve problems.

We build software and AI automations after understanding how the business works, where time is lost, and which parts of the operation need better structure.

Adapted from Narusec's production React components. This portfolio version stops its animation offscreen and renders a static final state when reduced motion is enabled.

The exhibit is deterministic and free of microphone prompts. Try Foni live for the real browser call, provider-backed speech pipeline, and per-call cost breakdown.

Built to Stay Out of the Way

The public pages are a bilingual Next.js static export. Most of the site ships as HTML; only the navigation, contact form, spotlight, and product demos hydrate. The Bun voice server runs separately behind the same nginx host, so the website can stay simple even when the product behind it isn't.

  • Greek and English routes are pre-rendered instead of translated after the page loads.
  • Inter and JetBrains Mono are self-hosted and subset from the actual bilingual copy at build time.
  • The live voice demo is split from the page shell and talks to the same media-stream protocol as the phone integration.

The result is still a company site, not a product theatre reel. The difference is that when it claims there is a working voice system behind the page, the page has enough of that system inside it to make the claim concrete.