su7 的页面好炫酷,要用什么技术才能写成这样 - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
zangzang
V2EX    问与答

su7 的页面好炫酷,要用什么技术才能写成这样

  •  
  •   zangzang 2024-03-27 14:01:34 +08:00 21648 次点击
    这是一个创建于 613 天前的主题,其中的信息可能已经有所发展或是发生改变。
    第 1 条附言    2024-03-27 15:02:36 +08:00
    https://gamemcu.com/su7/
    网址
    但是这个好炫酷。
    写成这样的程序员值多少钱呢
    110 条回复    2024-03-29 15:02:47 +08:00
    1  2  
    zangzang
        1
    zangzang  
    OP
       2024-03-27 14:02:18 +08:00
    gainsurier
        2
    gainsurier  
       2024-03-27 14:08:13 +08:00 via iPhone
    https://gamemcu.com/su7/

    重贴一下链接
    oneKnow
        3
    oneKnow  
       2024-03-27 14:08:52 +08:00
    F12 看了一下,用 threejs 写的
    ynxh
        4
    ynxh  
       2024-03-27 14:11:40 +08:00
    这 b 站某 up 主做的,不是官方的
    zangzang
        5
    zangzang  
    OP
       2024-03-27 14:11:43 +08:00
    @gainsurier #2 感谢
    tagtag
        6
    tagtag  
       2024-03-27 14:13:13 +08:00
    看请求是包含了好多 glb 格式的 3D 模型,然后用 Three.js (插件检测到了这个) 之类的库渲染,核心应该是这样。
    zangzang
        7
    zangzang  
    OP
       2024-03-27 14:13:46 +08:00
    zangzang
        8
    zangzang  
    OP
       2024-03-27 14:19:00 +08:00
    怎么还不能添加附言呢
    jojo0830
        9
    jojo0830  
       2024-03-27 14:22:04 +08:00
    @tagtag 什么插件?
    tagtag
        10
    tagtag  
       2024-03-27 14:24:20 +08:00   1
    @jojo0830 Wappalyzer
    Saulee
        11
    Saulee  
       2024-03-27 14:25:54 +08:00
    确实很酷,居然不是官方的
    evada
        12
    evada  
       2024-03-27 14:34:41 +08:00
    但是感觉在这个页面鼠标变笨重了
    LLLeo
        13
    LLLeo  
       2024-03-27 14:41:27 +08:00
    居然不是官方的 这个是用爱发电吗
    sunziren
        14
    sunziren  
       2024-03-27 14:44:57 +08:00
    雀食牛逼
    momobear
        15
    momobear  
       2024-03-27 14:59:44 +08:00
    强烈请求开源看看
    QWE321ASD
        16
    QWE321ASD  
       2024-03-27 15:08:20 +08:00
    确实强...
    calano
        17
    calano  
       2024-03-27 15:08:32 +08:00
    评论区阿里云都跑出来了
    itechify
        18
    itechify  
    PRO
       2024-03-27 15:09:54 +08:00 via Android
    好酷
    LHRUN
        19
    LHRUN  
       2024-03-27 15:10:20 +08:00
    我怎么进不去
    cyberCat
        20
    cyberCat  
       2024-03-27 15:16:57 +08:00
    https://threejs.org/
    threejs 就是做这种,看看官方 demo 更有意思。
    zangzang
        21
    zangzang  
    OP
       2024-03-27 15:21:46 +08:00
    @LHRUN #19 你是不是内网 。用热点试试
    qiqi77slh
        22
    qiqi77slh  
       2024-03-27 15:33:47 +08:00
    右上角有制作者啊
    skydcnmana
        23
    skydcnmana  
       2024-03-27 15:43:05 +08:00
    显示器竖着的,结果它这页面还强行横过来。。。只能歪着头看了
    HTML001
        24
    HTML001  
       2024-03-27 15:50:22 +08:00
    olaloong
        25
    olaloong  
       2024-03-27 15:56:02 +08:00
    确实酷
    okrfuse
        26
    okrfuse  
       2024-03-27 15:58:04 +08:00
    哇,酷
    williamherry
        27
    williamherry  
       2024-03-27 16:01:30 +08:00
    确实帅,见过最帅的页面了
    liangguan5
        28
    liangguan5  
       2024-03-27 16:03:21 +08:00 via iPhone
    我记得这个作者还弄过一个水墨杭州的网页,也超棒,估计 10 年前了吧
    zw1027
        29
    zw1027  
       2024-03-27 16:03:22 +08:00
    汽车跑起来的时候我的风扇也起飞了,正好呢
    asche910
        30
    asche910  
       2024-03-27 16:04:33 +08:00
    太酷了
    body007
        31
    body007  
       2024-03-27 16:07:11 +08:00
    下面最右边有 B 站视频链接。点进去可以看到作者解说。
    RLinux
        32
    RLinux  
       2024-03-27 16:09:35 +08:00
    6 啊
    fishlium
        33
    fishlium  
       2024-03-27 16:13:30 +08:00
    我感觉模型建模更重要
    nomytwins
        34
    nomytwins  
       2024-03-27 16:29:03 +08:00
    这是 threejs 的 3d 引擎,制作一台车建模+材质 估计要一个月
    nomytwins
        35
    nomytwins  
       2024-03-27 16:30:31 +08:00
    @nomytwins 还可以加开门动画,内饰全景,具体可以参考现代汽车的 720 全景看车,我们制作过几台车
    edgm
        36
    edgm  
       2024-03-27 16:30:46 +08:00   6
    日清的网站也不错
    https://www.nissin.com/jp/
    leyliu
        37
    leyliu  
       2024-03-27 16:32:33 +08:00   1
    @skydcnmana 巧了,突然锻炼了颈椎
    hafuhafu
        38
    hafuhafu  
       2024-03-27 16:33:27 +08:00
    大制作
    ZzoxAA
        39
    ZzoxAA  
       2024-03-27 16:38:55 +08:00
    @edgm 这个确实酷
    Cloud9527
        40
    Cloud9527  
       2024-03-27 16:47:02 +08:00
    厉害啊
    GGboom2233
        41
    GGboom2233  
       2024-03-27 16:56:27 +08:00
    厉害
    LingFengXiYu
        42
    LingFengXiYu  
       2024-03-27 16:56:28 +08:00
    three.js
    roding
        43
    roding  
       2024-03-27 17:03:33 +08:00
    是很叼
    tim9527
        44
    tim9527  
       2024-03-27 17:10:24 +08:00
    好帅!
    h9VZ3hilI68DVl36
        45
    h9VZ3hilI68DVl36  
       2024-03-27 17:20:29 +08:00
    太帅了
    lilei2023
        46
    lilei2023  
       2024-03-27 17:22:34 +08:00
    这个主要功劳我觉得是设计(建模相关),其次才是前端(技术人员)
    lilei2023
        47
    lilei2023  
       2024-03-27 17:23:25 +08:00
    @edgm 这个网站差点没把我转晕了
    semiconlon
        48
    semiconlon  
       2024-03-27 17:26:12 +08:00
    milkzizi
        49
    milkzizi  
       2024-03-27 17:27:22 +08:00
    长按还能跑,动画很流程,牛的
    fzls
        50
    fzls  
       2024-03-27 17:27:40 +08:00
    是有点酷炫的
    Guidoo
        51
    Guidoo  
       2024-03-27 17:27:42 +08:00
    ![]( )


    threejs 做的
    Jarme
        52
    Jarme  
       2024-03-27 17:50:35 +08:00   1
    我感觉模型建模更重要,建模值钱,前端就是一个容器以及交互
    nuofei
        53
    nuofei  
       2024-03-27 18:02:06 +08:00 via Android
    @edgm 好牛
    zsk425
        54
    zsk425  
       2024-03-27 18:10:09 +08:00
    很酷
    Gimorocun
        55
    Gimorocun  
       2024-03-27 18:29:31 +08:00
    webGL 技术, 在前端渲染模型
    me1onsoda
        56
    me1onsoda  
       2024-03-27 18:40:29 +08:00
    这个不是程序员牛逼,是建模的人牛逼
    SuspectX
        57
    SuspectX  
       2024-03-27 18:41:58 +08:00 via Android
    Threejs 官网里不少案例就很炫酷。
    imsuxp
        58
    imsuxp  
       2024-03-27 19:11:21 +08:00
    @ynxh 这雷总不招聘一波?
    KevinChan
        59
    KevinChan  
       2024-03-27 19:13:22 +08:00
    Safari 打开是宋体?
    7gugu
        60
    7gugu  
       2024-03-27 19:17:28 +08:00
    帅啊
    matrix1010
        61
    matrix1010  
       2024-03-27 19:41:57 +08:00
    matrix1010
        62
    matrix1010  
       2024-03-27 19:53:20 +08:00
    至于值多少钱,sketchfab 已经被 Epic 收购了。模型不是问题,现成模型很多。WebGL 技术才是核心
    twofox
        63
    twofox  
       2024-03-27 20:08:43 +08:00
    确实很酷,C4D 、blender 启动!

    哦,不好意思。。我不会 webGL
    twofox
        64
    twofox  
       2024-03-27 20:14:32 +08:00
    点 B 站看了一下,这个 UP 主我已经关注了
    lawler
        65
    lawler  
       2024-03-27 20:35:57 +08:00
    https://alpha.sougen.co/hub

    元神,启动。
    shenhualv7
        66
    shenhualv7  
       2024-03-27 21:18:25 +08:00 via Android
    这不招安雷子真是不懂事了
    Aierk
        67
    Aierk  
       2024-03-27 22:09:15 +08:00   1
    放一个做的也很好的,https://exp-gemini.lusion.co/style
    LHRUN
        68
    LHRUN  
       2024-03-27 22:13:23 +08:00   2
    这才是我梦想中的前端, 跟这一比我做的是什么东西. 麻了
    HllY0HDby2JDeDC0
        69
    HllY0HDby2JDeDC0  
       2024-03-27 22:17:06 +08:00
    有点东西.
    leeum
        70
    leeum  
       2024-03-27 22:23:44 +08:00
    Wikey
        71
    Wikey  
       2024-03-27 23:01:32 +08:00
    imsoso
        72
    imsoso  
       2024-03-27 23:14:08 +08:00
    @edgm 大晚上的看饿了
    Rorysky
        73
    Rorysky  
       2024-03-28 00:15:29 +08:00
    必然基于 opengl 甚至使用的 3js
    lucifer518
        74
    lucifer518  
       2024-03-28 00:58:38 +08:00
    卧槽好酷炫
    adimn
        75
    adimn  
       2024-03-28 09:25:45 +08:00
    @oneKnow #3 有点不跟手
    marding
        76
    marding  
       2024-03-28 09:35:16 +08:00
    好卡呀...半天没加载出来
    p1gd0g
        77
    p1gd0g  
       2024-03-28 09:41:33 +08:00
    照这么说 unity 转 h5 是不是更好看
    Huelse
        78
    Huelse  
       2024-03-28 09:42:34 +08:00
    作者很强 WebGL 水平一流
    shidapi
        79
    shidapi  
       2024-03-28 09:43:57 +08:00
    牛逼
    MENGKE
        80
    MENGKE  
       2024-03-28 10:15:34 +08:00
    刚发现和作者在一个群里,确实厉害,之前的杭州水墨画也是他做的
    BUHeF254Lpd1MH06
        81
    BUHeF254Lpd1MH06  
       2024-03-28 10:21:03 +08:00
    这跟前端关系不大了已经
    Leeeeex
        82
    Leeeeex  
    PRO
       2024-03-28 10:21:25 +08:00
    我也分享一个 https://y-n10.com/
    yiranyibaozha
        83
    yiranyibaozha  
       2024-03-28 10:36:49 +08:00
    代码技术其实还好,主要是建模吧
    thinkershare
        84
    thinkershare  
       2024-03-28 10:41:36 +08:00
    不值钱,这种玩意核心就不是程序员。
    UIXX
        85
    UIXX  
       2024-03-28 10:52:21 +08:00
    我是做工业设备的,其实业界很多产品都是做成类似的展示,包括色盘、透视、导航、拆装零部件实渲动画。
    一般的技术栈是 C4D/Blender 建模+Three/babylon 前端展示。也有一些公司专门做这个,比如之前有人问过的 https://www.jig.space/
    Tink
        86
    Tink  
    PRO
       2024-03-28 10:55:18 +08:00
    咋建模的啊
    gdrk
        87
    gdrk  
       2024-03-28 11:03:05 +08:00
    模型难搞啊,都不是一个行当了
    windmoonwind
        88
    windmoonwind  
       2024-03-28 11:21:38 +08:00
    @ynxh 很炫,但做这个是需要官方提供模型的,这些年汽车厂家的官网 3D 看车功能都是 Three.js 或者其他 WebGL 实现的,前提就是要基于官方提供的模型渲染。

    这个车主到现在还没被小米发传票,更证明了他和厂家必然有内情,或者说其实这就是小米的一波营销...
    echoyangjx
        89
    echoyangjx  
       2024-03-28 11:29:31 +08:00
    @edgm 这个创意不错
    leaflxh
        90
    leaflxh  
       2024-03-28 11:31:28 +08:00
    浏览器里做游戏系列

    不是传统的 css 样式就能做出来
    anoyi
        91
    anoyi  
       2024-03-28 11:31:54 +08:00
    很早前就有这个页面的开源项目了,不过汽车不是 SU7
    xzh654321
        92
    xzh654321  
       2024-03-28 11:35:08 +08:00
    有一说一,用不着 webGL ,three 里都是现成的,拿模型一加就行了,模型也不复杂,可能那个流线稍微有点难度
    qinfengge
        93
    qinfengge  
       2024-03-28 11:47:05 +08:00
    为啥我 chrome 卡的要死,换 edge 就好了?调用显卡了?
    HeyWeGo
        94
    HeyWeGo  
       2024-03-28 11:48:47 +08:00
    需要建模,材质的可以联系哈,之前帮人弄过
    BeautifulSoap
        95
    BeautifulSoap  
       2024-03-28 11:54:01 +08:00
    threejs 官网的示例里有挺多类似的,不过小米这个动效更加自然顺滑

    https://www.lamborghini.com/en-en/3d
    https://renaultespace.littleworkshop.fr/
    hikarugo
        96
    hikarugo  
       2024-03-28 12:33:51 +08:00
    都说隔行如隔山,其实行内隔得也挺大的,哈哈,用过 three.js 的可能只要动画稍微处理一下就行了,什么模型贴图都是给啥用啥,前端是这个流水线最后也是权重最低的一环。
    lefer
        97
    lefer  
       2024-03-28 12:50:58 +08:00
    太强大了。唯一的问题是我的笔记本点开后风扇狂转。
    ShadowPower
        98
    ShadowPower  
       2024-03-28 12:58:07 +08:00
    技术方面还好,美术方面比较厉害……
    xqk111
        99
    xqk111  
       2024-03-28 13:34:29 +08:00
    jianguoni
        100
    jianguoni  
       2024-03-28 13:36:16 +08:00
    @windmoonwind 同感
    1  2  
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     2785 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 30ms UTC 14:04 PVG 22:04 LAX 06:04 JFK 09:04
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86