UI知識(shí),層級(jí)對(duì)UI設(shè)計(jì)結(jié)果的影響
任何設(shè)計(jì)都應(yīng)該有它存在的理由。很多同學(xué)在設(shè)計(jì)練習(xí)的時(shí)候都無(wú)法確定設(shè)計(jì)命題,信息層級(jí)劃分,操作的層級(jí)劃分,甚至覺(jué)得命題練習(xí)很迷茫。所以今天我就帶領(lǐng)大家一起分析一個(gè)實(shí)際已經(jīng)上市的產(chǎn)品的UI樣例。幫助大家分析UI信息中的必然因素。
我今天查看天氣的時(shí)候打開(kāi)了一款天氣app
很多人應(yīng)該對(duì)這款app都很熟悉,我們首先可以看到,這款軟件是可以橫豎屏自動(dòng)適應(yīng)的。從構(gòu)圖比例來(lái)說(shuō),這款軟件是以豎屏作為主要顯示模式的。在豎屏的情況下,觀看效果最佳。
我們先不談層級(jí)問(wèn)題,我們先來(lái)瀏覽一下完整的信息。
下拉信息框以后,這里出現(xiàn)了一個(gè)商用ui不應(yīng)該犯的錯(cuò)誤。
當(dāng)信息全部下拉到底的時(shí)候,信息上邊緣有一排未顯示完全的文字,漏邊了。這個(gè)瑣碎的文字邊角,破壞了整體的UI視覺(jué)完整性。
其實(shí)這個(gè)缺陷是可以避免的,只需要在程序上調(diào)整一下文字距離
(這種ui中的錯(cuò)誤,其實(shí)不算多,但是也不算少)
因?yàn)檫@個(gè)軟件,在橫豎屏上都需要自適應(yīng)尺寸,所以取的是一個(gè)平均距離,理論上,ui人員在檢查UI的時(shí)候,是可以讓程序人間進(jìn)行修正的。
橫屏的下拉信息也是不完整的。這種問(wèn)題跟上面一樣,都是可以通過(guò)程序坐標(biāo)修改間距的。
那么這個(gè)問(wèn)題嚴(yán)不嚴(yán)重呢?其實(shí)這就很主觀了。因?yàn)榭梢酝侠拿姘,除了最上和最下位置,它其?shí)還有很多手動(dòng)的中間位置,不可能保證所有信息的視覺(jué)完整性。是可以通過(guò)程序調(diào)整,讓信息看起來(lái)更完整,但是這所花費(fèi)的時(shí)間,精力,成本,和所獲得的用戶(hù)體驗(yàn)之間的性?xún)r(jià)比,那只有研發(fā)人員才能去權(quán)衡了。
下面我們來(lái)看一下操作欄。
最上面的按鈕是添加城市,這個(gè)按鈕幾乎沒(méi)有多少可操作性,除了第一次打開(kāi)軟件設(shè)置它以外,可能出差旅游,會(huì)點(diǎn)按幾次。
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- ps基礎(chǔ)教程
- 設(shè)計(jì)
- UI知識(shí)
- 結(jié)果
- 鐵木士
學(xué)習(xí) · 提示
相關(guān)教程
推薦教程
- 圖片畫(huà)冊(cè)平面設(shè)計(jì)排版ps理論教程
- UI知識(shí),尺寸對(duì)UI設(shè)計(jì)的影響
- 用戶(hù)體驗(yàn),分享20個(gè)有影響力的包裝設(shè)計(jì)
- Photoshop初級(jí)教程-命令的技巧
- 調(diào)色知識(shí),簡(jiǎn)單實(shí)用的調(diào)色原理
- 色彩知識(shí),講解顏色基礎(chǔ)知識(shí)和配色理論
- 顏色管理,讓自己的照片在網(wǎng)上正確地顯示
- 移動(dòng)設(shè)計(jì),移動(dòng)應(yīng)用導(dǎo)航模式設(shè)計(jì)方法
- 用戶(hù)體驗(yàn),如何讓用戶(hù)心動(dòng)?
- 設(shè)計(jì)界面最常用最舒服的12種顏色(含色