首頁

全套WEB表單設(shè)計基礎(chǔ)

鶴鶴 移動端UI設(shè)計文章及欣賞

表單是一種用于收集用戶輸入的HTML元素,通常用于創(chuàng)建用戶與網(wǎng)頁交互的表單。表單可以包含各種輸入字段,如文本框、復(fù)選框、單選按鈕、下拉列表和提交按鈕等。當(dāng)用戶填寫表單并提交后,數(shù)據(jù)將被發(fā)送到服務(wù)器進(jìn)行處理。在web開發(fā)中,表單是實(shí)現(xiàn)用戶交互和數(shù)據(jù)收集的重要手段之一。

當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)

ui設(shè)計分享達(dá)人

前言
 
AI能力的迅猛發(fā)展,為產(chǎn)品設(shè)計帶來了很多新的可能性和機(jī)會。百度作為AI領(lǐng)域的行業(yè)先鋒,正在不斷探索如何將AI技術(shù)深度融入到產(chǎn)品中,以賦能改進(jìn)和提升產(chǎn)品的使用體驗(yàn)。
 
本文將以百度APP個人中心AI重構(gòu)項目為例,講述如何運(yùn)用AI智能推薦和對話能力來解決問題重構(gòu)體驗(yàn),將一個傳統(tǒng)的固定入口型的個人中心打造成為一個高效智能的AI版?zhèn)€人中心。
 
希望能為讀者提供新的視角和思路,激發(fā)大家對于AI原生設(shè)計的理解和思考。
 
 
個人中心舊版
 
作為百度APP端內(nèi)業(yè)務(wù)和基礎(chǔ)功能設(shè)置的重要回訪陣地,個人中心面臨著三大核心問題:①功能入口多頁面屏效低;②部分功能操作層級深;③資產(chǎn)更新提醒不直觀。
 
針對這些問題,我們希望通過精簡功能結(jié)構(gòu)、破殼高頻功能、強(qiáng)化信息提示,提升用戶觸達(dá)效率,優(yōu)化整體使用體驗(yàn)。為此,我們計劃運(yùn)用AI能力進(jìn)行設(shè)計重構(gòu)來解決上述三大問題。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
 
個人中心AI重構(gòu)設(shè)計
 
目前行業(yè)內(nèi)并沒有一款運(yùn)用AI能力對個人中心進(jìn)行重構(gòu)的產(chǎn)品,因此,設(shè)計師的挑戰(zhàn)在于如何從0-1創(chuàng)新重構(gòu)出“AI個人中心”新形態(tài),來全面提升用戶在端內(nèi)的回訪體驗(yàn)。我們依次從「框架、結(jié)構(gòu)、內(nèi)容、操作、對話」五部分出發(fā)定義,逐步搭建功能、豐滿細(xì)節(jié)、拓展深度,創(chuàng)新重構(gòu)出一個全新的AI版?zhèn)€人中心。
 
1.容器創(chuàng)新設(shè)計 打造AI感資產(chǎn)框架
 
基于上述問題和設(shè)計目標(biāo),首先對個人中心框架進(jìn)行了重構(gòu)設(shè)計,結(jié)合用戶行為數(shù)據(jù)保留常用高頻功能入口,去除原來眾多類型的內(nèi)容推薦卡,在頁面內(nèi)實(shí)現(xiàn)功能精簡提效;其次結(jié)合AI智能推薦的能力,開辟出一個承載推薦內(nèi)容的容器區(qū)域,破殼內(nèi)容便于用戶回訪。
 
我們共計驗(yàn)證推敲出3種頁面框架“嵌入式框架”“分層式框架”“卡片式框架”,選擇與AI融合感更強(qiáng)、體驗(yàn)更沉浸的嵌入式框架繼續(xù)深入,框架頭部精簡信息,中部保留高頻功能便于用戶回訪,下方區(qū)域則通過AI智能推送用戶所需內(nèi)容。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
2.結(jié)合用戶行為 主動智能推薦
 
在框架下方承載推薦內(nèi)容的容器區(qū)域內(nèi),個人中心可以結(jié)合用戶在百度APP的使用行為數(shù)據(jù),通過AI向用戶智能推薦內(nèi)容資源和功能操作。
 
當(dāng)用戶的內(nèi)容資產(chǎn)有變更時,個人中心能夠主動破殼內(nèi)容,如用戶最近下載了一部劇集但未看完,當(dāng)該劇有更新時,主動提示用戶繼續(xù)觀看。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
當(dāng)用戶有設(shè)置類潛在需求時,個人中心能夠推薦操作功能,如用戶的手機(jī)經(jīng)過一段時間使用,有系統(tǒng)垃圾冗余時,會主動推薦用戶清理緩存。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
3.構(gòu)建全業(yè)務(wù)卡片的內(nèi)容結(jié)構(gòu)
 
我們將各業(yè)務(wù)需要展示的信息摘取出來,采用卡片形態(tài)進(jìn)行聚合與承接,以保證AI智能推薦時的靈活性和可拓展性。卡片會采用對話式引導(dǎo)語拉近用戶距離,破殼提示內(nèi)容資源,如向用戶主動推薦最近收藏的內(nèi)容,支持跳轉(zhuǎn)查看并在返回時更新狀態(tài);還會在資產(chǎn)變更時進(jìn)行提醒,如當(dāng)用戶下載視頻或備份文件后,對用戶實(shí)時提醒并提供復(fù)訪入口;支持用戶直接設(shè)置功能,支持一鍵點(diǎn)擊并實(shí)時反饋狀態(tài)。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
設(shè)計期間,我們從卡片分類方式、模板呈現(xiàn)、交互操作等維度進(jìn)行了多方案探索,前后迭代實(shí)驗(yàn)了3款卡片形態(tài),結(jié)合用戶訪談測試和實(shí)驗(yàn)數(shù)據(jù)反饋,最終選擇使用3.0版本的分卡聚合樣式。這一版本采用了統(tǒng)一化模版來精簡布局,通過一步操作來前置功能減步長,對功能和內(nèi)容進(jìn)行分類聚合來提高頁面屏效、使用戶更易理解。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
共計為20+業(yè)務(wù)搭建了10類聚合卡片,定義歸納了3類卡片操作與更新方式,在個人中心選用最符合用戶行為的卡片和內(nèi)容進(jìn)行智能推薦。目前我們更多業(yè)務(wù)正在接入推薦卡片體系中,大家敬請期待~
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
4.內(nèi)容破殼提示 功能操作提效
 
回歸用戶實(shí)際使用場景來看,AI智能推薦卡片形式在用戶操作上有了很大的提效。例如查看下載視頻的步長由4步縮減為1步,原來用戶想繼續(xù)看視頻時,可能會找不到、且尋找入口比較深,現(xiàn)在我們通過推薦卡片破殼了視頻等內(nèi)容,點(diǎn)擊卡片即可一鍵直達(dá)視頻頁,一段時間后返回個人中心時卡片會更新用戶的最新觀看進(jìn)度。既減少了用戶操作步長,又沉浸式延續(xù)了用戶在端內(nèi)的使用行為。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
同樣,功能類的操作效率也大幅提升,之前當(dāng)用戶想清理時 ,入口深步驟多、體驗(yàn)非最佳,現(xiàn)在通過推薦卡片將清理緩存功能前置推出在個人中心,用戶想清理緩存時,無需翻越層層入口,只需點(diǎn)擊“清理”按鈕即可一鍵完成緩存清理,實(shí)時告知用戶清理進(jìn)度,大幅提升用戶操作效率。除此以外,像深色模式、字體大小等功能也都支持用戶在個人中心一鍵操作。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
5.拓展對話場景 觸達(dá)用戶長尾需求 
 
個人中心不僅可以結(jié)合用戶行為智能推薦卡片,還支持用戶主動發(fā)起提問,通過對話形式快捷觸達(dá)長尾需求。用戶點(diǎn)擊卡片下方的“去提問”入口或上滑頁面,即可從個人中心進(jìn)入對話頁。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
進(jìn)入對話頁后,個人中心AI助手首先會推薦一些快捷指令,讓用戶快速了解對話提問方式和目前支持提問的功能。當(dāng)用戶發(fā)起提問后推出相關(guān)功能卡片,如在手機(jī)運(yùn)行卡頓時詢問“如何清理緩存”,AI助手會推出“清理緩存”卡片并引導(dǎo)用戶前往清理,清理完成會再次回到對話頁、為用戶展示最新緩存狀態(tài)。
 
以下是支持對話的部分功能卡片,這些卡片整體延續(xù)了推薦區(qū)域卡片的內(nèi)容和體驗(yàn),結(jié)合對話交互流程對卡片模版進(jìn)行了差異化定制。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
最終基于業(yè)務(wù)功能特點(diǎn),結(jié)合對話交互規(guī)范,共計定義了“跳轉(zhuǎn)操作并返回更新”“跳轉(zhuǎn)查看”“當(dāng)前操作”“當(dāng)前操作并追加對話”4種交互操作和更新方式。目前我們接入的場景能力尚有限,后續(xù)我們將持續(xù)進(jìn)行迭代與優(yōu)化,提升用戶在個人中心進(jìn)行AI對話的體驗(yàn)。
 
當(dāng)設(shè)計遇上AI—百度APP個人中心AI重構(gòu)
 
 
 
 
AI個人中心實(shí)驗(yàn)上線效果
 
AI版本實(shí)驗(yàn)上線后,百度APP和個人中心的關(guān)鍵數(shù)據(jù)都有了顯著提升,帶來了正向收益,我們也于今年6月底上線全端,期待大家體驗(yàn)并給予反饋。
 
 
思考與展望
 
如今產(chǎn)品AI化已成為市場發(fā)展趨勢,作為設(shè)計師,如何結(jié)合自己的業(yè)務(wù),運(yùn)用AI能力重構(gòu)產(chǎn)品及體驗(yàn)是一個極具挑戰(zhàn)和價值的課題。我們從百度APP個人中心AI重構(gòu)項目中總結(jié)出了一些經(jīng)驗(yàn)和小tips,在此向大家分享:
 
  •  
    在應(yīng)用AI技術(shù)之前,首要任務(wù)是明確其能力范圍與顯著優(yōu)勢,如文中使用的AI智能推薦能力能夠同時滿足用戶的個性化需求、提升信息獲取效率,從而全方位提升用戶體驗(yàn)和業(yè)務(wù)價值。
 
  •  
    我們需要大膽突破、勇于創(chuàng)新,在沒有可參考借鑒的產(chǎn)品時應(yīng)當(dāng)打破慣性思維,嘗試從框架、結(jié)構(gòu)、內(nèi)容等層面進(jìn)行全新定義,然后通過持續(xù)打磨、深度探索等手段來不斷完善產(chǎn)品形態(tài)。
 
  •  
    無論是否應(yīng)用AI,設(shè)計底層思維是萬變不離其宗的,我們需要始終站在用戶視角分析并解決問題,而AI將會是每位設(shè)計師的一個趁手工具和靈感中心,它可以給我們更多思考問題的角度,日常工作中我們應(yīng)當(dāng)多積累總結(jié)然后不斷迸發(fā)新思考,通過AI這個新工具來解決我們業(yè)務(wù)的已有問題,向用戶提供更好的體驗(yàn)。
 
以上是我們的一些小小心得,希望能為同為設(shè)計師的你,在面對AI應(yīng)用與重構(gòu)設(shè)計時提供一些設(shè)計思路和借鑒。
后續(xù),我們將持續(xù)聚焦提升個人中心的AI智能感知能力,圍繞用戶的偏好習(xí)慣及當(dāng)前上下文環(huán)境,提供更精準(zhǔn)的個性化服務(wù),為用戶升級更加智能、自然流暢的AI對話體驗(yàn),通過結(jié)合更多場景逐步打造出一個全方位、個性化的百度APP AI助手,讓每位用戶都能享受到智能化的便捷與樂趣。
 
 


作者:百度MEUX
鏈接:https://www.zcool.com.cn/article/ZMTYzMzE4MA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。

 

 

冬奧智能氣象APP設(shè)計案例/氣象行業(yè)UI界面設(shè)計/蘭亭妙微

藍(lán)藍(lán)設(shè)計的小編

冬奧智慧氣象 APP 是專門面向國內(nèi)外 IOC(國際奧委會)官員、冬奧會的組織與管理者、運(yùn)動員與教練員以及關(guān)注冬奧會比賽進(jìn)程的公眾用戶,通過該 APP 向國內(nèi)、國外用戶提供權(quán)威、準(zhǔn)確、及時的官方氣象服務(wù)信息,并作為冬奧會官方氣象服務(wù)網(wǎng)站的有力補(bǔ)充,通過智能手機(jī)向用戶提供優(yōu)質(zhì)的冬奧氣象服務(wù)。該 APP 以冬奧比賽場地的預(yù)報、實(shí)況和預(yù)警的氣象服務(wù)為設(shè)計重點(diǎn),面向不同用戶的天氣需求進(jìn)行定制化開發(fā)。開發(fā)原則上以服務(wù)用戶為主,創(chuàng)新設(shè)計服務(wù)流程和服務(wù)模式,讓國內(nèi)外用戶能夠體驗(yàn)到冬奧氣象服務(wù)的實(shí)用和貼心,并具有一定的科技感和獲得感。藍(lán)藍(lán)設(shè)計負(fù)責(zé) UI設(shè)計部分。本項目歷時二年,經(jīng)歷無數(shù)修改及設(shè)計開發(fā)完畢后的推倒重來,在冬奧氣象專家的指導(dǎo)下,結(jié)合了國際賽事運(yùn)動員和專業(yè)人士的習(xí)慣,設(shè)計出符合其產(chǎn)品特性的人性化界面。

移動端UI設(shè)計與PC端網(wǎng)頁UI設(shè)計差異

藍(lán)藍(lán)設(shè)計的小編

在數(shù)字化時代,UI設(shè)計是連接用戶與產(chǎn)品或服務(wù)的關(guān)鍵橋梁。隨著設(shè)備的多樣化,移動端UI設(shè)計與PC端網(wǎng)頁UI設(shè)計雖然在目標(biāo)上追求用戶體驗(yàn)的優(yōu)化,但在具體實(shí)踐中卻展現(xiàn)出諸多不同。本文將從屏幕尺寸、交互方式、設(shè)計原則、性能要求及用戶習(xí)慣等幾個方面,深入探討兩者之間的差異。

無障礙設(shè)計對App界面設(shè)計的意義

藍(lán)藍(lán)設(shè)計的小編

在數(shù)字化時代,App已成為人們?nèi)粘I畹闹匾M成部分,它們?yōu)橛脩籼峁┝吮憬莸男畔@取和服務(wù)體驗(yàn)。然而,對于一部分特殊群體而言,如視障、聽障、行動不便等人士,使用App可能仍然面臨諸多障礙。因此,無障礙設(shè)計在App界面設(shè)計中的意義顯得尤為重大。本文將從多個方面探討無障礙設(shè)計對App界面設(shè)計的意義。

情感化設(shè)計對App界面設(shè)計的影響

藍(lán)藍(lán)設(shè)計的小編

在數(shù)字化浪潮中,App已成為人們?nèi)粘I畹闹匾M成部分,它們不僅滿足了我們的功能需求,更在情感層面與我們緊密相連。情感化設(shè)計作為App界面設(shè)計的一種重要理念,正逐漸滲透并深刻影響著用戶的體驗(yàn)與感知。本文將從多個維度探討情感化設(shè)計對App界面設(shè)計的影響。

App界面設(shè)計方法指南

藍(lán)藍(lán)設(shè)計的小編

在移動應(yīng)用(App)日益普及的今天,一個優(yōu)秀的界面設(shè)計不僅是功能實(shí)現(xiàn)的載體,更是吸引用戶、提升用戶體驗(yàn)的關(guān)鍵。本文旨在提供一份App界面設(shè)計方法指南,幫助設(shè)計師和開發(fā)者們打造出既美觀又實(shí)用的用戶界面。

交互設(shè)計對App界面設(shè)計的影響

藍(lán)藍(lán)設(shè)計的小編

在數(shù)字化時代,移動應(yīng)用(App)已成為人們?nèi)粘I钪胁豢苫蛉钡囊徊糠?,無論是社交娛樂、購物支付還是健康管理,App都以其便捷性和高效性贏得了用戶的青睞。而在這背后,交互設(shè)計作為連接用戶與產(chǎn)品的橋梁,對App界面設(shè)計產(chǎn)生了深遠(yuǎn)影響,它不僅塑造了產(chǎn)品的第一印象,更決定了用戶體驗(yàn)的優(yōu)劣。

交互設(shè)計在App界面設(shè)計中的核心作用

藍(lán)藍(lán)設(shè)計的小編

在移動互聯(lián)網(wǎng)高速發(fā)展的今天,App作為用戶與數(shù)字世界交互的重要窗口,其界面設(shè)計直接影響著用戶體驗(yàn)的優(yōu)劣。而交互設(shè)計作為App界面設(shè)計中的關(guān)鍵一環(huán),更是扮演著舉足輕重的角色。本文將深入探討交互設(shè)計在App界面設(shè)計中的核心作用,以及它是如何提升用戶體驗(yàn)的。

用戶體驗(yàn)在App界面設(shè)計中的核心作用

藍(lán)藍(lán)設(shè)計的小編

在數(shù)字化時代,移動應(yīng)用程序(App)已成為人們?nèi)粘I畈豢苫蛉钡囊徊糠郑瑹o論是社交娛樂、在線購物、健康管理還是工作學(xué)習(xí),App都以其便捷性和高效性贏得了用戶的青睞。然而,在眾多App中脫穎而出,除了強(qiáng)大的功能和豐富的內(nèi)容外,一個關(guān)鍵因素便是其卓越的用戶體驗(yàn)(UX)。用戶體驗(yàn),簡而言之,就是用戶在使用產(chǎn)品或服務(wù)過程中建立起來的主觀感受,它貫穿于App界面設(shè)計的每一個環(huán)節(jié),對產(chǎn)品的成功至關(guān)重要。

日歷

鏈接

個人資料

存檔