pbootcms网站模板|日韩1区2区|织梦模板||网站源码|日韩1区2区|jquery建站特效-html5模板网

手機APP如何理解用戶的眼

   手機與PC瀏覽,區別在哪里?

  我們曾先后針對QQ空間PC版和QQ空間手機版進行了眼動測試,讓用戶登錄自己的QQ空間自由瀏覽好友動態,對比兩次測試的結果(如下圖),可以發現,相比于使用電腦瀏覽好友動態,用戶在手機上瀏覽好友動態時手指滑動更頻繁,經常是在滑動手指的同時瀏覽內容。

  在進行基于電腦網頁的眼動數據分析時,我們主要關注用戶的注視焦點和軌跡,但對于手機來說,只分析用戶看了什么和不看什么是不夠的,有必要兼顧眼睛注視和手指滑動,來分析用戶的瀏覽特征,并評估用戶的瀏覽效率。

手機APP如何理解用戶的眼 三聯

  在對QQ空間手機版進行眼動測試的過程中,我們發現,有時用戶明明對某一條動態感興趣,卻只是滑動屏幕而不看上面的內容,直到把內容調整到一定范圍內的時候才開始看,這種情境顯然降低了用戶的瀏覽效率,增加了手指的滑動距離,卻沒有因此看到更多的內容(如下圖)。在該研究中,我們將這種情景稱為“低效滑動”。

2

  低效滑動的情景讓我們不禁思考:既然用戶不是自上而下將整個屏幕的內容瀏覽完之后才向上滑動屏幕,那么,用戶的注視范圍究竟有多大?如何基于注視范圍來優化設計以減少用戶的低效滑動?用戶的注視范圍能否改變?

  指尖上的注視范圍有多大?

  以QQ空間手機版為例,我們使用Tobii X120眼動儀對24名用戶進行了眼動測試,讓用戶使用手機登錄自己的QQ空間自由瀏覽好友動態,結果表明,注視范圍的長度占手機屏幕長度(不含頂bar和底bar)的比例約為75.0%(如下圖)。

3

  說明:

  1、每張圖均由參加相應終端測試的6名用戶的注視熱點圖疊加而成,獨立版是指QQ空間的客戶端,結合版是指從QQ上的入口進入看到的QQ空間;

  2、在熱點圖中,顏色越深,代表關注度越高。對于疊加而成的熱點圖,屏幕背景只是為了示意屏幕的大小,熱點覆蓋的區域代表注視的范圍,不代表實際看到的內容;

  3、標注的紅框是為了凸顯注視范圍的邊界。

  有限的注視范圍與圖文并茂的APP設計

  在瀏覽一條感興趣的動態的過程中,當用戶想看的內容沒出現/沒完全出現在注視范圍內時,會通過用手指滑動屏幕來調整這些內容的位置,定位好之后才開始瀏覽。因此,把用戶想看的內容顯示在其注視范圍內,可以減少低效滑動的發生。

  圖文并茂是社交APP內容的主要呈現形式,其中,圖片占據了屏幕的較大面積,且扮演著重要的角色,無論是好友類動態中的生活見聞照片,還是讓資訊類動態更加生動直觀的圖片,都是用戶用來判斷對動態是否感興趣的關鍵要素,也是瀏覽感興趣的動態時重點瀏覽的內容。由于用戶的注視范圍有限,在對動態中文字和圖片的高度進行設計時,應注意哪些問題呢?

  第一,圖片為豎圖時高度控制在注視范圍內。

  在單條動態中,橫圖的高度通常不會超過注視范圍,用戶不需產生低效滑動就可以完整瀏覽文字和圖片。但對于豎圖,則高度不宜過長,應控制在注視范圍內。當圖片沒有完全展示在注視范圍內時,用戶看完文字就會上滑屏幕,其間不會注視圖片內容,將圖片定位好后,通常是把圖片的頂部與屏幕最上方對齊,才開始瀏覽圖片,這不僅給用戶瀏覽圖片帶來了麻煩,而且當用戶想再次看文字的時候,還要再次下滑屏幕才能看到文字。

4

  第二,文字較長時展開部分文字,將文字和圖片的總高度控制在注視范圍內。

  對于文字較長的圖文并茂動態,用戶在手機上通常通過標題、圖片來快速判斷自己對動態是否感興趣,而對大段文字摘要的關注度較低。有時用戶沒有被標題吸引,滑動屏幕直接略過文字摘要,當該條動態中的圖片出現在屏幕上后被圖片吸引,然后點擊詳情頁閱讀全文。因此,將較長的文字部分收起,把文字和圖片的高度控制在注視范圍內,可減少用戶略過文字時產生的低效滑動。

5

  思考:用戶的注視范圍是否可以改變?

  通過上文分析用戶瀏覽社交APP內容時的特點可知,用戶的注視范圍與圖文并茂類動態的設計有著密不可分的關系。那么,對于不同的社交APP,用戶的注視范圍是固定的嗎?

  在對QQ空間手機版進行眼動測試的同時,我們也針對Facebook手機版用戶進行了眼動測試,讓6名用戶自由瀏覽Facebook,得到用戶使用Facebook時的注視范圍(如下圖)。

6

  Facebook的注視范圍的長度占手機屏幕長度(不含頂bar和底bar)的比例為87%,長于QQ空間手機版注視范圍的長度。為了更好地分析注視范圍的形成,我們也對用戶瀏覽單條動態時的注視情況進行了研究。

  Facebook的動態是卡片式設計,兩條動態之間的間隔較為明顯,用戶在瀏覽一條動態時,通常將其滑到屏幕頂端后開始瀏覽,加之文字和圖片的總高度在一屏之內,用戶可以在一屏內看到圖片的底邊,這使得用戶在瀏覽一條自己感興趣的動態的過程中,可以直接在一屏內完整地瀏覽文字和圖片,很少發生看完文字便開始滑動屏幕來調整圖片位置的情況,因而使得注視范圍的長度增加。

  由此,我們推斷,在使用社交APP時,用戶的注視范圍并不是固定的,通過設計上的改變可以擴大用戶的注視范圍,這不僅可以更好地利用了屏幕的大小,也可以減少用戶的低效滑動,提高瀏覽效率。當然,這只是對比QQ空間手機版和Facebook手機版得到的推論,注視范圍受哪些設計元素的影響、設計上的改變對注視范圍的具體影響機制如何都是值得進一步深入研究的問題。

  小結:

  本文主要揭示了用戶瀏覽社交APP的特點,并試圖從瀏覽體驗的視角為APP的設計帶來一些啟發。

  針對用戶的注視范圍和低效滑動問題,如何通過設計上的改變來擴大注視范圍、減少低效滑動,是設計社交APP中動態的呈現方式時值得思考的問題。

  與此同時,對于其他類型的APP(如資訊類等),用戶的注視范圍具有什么特點?與社交APP注視范圍的異同在哪里?是否可以通過對比不同類型APP的注視范圍總結出一些完善APP瀏覽體驗設計的準則?對于這些問題,我們將會持續地開展相關研究去尋找答案。

【網站聲明】本站除付費源碼經過測試外,其他素材未做測試,不保證完整性,網站上部分源碼僅限學習交流,請勿用于商業用途。如損害你的權益請聯系客服QQ:2655101040 給予處理,謝謝支持。

相關文檔推薦

這篇文章給大家詳細介紹了HTML頁面跳轉及參數傳遞問題,需要的朋友參考下吧
這篇文章主要介紹了純css實現照片墻3D效果的示例代碼,可以實現鼠標經過圖片實現改變,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本篇文章主要介紹了純 Css 繪制扇形的方法示例,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
本篇文章主要介紹了一份純CSS loading效果代碼示例,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
這篇文章主要介紹了css 實現文字過長自動隱藏功能,需要的朋友可以參考下
本篇文章主要介紹了詳解CSS3 rem(設置字體大小) 教程,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
主站蜘蛛池模板: 深圳激光打标机_激光打标机_激光焊接机_激光切割机_同体激光打标机-深圳市创想激光科技有限公司 深圳快餐店设计-餐饮设计公司-餐饮空间品牌全案设计-深圳市勤蜂装饰工程 | 破碎机_上海破碎机_破碎机设备_破碎机厂家-上海山卓重工机械有限公司 | 电动高尔夫球车|电动观光车|电动巡逻车|电动越野车厂家-绿友机械集团股份有限公司 | 退火炉,燃气退火炉,燃气热处理炉生产厂家-丹阳市丰泰工业炉有限公司 | OLChemim试剂-ABsciex耗材-广州市自力色谱科仪有限公司 | 杭州货架订做_组合货架公司_货位式货架_贯通式_重型仓储_工厂货架_货架销售厂家_杭州永诚货架有限公司 | 臭氧发生器_臭氧消毒机 - 【同林品牌 实力厂家】 | 光纤测温-荧光光纤测温系统-福州华光天锐光电科技有限公司 | 济南侦探调查-济南调查取证-山东私家侦探-山东白豹调查咨询公司 密集架|电动密集架|移动密集架|黑龙江档案密集架-大量现货厂家销售 | 体检车_移动CT车_CT检查车_CT车_深圳市艾克瑞电气有限公司移动CT体检车厂家-深圳市艾克瑞电气有限公司 | 油液红外光谱仪-油液监测系统-燃油嗅探仪-上海冉超光电科技有限公司 | 杜甫仪器官网|实验室平行反应器|升降水浴锅|台式低温循环泵 | 暴风影音 | 砍排机-锯骨机-冻肉切丁机-熟肉切片机-预制菜生产线一站式服务厂商 - 广州市祥九瑞盈机械设备有限公司 | 苗木价格-苗木批发-沭阳苗木基地-沭阳花木-长之鸿园林苗木场 | 心肺复苏模拟人|医学模型|急救护理模型|医学教学模型上海康人医学仪器设备有限公司 | 电表箱-浙江迈峰电力设备有限公司-电表箱专业制造商 | 全自动包衣机-无菌分装隔离器-浙江迦南科技股份有限公司 | 真丝围巾|真丝丝巾|羊绒围巾|围巾品牌|浙江越缇围巾厂家定制 | 科客,主见不成见| 定量包装秤,吨袋包装称,伸缩溜管,全自动包装秤,码垛机器人,无锡市邦尧机械工程有限公司 | 赛默飞Thermo veritiproPCR仪|ProFlex3 x 32PCR系统|Countess3细胞计数仪|371|3111二氧化碳培养箱|Mirco17R|Mirco21R离心机|仟诺生物 | 医院专用门厂家报价-医用病房门尺寸大全-抗菌木门品牌推荐 | ge超声波测厚仪-电动涂膜机-电动划格仪-上海洪富 | 天空彩票天下彩,天空彩天空彩票免费资料,天空彩票与你同行开奖,天下彩正版资料大全 | 仿古瓦,仿古金属瓦,铝瓦,铜瓦,铝合金瓦-西安东申景观艺术工程有限公司 | 锂电池砂磨机|石墨烯砂磨机|碳纳米管砂磨机-常州市奥能达机械设备有限公司 | 地图标注-手机导航电子地图如何标注-房地产商场地图标记【DiTuBiaoZhu.net】 | 磁力反应釜,高压釜,实验室反应釜,高温高压反应釜-威海自控反应釜有限公司 | 钢格板|热镀锌钢格板|钢格栅板|钢格栅|格栅板-安平县昊泽丝网制品有限公司 | 网站建设-高端品牌网站设计制作一站式定制_杭州APP/微信小程序开发运营-鼎易科技 | 南京PVC快速门厂家南京快速卷帘门_南京pvc快速门_世界500强企业国内供应商_南京美高门业 | 深圳市东信高科自动化设备有限公司| 搅拌磨|搅拌球磨机|循环磨|循环球磨机-无锡市少宏粉体科技有限公司 | 电动高尔夫球车|电动观光车|电动巡逻车|电动越野车厂家-绿友机械集团股份有限公司 | 亚克隆,RNAi干扰检测,miRNA定量检测-上海基屹生物科技有限公司 | 排烟防火阀-消防排烟风机-正压送风口-厂家-价格-哪家好-德州鑫港旺通风设备有限公司 | 钢格栅板_钢格板网_格栅板-做专业的热镀锌钢格栅板厂家-安平县迎瑞丝网制造有限公司 | 板式换网器_柱式换网器_自动换网器-郑州海科熔体泵有限公司 | 酒瓶_酒杯_玻璃瓶生产厂家_徐州明政玻璃制品有限公司 | 成都APP开发-成都App定制-成都app开发公司-【未来久】 |