// v2-home.jsx — Home page function HomePage2({ heroVideo, workLayout, onNavigate, onOpenProject, onContact }) { return (
); } // ── STAT BAND — credibility (computed from the real catalog) ── function StatBand2() { const sectors = new Set(PROJECTS.map(p => p.cat)).size; const stats = [ { v: "50", s: "+", l: "Projects visualized" }, { v: "10", s: "+", l: "Countries delivered to" }, { v: sectors, s: "", l: "Sectors covered" }, { v: "100", s: "%", l: "In-house, Lviv" }, ]; return (
By the numbers
{stats.map((st, i) => (
{st.v}{st.s} {st.l}
))}
Trusted by
{["KonzeptB", "Miviso", "3DRenderIT", "Concrete Bureau"].map(c => ( {c} ))} & several private clients
); } // ── HERO ─────────────────────────────────────────────────────── function Hero2({ videoUrl, onContact, onNavigate }) { const videoRef = React.useRef(null); React.useEffect(() => { const v = videoRef.current; if (!v) return; v.muted = true;v.volume = 0;v.defaultMuted = true; }, [videoUrl]); return (
{videoUrl ? :
}

Architecture, before it exists.

Photoreal stills, film and real-time experiences for architects and developers who need a building to be believed in — and bought — long before it is built.

Start a project { e.preventDefault(); onNavigate && onNavigate("services"); }}> View pricing
); } // ── MANIFESTO ────────────────────────────────────────────────── function Manifesto2({ onNavigate }) { return (
The studio

A render shows a building.
An image sells the idea of living in it.

Obsidian Studio works at the point where architecture meets its audience. We build light, weather, material and mood around your design — so a jury, an investor or a buyer doesn't evaluate a project. They want it.

Stills, animation and interactive Unreal Engine walkthroughs, produced end-to-end in-house in Lviv for clients across Europe.

onNavigate("about")}>About the studio
); } // ── SELECTED WORK — three layouts (cinematic · uniform · editorial) ── function SelectedWork2({ layout = "cinematic", onNavigate, onOpenProject }) { const slugs = ["terrace-steps", "azure-wave", "wave-promenade", "timber-marble"]; const works = slugs.map((s, i) => { const p = getProject(s); return { slug: s, id: String(i + 1).padStart(2, "0"), name: p.name, type: p.services[0].toLowerCase().startsWith(p.cat.toLowerCase()) ? p.cat : `${p.cat} · ${p.services[0]}`, place: p.year, place2: `${p.loc} · ${p.year}`, cover: p.cover, video: p.video }; }); return (
Selected work

Architecture made believable in light, weather and material — a decade before the crane arrives.

 {layout === "cinematic" &&
{works.map((w) => )}
} {layout === "uniform" &&
{works.map((w) => )}
} {layout === "editorial" &&
{works.map((w, i) => )}
}
onNavigate("projects")}>View all work
); } // ── SECTORS — hairline index table ───────────────────────────── function Sectors2({ onNavigate }) { const rows = [ { n: "01", t: "Residential", d: "Private houses to large-scale complexes" }, { n: "02", t: "Commercial", d: "Offices, retail and mixed-use" }, { n: "03", t: "Hospitality", d: "Hotels, restaurants, spas and resorts" }, { n: "04", t: "Public", d: "Cultural, civic and infrastructure" }, { n: "05", t: "Interactive", d: "Real-time Unreal Engine experiences" }]; return (
What we visualize
{rows.map((r, i) => )}
); } // ── PROCESS ──────────────────────────────────────────────────── function Process2({ onNavigate }) { const steps = [ { n: "01", t: "Vision", d: "A deep read of the project — drawings, models, marketing goals — until both sides see the same final image." }, { n: "02", t: "Atmosphere", d: "Light, weather, materials and camera language. The small, deliberate details that make a frame feel inhabited." }, { n: "03", t: "Creation", d: "Photoreal stills and film, refined through several internal quality passes before anything reaches you." }, { n: "04", t: "Delivery", d: "Final materials, formatted for the boardroom, the sales floor and the printing house." }]; return (
Method

Four movements,
one standard.
{steps.map((s, i) =>
{s.n}

{s.t}

{s.d}

 )}
onNavigate("about")}>The full method
); } // ── TESTIMONIALS ─────────────────────────────────────────────── function Testimonials2() { const quotes = [ { q: "Obsidian turned our concept drawings into images our clients fell for before ground was even broken. The light, the mood — that's the difference between showing a building and selling one.", n: "Laurenz", c: "KonzeptB" }, { q: "As a studio ourselves, we're hard to impress. Obsidian's frames hold up at any crop — the craft in the materials and lighting is genuinely rare.", n: "Marko", c: "3DRenderIT" }, { q: "Fast, precise and quietly obsessive about detail. Every round came back better than we asked for — and always on time.", n: "Philip", c: "Miviso" }, { q: "They read the architecture the way we do. The visuals didn't just document our design — they gave it atmosphere and made the jury believe in it.", n: "Alex", c: "Concrete Bureau" }, ]; return (
Client voices

Trusted where it
matters most.
{quotes.map((t, i) => (
{t.q}
{t.n} {t.c}
))}
); } // ── CLOSING ──────────────────────────────────────────────────── function Closing2({ onContact }) { return (
New projects — 2026

Let's make your next
unbuilt building unforgettable.

Start a project { e.preventDefault(); location.hash = "#/services"; }}> See pricing & packages
); } Object.assign(window, { HomePage2, StatBand2, Testimonials2 });