中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

手機(jī)網(wǎng)站建設(shè)界面設(shè)計(jì)理論

2021-01-24    分類(lèi): 手機(jī)網(wǎng)站建設(shè)

機(jī)開(kāi)始出現(xiàn)只是為了通話(huà),后來(lái)可以發(fā)短信,拍照片,聽(tīng)音樂(lè),看視頻。到現(xiàn)在手機(jī)完全成了我們身體的延伸,沒(méi)有手機(jī)我們可能會(huì)很快的與這個(gè)社會(huì)脫節(jié)??梢灶A(yù)見(jiàn)一款產(chǎn)品/app所能完成任務(wù)是越來(lái)越多的。極簡(jiǎn)風(fēng)格在內(nèi)容越來(lái)越多的前提下,設(shè)計(jì)師應(yīng)該減少無(wú)用信息的干擾讓用戶(hù)可以快速聚焦的到內(nèi)容本身,這種“少即是多”設(shè)計(jì)思路就是我們常說(shuō)的極簡(jiǎn)風(fēng)格。那么設(shè)計(jì)師如何將極簡(jiǎn)風(fēng)格應(yīng)用到自己的產(chǎn)品中呢?下面我會(huì)做一個(gè)簡(jiǎn)單的分析,希望可以幫助到大家。
刪減不必要的元素
極簡(jiǎn)風(fēng)格簡(jiǎn)單粗暴的實(shí)現(xiàn)手法就是刪減與用戶(hù)任務(wù)無(wú)關(guān)的非功能性元素,只保留重要的信息,減輕用戶(hù)的認(rèn)知負(fù)荷。
那么如何去判斷一個(gè)設(shè)計(jì)元素的取舍呢?設(shè)計(jì)師應(yīng)該問(wèn)自己以下三個(gè)問(wèn)題:
1. 這個(gè)設(shè)計(jì)元素在當(dāng)前界面中是起什么作用的?能夠完成什么 樣功能?
2. 去掉以后是否會(huì)影響用戶(hù)正常操作?
3. 如果影響用戶(hù)操作,可否有更簡(jiǎn)潔的設(shè)計(jì)元素來(lái)替代?
前幾天有一個(gè)朋友問(wèn)我,微博界面中每條動(dòng)態(tài)下面的icon能否去掉。這里icon的使用是用于提升信息的可讀性,因?yàn)橄鄬?duì)于文本信息,具象元素可以更好的完成信息的傳達(dá)。但是這只是起到一個(gè)提升作用,即使我把icon拿走,用戶(hù)也會(huì)知道這三個(gè)是轉(zhuǎn)發(fā)、評(píng)論和點(diǎn)贊。
所以這里的icon是可以去掉的嗎?當(dāng)然不是,我們要考慮不同的使用場(chǎng)景。當(dāng)這條動(dòng)態(tài)沒(méi)有任何人點(diǎn)贊,評(píng)論,轉(zhuǎn)發(fā)的時(shí)候,我們把icon拿走是沒(méi)有問(wèn)題的。但是一旦出現(xiàn)了互動(dòng),那么icon就完全取代了文字成為這個(gè)功能的可識(shí)別性元素,后面的數(shù)目顯示的是互動(dòng)強(qiáng)度。即使我一直很推崇的“一個(gè)”應(yīng)用,它的界面設(shè)計(jì)簡(jiǎn)單到不能再簡(jiǎn)單,在這里還是保留了icon,所以我傾向于保留,當(dāng)然如果你有更好的方案歡
迎留言交流。
微信新的一次改版也很好的體現(xiàn)出多態(tài)組件的應(yīng)用,之前用戶(hù)如果想刪除與一個(gè)好友的聊天記錄,點(diǎn)擊“刪除”以后會(huì)從界面底部彈出actionsheet來(lái)供用戶(hù)進(jìn)行刪除確認(rèn)(不好意思,忘截圖了)。但是微信新的一次改版,對(duì)刪除確認(rèn)這一步驟進(jìn)行了簡(jiǎn)化。整個(gè)刪除流程用戶(hù)的注意力會(huì)一直停留在在當(dāng)前的這條聊天記錄上,不會(huì)轉(zhuǎn)移到界面底部的actionsheet,這種小細(xì)節(jié)的優(yōu)化真的很讓人眼前一亮。
多態(tài)組件的應(yīng)用可以幫助設(shè)計(jì)師進(jìn)一步簡(jiǎn)化界面中的信息。當(dāng)然這就要求設(shè)計(jì)師對(duì)設(shè)計(jì)組件做到足夠的了解,逐個(gè)分析不同的組件的優(yōu)缺點(diǎn)和適用場(chǎng)景。


以底部按鈕為例:
因?yàn)槠湟话愣紩?huì)采用面狀按鈕,大面積的色塊能夠達(dá)到吸引用戶(hù)注意力的目的。當(dāng)然有的時(shí)候,不需要按鈕這么顯眼,我們則可以換種樣式,典型的就是“退出登錄”按鈕,沒(méi)有設(shè)計(jì)師希望用戶(hù)可以很輕易的發(fā)現(xiàn)退出產(chǎn)品的路徑。
這種按鈕樣式的有兩個(gè)缺點(diǎn),一就是不能浮動(dòng)的,當(dāng)界面內(nèi)容過(guò)多的時(shí)候,用戶(hù)需要滑動(dòng)很久才能看到界面下方的按鈕,降低了產(chǎn)品的易用性。當(dāng)然我們加一個(gè)背景框做成浮動(dòng)樣式固定在界面底部,這個(gè)問(wèn)題也隨之解決了。
它的第二缺點(diǎn)是只適合展示1- 2 個(gè)按鈕的場(chǎng)景, 3 個(gè)以上的按鈕就很難勝任了。而且這里的優(yōu)先級(jí)區(qū)分只能通過(guò)改變(圓角)矩形的樣式來(lái)實(shí)現(xiàn),例如面狀對(duì)線狀,紅色背景對(duì)藍(lán)色背景。要解決這個(gè)問(wèn)題,我們不妨看看下面這個(gè)按鈕樣式。
這種底部按鈕現(xiàn)在比較火,很多主流產(chǎn)品都采用這種樣式。突然的爆火不是沒(méi)有緣由的,它的的優(yōu)點(diǎn)就在于可以很好解決上面的二個(gè)問(wèn)題。因?yàn)閕con的引入一方面釋放了界面的空間,可以放五個(gè)按鈕。而且樣式更加多變,可以是“文字+色塊”也可以是“文字+icon”,而且尺寸與配色可以根據(jù)優(yōu)先級(jí)來(lái)進(jìn)行設(shè)置,設(shè)計(jì)師可發(fā)揮的空間會(huì)大一點(diǎn)。
但是這種底部按鈕樣式也是有缺點(diǎn)的,iPhone X因?yàn)榈撞縃ome Indicator的存在給我們的適配帶來(lái)了很多不便。有的產(chǎn)品在適配的時(shí)候改變了樣式,破壞了用戶(hù)體驗(yàn)的一致性。
可能會(huì)有設(shè)計(jì)師說(shuō),我只是一個(gè)UI設(shè)計(jì)師,這里面選擇什么組件不是我來(lái)決定的,這是交互設(shè)計(jì)師或者產(chǎn)品經(jīng)理的工作。我一直所提倡的UI設(shè)計(jì)師要懂交互和產(chǎn)品,如果他們給的交互稿原型圖不合理,你可以去反向去影響他們。只是被動(dòng)的去給他們的原型圖上色而不去思考,這樣我們很難提升。


要點(diǎn)突出
為什么極簡(jiǎn)風(fēng)格設(shè)計(jì)我們還要考慮要點(diǎn)突出呢?因?yàn)橛械脑O(shè)計(jì)師過(guò)于追求簡(jiǎn)單,導(dǎo)致整個(gè)界面看起來(lái)跟原型圖一樣,特別的平淡。其實(shí)極簡(jiǎn)風(fēng)格設(shè)計(jì)是在界面簡(jiǎn)單的基礎(chǔ)上還要做到要點(diǎn)信息突出,讓用戶(hù)在快速瀏覽的模式下可以看到他們感興趣的內(nèi)容。
極簡(jiǎn)風(fēng)格的設(shè)計(jì)理念提倡:一個(gè)界面有一個(gè)焦點(diǎn)。我們會(huì)經(jīng)常會(huì)看到一些設(shè)計(jì)師做的界面非常的繁雜,讓人抓不住要點(diǎn)。當(dāng)然這不一定全是設(shè)計(jì)師的鍋,有的時(shí)候產(chǎn)品經(jīng)理要求這個(gè)要突出,那個(gè)強(qiáng)調(diào),導(dǎo)致整個(gè)界面都充斥著大紅大紫,特別的凌亂。
但是有的設(shè)計(jì)師矯枉過(guò)正,為了凸顯功能,過(guò)于弱化次要功能,這也是不可取的。例如,上面這個(gè)界面中“小紅點(diǎn)”,當(dāng)然這里應(yīng)該說(shuō)“小黃點(diǎn)”。因?yàn)檫@里把紅色改成了黃色,對(duì)于這個(gè)改法我非常的理解。因?yàn)榧t色特別的刺眼,改成黃色的確舒服多了。但是!“小紅點(diǎn)”的工作原理就是用戶(hù)對(duì)界面和諧統(tǒng)一的追求,這里突然出現(xiàn)了一個(gè)紅點(diǎn),非常突兀,所以會(huì)忍不住的想去點(diǎn)擊。如果你把紅色改成了黃色,用戶(hù)就無(wú)法注意到新消息提醒,小紅點(diǎn)的作用也無(wú)法起到。這個(gè)屬于過(guò)度弱化次要功能。

分享題目:手機(jī)網(wǎng)站建設(shè)界面設(shè)計(jì)理論
URL網(wǎng)址:http://m.rwnh.cn/news/97518.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專(zhuān)注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司;服務(wù)項(xiàng)目有網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站建設(shè)
井冈山市| 灵丘县| 峨眉山市| 洪泽县| 合江县| 鹤山市| 崇阳县| 综艺| 武夷山市| 邵阳县| 兴国县| 筠连县| 高雄市| 左权县| 九寨沟县| 宣武区| 汕头市| 龙胜| 浪卡子县| 晋江市| 饶平县| 济源市| 邯郸市| 江山市| 肇源县| 宿迁市| 巴林右旗| 金乡县| 韩城市| 乐平市| 永定县| 广元市| 上栗县| 东乡| 上虞市| 阿克陶县| 区。| 宽甸| 双柏县| 景洪市| 萝北县|