旗下產(chǎn)業(yè): A產(chǎn)業(yè)/?A實(shí)習(xí)/?A計(jì)劃
全國(guó)統(tǒng)一咨詢熱線:010-5367 2995
首頁(yè) > 熱門文章 > UI設(shè)計(jì) > UI設(shè)計(jì)中分享功能總結(jié)

UI設(shè)計(jì)中分享功能總結(jié)

時(shí)間:2020-09-28來(lái)源:mwtacok.cn點(diǎn)擊量:作者:Gella
時(shí)間:2020-09-28點(diǎn)擊量:作者:Gella

  人天生就有分享的習(xí)慣,當(dāng)聽(tīng)到一首好歌,看到一本好書,或是聽(tīng)到一個(gè)有趣的故事,總是會(huì)想要分享給別人,如果朋友在聽(tīng)到分享內(nèi)容之后表示高興和喜歡,會(huì)讓分享者的滿足和快樂(lè)感更上一層樓。今天AAA教育郭老師主要和大家淺談一下 APP 中的分享功能模塊。
 

  目錄
 

  1.分享的作用
 

  2.分享的時(shí)機(jī)
 

  3.分享的常見(jiàn)位置
 

  4.分享的常見(jiàn)樣式
 

  5.總結(jié)
 

  分享的作用
 

  APP 中的分享,就是把各種內(nèi)容介紹給別人的過(guò)程,主要是借助社交類 APP 的流量, 來(lái)達(dá)到拉新、留存、促活的作用。分享是內(nèi)容最有效的分發(fā)途徑,可以大大降低企業(yè)的營(yíng)銷成本。
 

  分享的時(shí)機(jī)
 

  1.主動(dòng)分享
 

  主動(dòng)分享主要取決于內(nèi)容,當(dāng)用戶感覺(jué)內(nèi)容足夠優(yōu)質(zhì)、有趣,或?qū)ψ约河兴鶐椭鷷r(shí),就可以通過(guò)分享按鈕把內(nèi)容分享給親朋好友。按鈕通常會(huì)擺放在頁(yè)面中比較顯眼的位置,如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  比如我比較喜歡聽(tīng)歌,每每聽(tīng)到興起,總要分享到 QQ空間或者分享給喜歡聽(tīng)歌的朋友。有時(shí)看到了有趣的視頻,也會(huì)忍不住想分享出去。
 

  2.截屏分享
 

  很多 APP 都會(huì)在截屏的時(shí)候彈出分享彈窗,提示引導(dǎo)用戶去進(jìn)行分享。這樣的好處是可以縮短操作路徑,減少用戶的操作成本,同時(shí)也可以避免因?yàn)椴僮髀窂教L(zhǎng),導(dǎo)致用戶遺忘或者嫌麻煩放棄分享的情況。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  以攜程旅行和網(wǎng)易云音樂(lè)為例,攜程旅行的車次詳情頁(yè)和網(wǎng)易云的歌曲詳情頁(yè)截屏?xí)r都會(huì)彈出分享彈窗,提示用戶去分享。
 

  3.瀏覽一定內(nèi)容后提示
 

  用戶在瀏覽完一定的內(nèi)容后,分享按鈕悄悄的變成了微信分享。用戶如果對(duì)內(nèi)容不感興趣的話肯定就直接返回了,只有在對(duì)內(nèi)容感興趣的前提下才會(huì)進(jìn)一部瀏覽,這種方式通過(guò)明顯的前后變化的對(duì)比,把用戶的目光吸引到分享按鈕上,提示引導(dǎo)用戶進(jìn)行分享。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

UI設(shè)計(jì)中分享功能總結(jié)

 

  以馬蜂窩和抖音為例,在馬蜂窩的頁(yè)面中,用戶翻了幾張照片或是向上瀏覽了一定的文字內(nèi)容,頁(yè)面右下角的分享按鈕就會(huì)變成微信分享。而抖音中,當(dāng)一個(gè)視頻看了兩遍之后,分享按鈕則會(huì)變成微信分享。
 

  4.完成任務(wù)后分享
 

  當(dāng)一項(xiàng)任務(wù)完成后,會(huì)彈出分享彈窗,便于用戶快捷的進(jìn)行分享,同時(shí)也借助了人類喜歡炫耀的心理來(lái)達(dá)到拉新、促活的目的。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  以 Keep 為例,每當(dāng)完成一次健身任務(wù),就會(huì)彈出分享彈窗。
 

  分享的常見(jiàn)位置
 

  1.頁(yè)面右上角
 

  這是最長(zhǎng)常見(jiàn)的一個(gè)位置,比較顯眼,有些 APP 在頁(yè)面中直接擺了一個(gè)分享按鈕,而有些 APP 把分享功能放在了更多的按鈕中。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  上圖中的京東和微信讀書頁(yè)面,都在右上角直接擺放了分享按鈕。

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  而站酷和知乎的頁(yè)面中,擊右上角的更多彈出分享模塊。
 

  2.頁(yè)面中間
 

  在視頻類 APP 中比較常見(jiàn),通常是我們還沒(méi)有把視頻全屏展開(kāi)時(shí),會(huì)在標(biāo)題內(nèi)容下面擺放一個(gè)分享按鈕,如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  以騰訊視頻、愛(ài)奇藝、嗶哩嗶哩為例,它們都把分享按鈕和點(diǎn)贊、下載、收藏幾個(gè)功能并列在一起,放在標(biāo)題簡(jiǎn)介的下方。
 

  3.頁(yè)面底部
 

  這也是一個(gè)比較常見(jiàn)的擺放位置,處在拇指熱區(qū)中,能更方便用戶點(diǎn)擊,如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  以QQ音樂(lè)和蝦米音樂(lè)為例,它們都把分享按鈕放在頁(yè)面底部,處在手指最容易點(diǎn)擊的位置。
 

  4.跟隨內(nèi)容
 

  在每一條內(nèi)容的的下面,都會(huì)有一個(gè)分享按鈕,通常出現(xiàn)在社交類 APP 中,如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  分享的常見(jiàn)樣式
 

  這里的樣式指的是內(nèi)容分享到社交類 APP 后所表現(xiàn)的樣式,接下來(lái)主要闡述了鏈接、圖片、網(wǎng)頁(yè)、音頻四種。
 

  1.鏈接
 

  通常是簡(jiǎn)單的文字描述加上跳轉(zhuǎn)鏈接,比較簡(jiǎn)單明了,讓人一眼就明白這是可以點(diǎn)擊的鏈接,如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  2.圖片
 

  以圖片為主要展示內(nèi)容,用戶對(duì)分享的內(nèi)容可以一目了然,并且圖片能夠快速地向用戶傳達(dá)信息,減少用戶的閱讀成本。如果圖片設(shè)計(jì)的足夠精美,比較容易引起人們查看的欲望。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  3.網(wǎng)頁(yè)
 

  這是最常見(jiàn)的樣式,分享的內(nèi)容大多是一段文字和一張縮略圖,用戶點(diǎn)擊可以跳轉(zhuǎn)到對(duì)應(yīng)的 APP 頁(yè)面,文字和縮略圖都能向用戶傳遞一定的內(nèi)容信息,便于用戶作出判斷是否要打開(kāi)。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  4.音頻
 

  它和網(wǎng)頁(yè)分享基本一樣,只不過(guò)在縮略圖上加了一個(gè)播放按鈕。用戶點(diǎn)擊播放按鈕則可以快速地聽(tīng)到音頻內(nèi)容,省去跳轉(zhuǎn)的步驟,節(jié)省了用戶的操作成本。如下圖:

 

UI設(shè)計(jì)中分享功能總結(jié)

 

  總結(jié)
 

  今天主要講述的一件事是關(guān)于分享模塊的一些思考,我總結(jié)了以下3點(diǎn):
 

  1.分享的主要作用是借助社交類 APP 的流量, 來(lái)達(dá)到拉新、留存、促活的作用。
 

  2.在合適的時(shí)機(jī)、情景下提醒引導(dǎo)用戶進(jìn)行分享,往往能達(dá)到出其不意的效果。
 

  3.把分享方式設(shè)計(jì)的美觀和便捷,比如設(shè)計(jì)美觀的圖片和添加播放按鈕,可以吸引用戶點(diǎn)擊和提升用戶的使用體驗(yàn)。
 

  4. 因此,您現(xiàn)在已經(jīng)了解了與UI設(shè)計(jì)師的工作相關(guān)的主要技能。如果您想了解更多信息,請(qǐng)?jiān)L問(wèn)AAA教育,包含有關(guān)在該領(lǐng)域工作的更多相關(guān)文章。



 

預(yù)約申請(qǐng)免費(fèi)試聽(tīng)課

填寫下面表單即可預(yù)約申請(qǐng)免費(fèi)試聽(tīng)!怕錢不夠?可先就業(yè)掙錢后再付學(xué)費(fèi)! 怕學(xué)不會(huì)?助教全程陪讀,隨時(shí)解惑!擔(dān)心就業(yè)?一地學(xué)習(xí),可推薦就業(yè)!

?2007-2021/北京漫動(dòng)者教育科技有限公司版權(quán)所有
備案號(hào):京ICP備12034770號(hào)

?2007-2022/ mwtacok.cn 北京漫動(dòng)者數(shù)字科技有限公司 備案號(hào): 京ICP備12034770號(hào) 監(jiān)督電話:010-53672995 郵箱:bjaaa@aaaedu.cc

京公網(wǎng)安備 11010802035704號(hào)

網(wǎng)站地圖