Friday, August 29, 2025

03 camera Lightings


Verge3d + Blender: Interactive Table (web 3d/vr) — Step‑by‑step Student Guide

A continuation of the Verge3D and Blender interactive table project. This session guides students through locating their app folder, replacing the default Blender file with a provided model, exporting the updated scene using the Verge3D glTF exporter, and running the app in a browser for initial testing. The setup prepares the project for adding textures, lighting, and interactivity in the next session.

Session 3 — Camera, Orbit Target & Lighting

Goal: Make the scene readable with a Sun light, set a clean default camera view, and define the orbit target so Sneak Peek/Web preview opens at the right angle.


1) Hide the Environment Sphere (so it doesn’t block light)

  1. In the Outliner, click the funnel (Filter) icon and enable the monitor (Viewport) and camera (Render) toggles if they’re hidden.
  2. Select your environment sphere (e.g., Sphere_Env).
  3. Turn off the monitor and camera icons to hide it from the viewport and render.

Why: The sphere was blocking the default light, making the table look unlit.


2) Convert the Default Light to a Sun and Tune It

  1. Select the light object (often named Light/Lamp).
  2. In Object Data Properties (light bulb icon), change Type → Sun.
  3. Adjust Rotation to aim the sunlight:
    • Example values: X = 30°, Y = −20°, Z = 100° (tune as desired).
  4. Set Strength/Energy (try 3–10; if still dim, try 15–30 for a punchier look).
  5. Click Sneak Peek to preview in the browser; iterate rotation/strength until forms read well.

3) Set the Default Camera View (so Sneak Peek opens at your angle)

  1. Press Numpad 0 to enter Camera View.
  2. Choose one method to frame the shot:
    • Method A (one‑shot): View → Align View → Align Active Camera to View (shortcut Ctrl+Alt+Numpad 0). Navigate in the viewport first, then run this.
    • Method B (interactive): Press N to open the right panel → View tab → enable Lock Camera to View. Now navigate (MMB orbit, Shift+MMB pan, scroll zoom) to compose. Disable the lock when done.
  3. Save your .blend (Ctrl+S).

4) Define the Orbit Target for Verge3D

Verge3D can use a target point/object to control where the orbit pivots in the browser.

  1. Select the Camera.
  2. In Camera Properties → Verge3D Settings, find Target:
    • Option A: Pick Object (e.g., your table or a central helper empty).
    • Option B: Set Coordinates manually. Example target: X = 0.0, Y = −0.2, Z = 0.3 (adjust to center your piece).
  3. Save.
  4. Sneak Peek again and ensure orbiting feels centered on the product.

5) Re‑Export & Run (Optional sanity pass)

  1. File → Export → Verge3D glTF and overwrite your app scene file inside interactive-table/.
  2. In App Manager, click your app → Run to confirm the new camera/lighting.

Troubleshooting

  • Still dark? Increase Sun Strength, rotate Sun for better grazing light, or add a subtle Area Light. Consider an HDRI for soft ambient.
  • Wrong starting angle in preview? Realign camera (Ctrl+Alt+Numpad 0) and Save before Sneak Peek.
  • Orbit pivots oddly? Recheck the Verge3D Target (object or coordinates) on the camera.
  • Harsh shadows/noise: Soften with larger light angle (Sun Angle) or add fill.

No comments: