交互時(shí)代是國(guó)內(nèi)唯一一家擁有設(shè)計(jì)公司的育才基地，因此我們擁有十分先進(jìn)的設(shè)計(jì)理念及設(shè)計(jì)技術(shù)，而在UI設(shè)計(jì)方面，更是擁有十多年的經(jīng)驗(yàn)，領(lǐng)先于行業(yè)前端，而一直有關(guān)注UI設(shè)計(jì)行業(yè)的朋友們應(yīng)該都了解，產(chǎn)品的一個(gè)重要目標(biāo)就是留住用戶(hù)，而想要留住用戶(hù)就要給用戶(hù)良好的體驗(yàn)。因此，今天交互時(shí)代就與大家分享一下，我們應(yīng)該如何利用框架的界面提升產(chǎn)品的用戶(hù)體驗(yàn)。

在我們?yōu)g覽各種頁(yè)面的時(shí)候，基本上第一時(shí)間是不會(huì)想到加載速度這一回事的，我們通常會(huì)認(rèn)為操作之后會(huì)立刻給我們回潰所以曾經(jīng)有許多UI設(shè)計(jì)都沒(méi)有加入等待加載這一元素。

網(wǎng)絡(luò)并不總是那么快，頁(yè)面也不總是那么順暢，特別是在頁(yè)面中有比較大的圖片或者設(shè)計(jì)元素的時(shí)候，加載速度必然會(huì)變慢。如果我們不能縮短加載時(shí)間，那么只能讓用戶(hù)在等待的時(shí)候心情更好一點(diǎn)了。此時(shí)，我們就可以用預(yù)加載信息來(lái)吸引用戶(hù)的注意力，比如框架界面和圖片占位符。比起轉(zhuǎn)圈的加載提示，框架界面能建立對(duì)內(nèi)容的預(yù)期，減少認(rèn)知的負(fù)擔(dān)。

交互時(shí)代給大家的幾點(diǎn)建議：

框架界面不必很搶眼。只需要凸顯必要的信息，比如段落結(jié)構(gòu)。Facebook的灰色占位符就是個(gè)好例子——它加載時(shí)使用了元素模板，讓用戶(hù)熟悉正在加載的內(nèi)容的整體結(jié)構(gòu)。注意框架界面中的圖片和線框并沒(méi)有很大區(qū)別。

對(duì)于加載中的圖片，我們可以用主色填充一個(gè)圖片的空間。Medium有一個(gè)很棒的圖片加載效果。首先載入一個(gè)小的模糊圖片，然后慢慢轉(zhuǎn)變成大圖。

真正的圖片出現(xiàn)之前，你可以看到模糊圖片填充的占位符。

如此，就好像一張圖片淡化進(jìn)入用戶(hù)的眼中，給用戶(hù)造成一種柳暗花明又一村的體驗(yàn)。這就是交互時(shí)代給大家分享的關(guān)于利用框架界面提供良好用戶(hù)體驗(yàn)的方式，如果大家想要知道更多關(guān)于UI設(shè)計(jì)的知識(shí)，就多多關(guān)注交互時(shí)代的官網(wǎng)吧。

請(qǐng)聯(lián)系網(wǎng)站客服，了解詳細(xì)的優(yōu)惠課程信息~

優(yōu)質(zhì)、權(quán)威、便捷、省心