來源:《方寸指間》
移動端六大設(shè)計原則
1、簡潔:突出重點,聚焦內(nèi)容;刪除、隱藏、轉(zhuǎn)移
敢于刪除不必要的內(nèi)容;多應(yīng)用交互手勢操作,隱藏一些不必要的信息,使內(nèi)容優(yōu)先最大化;轉(zhuǎn)移到傳感器等硬件,讓界面設(shè)計有趣簡潔。
2、高效:穩(wěn)定、流暢、快捷
避免鍵盤輸入,操作慢易出錯,若有更好的輸入方式優(yōu)先考慮語音、手勢、傳感等(eg:保留之前輸入的內(nèi)容,關(guān)鍵字聯(lián)想);提高有效觸動,減少用戶的挫敗感(eg:增大點擊區(qū)域,手勢替代點擊);更少的頁面跳轉(zhuǎn)能增加頁面的連貫性。
3、一致性:是設(shè)計基礎(chǔ)原則
設(shè)計上的一致,涵蓋基本結(jié)構(gòu)布局、模塊化內(nèi)容、文案、交互行為和視覺風(fēng)格等;平臺環(huán)境的一致,維持用戶的使用習(xí)慣;跨平臺的一致性,規(guī)范的制定,多平臺布局內(nèi)容設(shè)計上處理追求一致。
4、反饋:有效、清晰、即時
為用戶的行為操作提供即時反饋,比如按鈕狀態(tài)的切換;提供有價值的狀態(tài)提示反饋,不使用單一場景,可以根據(jù)實際情況適用toast、狀態(tài)欄、導(dǎo)航欄等反饋方式,也可結(jié)合聲音、振動。閃光燈組合方式。
5、情感化:讓用戶感到愉悅
有趣的文案、出色的視覺效果、個性化設(shè)計、互動反饋、IP形象的擬態(tài)都可以作為一種形式。
6、移動化:思考產(chǎn)品如何才能更具移動化
手勢的充分利用、振動硬件、LED燈和產(chǎn)品更好的結(jié)合、傳感器的特點、搖一搖的中立感應(yīng)、LBS的地理位置和陀螺儀的游戲效果。
多端差異
iOS app擁有完整的導(dǎo)航體系,無須借助外部按鍵;Android自身硬件已帶有返回按鍵
Web app通過HTML5來實現(xiàn),平臺自帶瀏覽器和主瀏覽器的特性,需要特別注意界面大面積的左右滑動控件與瀏覽器默認操控手勢的沖突;不能鎖定屏幕,橫豎屏適配需要考慮;HTML5已支持大量離線功能,需要考慮大數(shù)據(jù)量時的預(yù)演效果。
導(dǎo)航設(shè)計主要是主導(dǎo)航和二級導(dǎo)航的設(shè)計,這兩者之前可相互轉(zhuǎn)換。主導(dǎo)航:標簽式、抽屜式、桌面式、菜單式、點聚式;二級導(dǎo)航:旋轉(zhuǎn)木馬、列表、圖示、選項卡。