<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 展開全文后需要支持收起嗎?從運用場景分析交互邏輯

    2021-10-12    seo達人



    圖片

    展開和收起屬于比較細節的問題,按照慣性思維,內容多了我就折疊一部分,用戶需要看更多內容就點擊「展開」,內容展開之后,相應的還應該支持內容的「收起」。

    整個流程這樣看起來沒什么毛病,但是卻缺少一個重要的前提,哪些場景或者什么情況下才需要展開或收起呢?

    如果只是單純給出一個流程,顯然缺乏對產品邏輯和用戶體驗上的思考。可能很多設計師之前沒怎么注意過這個地方的交互邏輯,或者深入思考需要注意的問題,這次借著答疑的機會咱們一起來深入探討下。

     

    1、拋開展開和收起

    雖然提出的問題是分析展開和收起的運用場景,但是我覺得不應該一上來就陷入到具體的細節里。

    這個問題相對來說屬于比較小的點,直接鉆到細節里會讓我們只盯著這一小部分,缺少對全局的思考,因小失大

    盯著已有的設計進行推導,這樣多少帶有個人主觀的臆想。先不要盯著具體的展開和收起功能來想場景,反過來想,在設計過程中有哪些地方需要這樣的交互邏輯,為什么需要呢?

    無論面對什么樣的設計需求,這樣的思考過程會一直伴隨著我們。

     

    2、先場景后行為

    先回到場景上,考慮哪些場景會觸發「展開和收起」行為,再具體問題具體分析。

    場景一:當某段內容字數太多,占據了大面積的空間,如果用戶不想看這些長篇大論,想看下一個內容,要滑動屏幕很久才能略過這些內容,顯然我們不想給用戶帶來這樣的操作負擔,這時候就可以考慮添加收起功能,把多余的內容收起來。

    這里的收起需要注意兩點:

    • 內容被收起不代表被收起的內容不重要;
    • 收起相對節約屏幕空間,用戶更方便上下滑動查看內容。

    場景二:頁面上仍然有很多內容,但是這些內容有主次之分,我們想讓用戶最先看到前面的內容,后面的內容可以考慮收起來突出重點并節省空間。

    這里的收起就和場景一有差異,可能被收起的內容相對沒這么重要,只露出重點/熱點內容或權益來吸引用戶,相對次要的內容被收起,這里的收起會涉及到內容重要程度的排序,這種排序就可以體現在排行榜設計中。

     

    3、展開然后收起

    展開和收起屬于一組行為,看到展開我們必然會聯想到收起。展開是為了看到完整的內容,收起則是內容看完的標志,點擊收起可以繼續下一個內容。

    在知乎問答中,我們首先看到的是標題的問題,這些問題往往言簡意賅,通常光看標題我們就能知道這個問題想表達什么意思。

    圖片

    ▲ 標題下面的問題簡介是對標題的進一步解釋和補充,這里的簡介作為說明性文字,就支持展開和收起。當簡介內容太多時,就要考慮折疊一部分簡介,這樣能保證在首屏上能同時看到問題和答案。

    另外當內容很多,以信息流的形式呈現,并且需要上下滑動來瀏覽時,就可以考慮使用現展開后收起。

    比如在微信朋友圈,如果文字內容較多,就會被收起一部分,想看完整的內容則需要點擊「全文」選項,看完后點擊「收起」,內容就會被折疊起來,方便我們繼續滑動瀏覽其他朋友圈。

     

    4、展開后不收起

    點完展開看到了全部內容,卻沒有收起選項,但是這樣并不影響我們的觀看體驗,而且展開這個動作給用戶和頁面帶來的反應都很小,不會讓用戶感到不適。之所以選擇「展開」,一個重要的原因是因為我們有想看完整內容的強烈需求。在這種意愿的號召下,我們會毫不猶豫地選擇展開功能。圖片

    ▲ 在豆瓣電影介紹頁中,在劇情簡介區域會有「展開」提示,如果我們選擇展開,說明我們有觀看完整簡介的意愿,并且是主動選擇展開,不添加「收起」選項正好避免了給我們增加操作上的負擔

    另外,當內容相對沒那么多,能在一屏上顯示,不需要用戶上下滑動太多時,可以考慮省去收起,比如在QQ群介紹、抖音個人頁的簡介等。

     

    最后

    以上是我對展開和收起的運用場景的一些小思考,主要從場景角度來考慮交互邏輯。

    授人以魚不如授人以漁,關于展開和收起的場景還有很多,希望大家能掌握這樣的思考邏輯,去發掘更深層的設計內容,當然有問題咱們可以隨時溝通~

     

    原文地址:Clip設計夾(公眾號)

    作者:Clippp

    轉載請注明:學UI網》展開全文后需要支持收起嗎?從運用場景分析交互邏輯

    藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

    截屏2021-05-13 上午11.41.03.png

    分享此文一切功德,皆悉回向給文章原作者及眾讀者.
    免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

    藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務




    日歷

    鏈接

    個人資料

    藍藍設計的小編 http://www.skdbbs.com

    存檔

    主站蜘蛛池模板: 中文字幕精品无码一区二区| 亚洲一区精品伊人久久伊人| 国产精品主播一区二区| 亚洲精品亚洲人成人网| 国产成人久久精品麻豆一区| 久久久久99精品成人片试看| 精品国产爽爽AV| 久久久九九有精品国产| 久久精品国产亚洲AV无码偷窥| 久久精品人妻一区二区三区| 久久国产成人精品麻豆| 国产精品无码A∨精品影院| 区亚洲欧美一级久久精品亚洲精品成人网久久久久 | 国产精品国产三级国产专播 | 欧美日韩国产精品自在自线| 国产精品99在线播放| 精品亚洲综合久久中文字幕| 国产麻豆精品一区二区三区v视界| 中文字幕久久精品| 久久久不卡国产精品一区二区| 国产高清在线精品一区二区三区| 久久亚洲国产午夜精品理论片| 国产精品第12页| 国产亚洲精品岁国产微拍精品| 无码国内精品人妻少妇| 国产99视频精品一区| 国产精品天干天干综合网| 少妇精品久久久一区二区三区 | 午夜精品久久久久成人| 久久精品成人免费观看97| 国产精品久操视频| 国产精品99久久久久久董美香| 国产精品午夜福利在线无码| 国产91在线精品| 国产精品99久久久久久猫咪| 国产成人综合精品一区| 99久久国产热无码精品免费久久久久| 久久久精品一区二区三区| 亚洲综合一区二区国产精品| 6080亚洲精品午夜福利| 国产成人精品久久综合|