ASR-3D-UI 原版作品已接入

3D空间展示

当前页面直接接入了该项目中的 3D Overlay 作品(非 iframe),可在站内体验鼠标视差、实时字幕流和参数控制面板。

ASR-3D-UI--Windows(作品直连版)

来源分支:codex/access-the-specified-chatgpt-conversation

Unity / Unreal 视觉预览
3D Glass Overlay + Realtime ASR
Live
WS
120ms
Realtime ASR Overlay
Local • Streaming • Punctuation
92%
35
Visual energy
auto‑glow
Transcript (stream)
ok so today we ship the realtime overlay and it has to feel expensive…
移动鼠标看 3D 视差(Windows 悬浮 HUD 的灵魂就是这个细节)
参数面板
Design knobs
Device
桌面推荐 Unity Overlay;移动端更像 PiP/系统浮窗。
Accent color
在 Unity 里把它当作主光源色(emission),全局统一。
Background blur
玻璃感很关键:18~24 最稳。
Glass opacity
高级感区间:0.55~0.68。
3D depth
漂浮而非贴屏:8~16 更不容易超出展示框。
Font size
Keyword highlight
关键词高亮让 UI 更像“理解你”的助手。
Auto hide on silence
静音时呼吸式淡出。
Windows 桌面悬浮窗 · Unity 落地骨架
  1. ASR 本地服务(Python/Rust)通过 WebSocket 推送字幕帧 JSON。
  2. Unity 作为 Overlay 客户端,透明窗口 + AlwaysOnTop 渲染 HUD。
  3. 鼠标穿透按需开启:要可点击就别全局穿透。
Unity C#(透明 + 置顶)
using System;
using System.Runtime.InteropServices;
using UnityEngine;

public class TransparentWindow : MonoBehaviour
{
    [DllImport("user32.dll")] private static extern IntPtr GetActiveWindow();
    [DllImport("user32.dll")] private static extern int GetWindowLong(IntPtr hWnd, int nIndex);
    [DllImport("user32.dll")] private static extern int SetWindowLong(IntPtr hWnd, int nIndex, int dwNewLong);
    [DllImport("user32.dll")] private static extern bool SetWindowPos(IntPtr hWnd, IntPtr hWndInsertAfter,
        int X, int Y, int cx, int cy, uint uFlags);

    const int GWL_EXSTYLE = -20;
    const int WS_EX_LAYERED = 0x80000;
    const int WS_EX_TRANSPARENT = 0x20;
    static readonly IntPtr HWND_TOPMOST = new IntPtr(-1);

    void Start()
    {
        var hwnd = GetActiveWindow();
        var exStyle = GetWindowLong(hwnd, GWL_EXSTYLE);
        exStyle |= WS_EX_LAYERED;              // 透明层
        exStyle |= WS_EX_TRANSPARENT;          // 鼠标穿透(可选)
        SetWindowLong(hwnd, GWL_EXSTYLE, exStyle);
        SetWindowPos(hwnd, HWND_TOPMOST, 0, 0, 0, 0, 0x0001 | 0x0002); // NOSIZE|NOMOVE
    }
}
Unity WebSocket(示例)
using WebSocketSharp;

public class WsClient
{
    WebSocket ws;

    public void Start()
    {
        ws = new WebSocket("ws://127.0.0.1:8000");
        ws.OnMessage += (_, e) =>
        {
            // parse JSON -> enqueue -> update TextMeshPro on main thread
            UnityEngine.Debug.Log(e.Data);
        };
        ws.Connect();
    }
}
质感强化
  • Bloom + Color Grading
  • Shader Graph:玻璃 + Fresnel 边缘高光
  • confidence/energy → 动态控制 Emission 强度