Web開(kāi)發(fā)社區(qū)有著大量的交互式設(shè)計(jì)輕松解決方案。雖然現(xiàn)在大多數(shù)網(wǎng)站都能夠做到交互性了，但是我們需要不斷向前、創(chuàng)新。我們很容易將注意力集中到編碼方面，但是有時(shí)候不同屏幕尺寸的實(shí)際設(shè)計(jì)考慮卻往往被忽視。
很多交互式設(shè)計(jì)學(xué)習(xí)資料都談到了基礎(chǔ)的方面，比如利用桌面的多余空間，使手機(jī)上的顯示更簡(jiǎn)單。然而，很多東西沒(méi)有超出這些基礎(chǔ)知識(shí)。隨著各種尺寸屏幕的出現(xiàn)，我們需要進(jìn)一步思考設(shè)計(jì)和用戶體驗(yàn)這些方面。
1. 桌面
大多數(shù)用戶體驗(yàn)原則都是有關(guān)桌面網(wǎng)站的。市面上用戶多使用鍵盤，觸摸板，鼠標(biāo)，這使我們有更多的設(shè)計(jì)可能性來(lái)堅(jiān)持優(yōu)質(zhì)的用戶體驗(yàn)。然而，我們?nèi)匀灰獔?jiān)持一些指導(dǎo)原則，交互式設(shè)計(jì)方案就能夠保證我們的設(shè)計(jì)在不同的屏幕尺寸之間完美切換。
需要考慮的幾點(diǎn)
桌面設(shè)計(jì)有以下幾點(diǎn)考慮：
• 延展式網(wǎng)格設(shè)計(jì)，這種設(shè)計(jì)能夠讓用戶輕松找到感興趣的內(nèi)容 • 水平式導(dǎo)航，子菜單，大下拉菜單來(lái)輕松過(guò)濾內(nèi)容 • 交互式和延展式頁(yè)面更適合桌面式網(wǎng)站 • 為廣告，側(cè)邊內(nèi)容，額外介紹，電話應(yīng)答留下足夠空間 • 導(dǎo)航條可以用來(lái)引導(dǎo)用戶點(diǎn)擊，但在小屏幕上不適合用 • 掌握了解新的技術(shù)，包括那些能夠影響設(shè)計(jì)和用戶體驗(yàn)的 • 寬的頁(yè)腳，頁(yè)邊等等
網(wǎng)站應(yīng)該利用桌面強(qiáng)大的可擴(kuò)展性來(lái)給用戶提供更多選擇。在用戶使用過(guò)了手機(jī)或者平板應(yīng)用之后，他應(yīng)該被引導(dǎo)去使用桌面版應(yīng)用，這樣才能獲得更多的功能和更完善的用戶體驗(yàn)。
從用戶體驗(yàn)角度來(lái)說(shuō)，一定要確認(rèn)桌面設(shè)計(jì)是彈性化的，可以在不同屏幕尺寸大小之間無(wú)縫切換，并同樣擁有鍵盤等傳統(tǒng)桌面操作功能。上網(wǎng)本雖然沒(méi)有以前那么流行，但是同樣需要考慮其體驗(yàn)，它同傳統(tǒng)電腦比只是尺寸上小了一點(diǎn)。
2. 平板
平板電腦越來(lái)越流行，而且平板電腦很可能不是一個(gè)瞬間即逝的流星，它將作為一個(gè)新的網(wǎng)絡(luò)交互的發(fā)展趨勢(shì)長(zhǎng)時(shí)間發(fā)展下去。所以在做平板的用戶體驗(yàn)時(shí)我們一定不要把它的設(shè)計(jì)理解為”第二名”的桌面設(shè)計(jì)。它的設(shè)計(jì)完全可以獨(dú)立于桌面設(shè)計(jì)，我們應(yīng)該獨(dú)立尋求新的用戶體驗(yàn)交互方式。
平板電腦的最大特性就是觸摸性。這要求我們用新的方式去開(kāi)發(fā)新的用戶體驗(yàn)。然而目前很多用戶仍停留在基本的上網(wǎng)、點(diǎn)擊上面。所以我們有責(zé)任去開(kāi)發(fā)越來(lái)越多的觸摸式用戶體驗(yàn)。
需要考慮的幾點(diǎn)：
在平板開(kāi)發(fā)時(shí)我們一定偏像 app 意識(shí)的開(kāi)發(fā)、設(shè)計(jì)，盡量不去貼近桌面設(shè)計(jì)：
• 更大的觸摸空間，尤其是導(dǎo)航鍵。能用一只手指頭操作，這在平板開(kāi)發(fā)中太重要了。
• 標(biāo)簽欄、折疊式菜單在觸屏式設(shè)計(jì)中尤為重要。因?yàn)檫@樣能夠節(jié)省大量空間。而且不要只是僅僅把它們用在側(cè)邊欄上，而是把它們?nèi)诤系秸麄€(gè)網(wǎng)站上。 • 千萬(wàn)不要認(rèn)為平板設(shè)計(jì)只是把桌面網(wǎng)站設(shè)計(jì)整體縮小簡(jiǎn)化，否則你將會(huì)失去很多實(shí)用性。 • 用按鈕或者按鈕類設(shè)計(jì)來(lái)完成簡(jiǎn)單操作，比如鏈接。 • 不要認(rèn)為所以用戶跟你用同樣牌子的平板，甚至要考慮作出后退前進(jìn)的按鈕來(lái)。 • 設(shè)計(jì)應(yīng)該針對(duì)視網(wǎng)膜顯示進(jìn)行優(yōu)化，雖然目前只有iPod擁有視網(wǎng)膜顯示，但是我們不得不承認(rèn)大多人還是在用iPod的。
3. 手機(jī)，移動(dòng)端
節(jié)省空間不得不說(shuō)是最重要的。在開(kāi)發(fā)時(shí)同時(shí)要永遠(yuǎn)記得，可能一個(gè)桌面用戶更傾向于網(wǎng)站的功能性，交互性，然后一個(gè)移動(dòng)用戶更多的只是為了看到內(nèi)容，做一些簡(jiǎn)單操作，但一定要快。
需要考慮的幾點(diǎn)：
除了大的觸摸屏按鈕設(shè)計(jì)需要考慮外，移動(dòng)手機(jī)端開(kāi)發(fā)應(yīng)注意以下幾點(diǎn)：
• 使用最簡(jiǎn)單的交互方式，盡量減少額外的功能性。讓用戶集中在最重要的操作上。 • 對(duì)于內(nèi)容很多的網(wǎng)站，盡量將過(guò)濾器做的友好，用戶不喜歡在屏幕上敲字，最好能夠讓他們直接選擇一些分類類別。 • 盡量用最少的設(shè)計(jì)展示自己的網(wǎng)站，別占用太多功能性區(qū)域。 • 大點(diǎn)的字體和更好的類型顯示。盡量不要讓用戶放大放大再放大! • 在一些大塊內(nèi)容前加摘要，從而方面他們刪選內(nèi)容。
• 標(biāo)簽，伸展式菜單，導(dǎo)航永遠(yuǎn)都很重要! • 盡量不用彈出框，通知，廣告，如果有請(qǐng)盡量做得友好。 • 如果可能，盡量保重移動(dòng)端網(wǎng)站上一直保持最少數(shù)目的頁(yè)面。當(dāng)然這個(gè)不是在所有的網(wǎng)站上都通用，但是如果考慮到，最好用javascript開(kāi)切換內(nèi)容，避免過(guò)長(zhǎng)內(nèi)容。
4. 結(jié)論
平板和手機(jī)用戶預(yù)計(jì)將在2015年超過(guò)桌面用戶。考慮到這點(diǎn)，我們不僅僅需要學(xué)會(huì)交互式設(shè)計(jì)。我們更要對(duì)三種不同平臺(tái)的設(shè)計(jì)擁有不同的設(shè)計(jì)理念，但同時(shí)也要保持不同平臺(tái)間的一致性。我要記住圖片顯示要友好，觸摸方式也要有好，內(nèi)容顯示要合理。當(dāng)然，最大的問(wèn)題就是解決不同屏幕尺寸之間怎么組織和顯示網(wǎng)站內(nèi)容。