开云(中国)Kaiyun







    H5游戏制(zhì)作(zuò)
    H5游戏制作(zuò)
    H5游(yóu)戏制作
    H5案例
    H5开发
    扫一扫
    h5定(dìng)制
    h5定制

    回到(dào)顶(dǐng)部(bù)

    H5设计知(zhī)识分(fèn)享:沉浸感界面的设计技(jì)巧

    页面设计 2022年10月26日

    近年(nián)来,沉浸感成为高频(pín)词汇,沉浸式互动游戏、沉浸式密室空间(jiān)、沉浸式(shì)剧场杀、沉(chén)浸式(shì)主题展览等。还出现了一系列沉浸式吃饭、沉浸(jìn)式化妆(zhuāng)等视频,吸(xī)引了大批的用户乐于驻足观看。下面,开云和蓝橙互动就给大家分享一下,沉浸(jìn)感界面设计该怎么做。

     

    一、设(shè)计思路

     

    1、空间(jiān)感

     

    画面一定要(yào)传(chuán)达出有深度的立体的空(kōng)间(jiān)感觉,体现出纵深(shēn)感,给用户一种身处一(yī)个三维立(lì)体的(de)的沉浸空(kōng)间中的错觉。

     

    2、视觉聚焦

     

    看(kàn)展看展,目的只有一个——让用户(hù)看(kàn)作(zuò)品图片,因(yīn)此我们只强调(diào)作品,其他元(yuán)素弱(ruò)化,不能有过多干扰视觉(jiào)的元素。

     

    3、配色

     

    颜(yán)色切记不刺眼、不轻佻。我们后来使(shǐ)用带暖色属(shǔ)性的深棕色,作为墙(qiáng)体颜色,自然朴实又富(fù)有人情味,给用户(hù)第(dì)一感受是一种神(shén)秘(mì)的感觉,更(gèng)有展(zhǎn)厅氛围(wéi)。

     

    4、色(sè)调

     

    整体采用低照(zhào)度(dù)低色温的光,能使(shǐ)人安静(jìng)舒适,适合展馆空间,让作品述说它们的故(gù)事,让人们静静地欣赏(shǎng)。

     

    5、写实(shí)质感

     

    墙体、地板(bǎn)、作品展(zhǎn)示(shì)框、射灯都叠加了写实(shí)的质感(gǎn),还原展厅真实的结(jié)构材(cái)质。

     

    6、灯(dēng)光

     

    我(wǒ)们知道现实(shí)中的艺(yì)术展馆整体环境(jìng)偏暗(àn),会更容易让参观者专注,如果灯光亮度过高(gāo),参(cān)观者(zhě)便会(huì)有视(shì)觉(jiào)的不适感(gǎn)。因此结合(hé)现实(shí)场景(jǐng),我(wǒ)们界面中整体是弱弱的环境光,通过墙顶射灯(dēng)灯光,来提高作品的亮度(dù),从而吸(xī)引用户视觉,加强氛(fēn)围的带入感。

     

    7、细节

     

    作品的立体感和投影、加入现实(shí)展馆中常见(jiàn)的围栏(lán)设计,都还原(yuán)展馆(guǎn)场(chǎng)景的真实感。

     

    二、实例(lì)参(cān)考

     

    调整前:平静冷(lěng)淡,给人一种(zhǒng)严肃(sù)、朴(pǔ)实、神(shén)圣(shèng)的(de)感觉。

     

    沉浸感(gǎn)设计(jì)


    调整(zhěng)后:加入太阳光晕,让画面(miàn)富有活力;同时加入写意的树叶(yè)影子,来增加画(huà)面的生(shēng)命力,呼应(yīng)主题。让用户沉浸在画面里感受(shòu)生命(mìng)。

     

    沉(chén)浸感设计


    总的来说,沉浸感界面(miàn)的设(shè)计(jì)不仅仅只考(kǎo)虑(lǜ)画面(miàn)的美感(gǎn),同时(shí)还要站在受众角度看(kàn)待画面(miàn),善于思考和使(shǐ)用(yòng)多种(zhǒng)不(bú)同(tóng)的(de)技法来表达设计目的。设计来源于生活且高于(yú)生活(huó),善于从生活中找寻灵感参考和(hé)解决(jué)办法。



    联系QQ:2899301896

    开云和蓝橙互动·致力于为企业提供更高效(xiào)的开发(fā)服务

    开云(中国)Kaiyun

    开云(中国)Kaiyun