亚洲欧美v国产一区二区三区,中文字日产幕乱五区,综合亚洲,,,色,亚洲伊人久久大香线蕉综合,亚洲综合精品伊人久久

首頁 > SEO動態(tài) > 網(wǎng)站技術(shù)如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

小程序是 SaaS 類產(chǎn)品實(shí)現(xiàn)商業(yè)價值的載體,針對小程序設(shè)計(jì)輕量、聚焦、快捷的特點(diǎn),是否有一種輕量高效的設(shè)計(jì)方法,可以把已有的設(shè)計(jì)能力更高效的投射到小程序設(shè)計(jì)中呢?我們通過千帆易銷小程序設(shè)計(jì)實(shí)踐,對此進(jìn)行了思索和實(shí)踐,以期提供一個更佳的答案。

一、小程序的特點(diǎn)

小程序是 SaaS 類產(chǎn)品實(shí)現(xiàn)商業(yè)價值的載體,也是構(gòu)建產(chǎn)品生態(tài)的重要組成。隨著微信生態(tài)愈加豐富和壯大,小程序?qū)τ谏虡I(yè)目標(biāo)的達(dá)成也起到越來越大的作用。

小程序具有輕量、聚焦、快捷等特點(diǎn),這有別于 web 端類和移動端 app 類產(chǎn)品。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

小程序的特點(diǎn)

目前主流的設(shè)計(jì)理論,如設(shè)計(jì)思維、雙鉆模型、環(huán)形模型等,設(shè)計(jì)流程比較長,使用比較復(fù)雜、耗時久。針對小程序設(shè)計(jì)輕量、聚焦、快捷的特點(diǎn),是否有一種輕量高效的設(shè)計(jì)方法,可以把已有的設(shè)計(jì)能力更高效的投射到小程序設(shè)計(jì)中呢?

我們通過千帆易銷小程序設(shè)計(jì)實(shí)踐,對此進(jìn)行了思索和實(shí)踐,以期提供一個更佳的答案。

二、構(gòu)建千帆易銷小程序設(shè)計(jì)方法

千帆易銷小程序的主要場景圍繞商品的營銷推介展開,可跟進(jìn)商品使用情況,并進(jìn)一步轉(zhuǎn)化和完成商務(wù)合作。

基于項(xiàng)目需要,我們先后完成了千帆商品價值感知提升、商品內(nèi)容優(yōu)化、物料使用提效等設(shè)計(jì)內(nèi)容。在這個過程中,對于小程序的設(shè)計(jì)流程進(jìn)行了進(jìn)一步的提煉,發(fā)現(xiàn)小程序的設(shè)計(jì)流程可以總結(jié)為如下步驟:

包括「首頁價值設(shè)計(jì)」「定位路徑設(shè)計(jì)」「信息組合設(shè)計(jì)」「場景化內(nèi)容設(shè)計(jì)」以及「效率提升設(shè)計(jì)」。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

小程序設(shè)計(jì)的關(guān)鍵步驟

1. 首頁價值設(shè)計(jì)——首頁多維價值露出,打造第一印象的沖擊

引發(fā)用戶興趣,實(shí)現(xiàn)促活

小程序的第一印象非常關(guān)鍵,因此對于首頁設(shè)計(jì),關(guān)鍵要加強(qiáng)業(yè)務(wù)價值的露出,給予用戶盡可能直觀的信息感知,加快建立其對于業(yè)務(wù)價值的興趣,加強(qiáng)用戶的正向期待。

首頁價值露出有三種模式:點(diǎn)狀價值、面狀價值、條狀價值。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

價值露出模式

在千帆易銷小程序中,通過多種模式的價值的呈現(xiàn),在首頁構(gòu)建出 F 形價值流,增強(qiáng)商品等價值感知效果,提升用戶活躍度。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

提煉多維度價值屬性

首頁的注意力表達(dá)要點(diǎn)在于線索要鮮明突出。通過精致、統(tǒng)一、明確的元素來進(jìn)行引導(dǎo),賦予用戶深入使用的線索。所以,可以通過細(xì)化多維度屬性進(jìn)一步增強(qiáng)用戶價值判斷,提升體驗(yàn)觀感,包括精簡的文本、精致的圖標(biāo)、指向性符號、探索性入口、聯(lián)想性元素等。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

多維度屬性細(xì)化

下圖是在千帆易銷小程序設(shè)計(jì)中,對首頁卡片屬性進(jìn)行的相關(guān)細(xì)化,充分闡釋多維度價值,進(jìn)一步豐富價值內(nèi)涵。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

千帆易銷小程序的多維度屬性細(xì)化

加深用戶印象感知

由于第一印象的建立過程比較短暫,可以采用靈活多樣的交互形式加深用戶印象感知,比如凸顯核心觸點(diǎn)、提供模塊級沉浸感、平滑進(jìn)退機(jī)制等方式。

在千帆易銷小程序中,在查看商品的過程中提供全時段吸頂可見,加強(qiáng)信息觸點(diǎn)映射,從而吸引用戶點(diǎn)擊深化使用;對于商品的屬性類信息內(nèi)容,提供模塊級沉浸查閱,提升首頁時效,最大可能覆蓋用戶查閱細(xì)分的需要;保證首頁高頻操作盡可能平滑,比如在滑動查看信息的過程中提供數(shù)量信息,方便用戶感知下探情況。由此建立起平滑的進(jìn)退機(jī)制,營造操作的暢快感。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

千帆易銷小程序的首頁操作設(shè)計(jì)

當(dāng)用戶建立起良好的第一印象之后,將會進(jìn)入使用階段,并更有可能深層次的使用產(chǎn)品,從而帶來更多轉(zhuǎn)化的可能。

2. 定位路徑設(shè)計(jì)——構(gòu)建多元導(dǎo)航路徑,豐富用戶定位鏈路

豐富多元路徑感知

因?yàn)樾畔⒌亩鄻有约捌鋬r值呈現(xiàn)的差異,需要我們通過構(gòu)建快捷導(dǎo)航,來提升不同信息的定位效率。導(dǎo)航設(shè)計(jì)的關(guān)鍵點(diǎn)在于識別信息類型的特點(diǎn),提供適當(dāng)?shù)膶?dǎo)航方式,提升用戶參與度。

對于首頁的關(guān)鍵內(nèi)容信息,應(yīng)提供快捷路徑或沉浸式的導(dǎo)航路徑:

  1. 首頁-浮窗-二級頁面:適用于關(guān)鍵內(nèi)容快速感知
  2. 首頁-頂部標(biāo)簽導(dǎo)航-二級頁面:適用于主內(nèi)容下細(xì)分的內(nèi)容導(dǎo)航

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

首頁關(guān)鍵信息導(dǎo)航設(shè)計(jì)

對于獨(dú)立性更強(qiáng)的信息,則可以通過切換底部 tab 標(biāo)簽或者二級頁面來進(jìn)行導(dǎo)航:

  1. 首頁-底部 tab 導(dǎo)航-二級頁面:適用于相互獨(dú)立的主內(nèi)容模塊
  2. 首頁-二級頁面-子頁面:適用于詳細(xì)內(nèi)容的漸進(jìn)查閱圖片

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

二級頁面導(dǎo)航設(shè)計(jì)

提供多種定位方式,滿足不同用戶選用

不同的用戶類型可能有不同的體驗(yàn)訴求,如新用戶和存量用戶有不同的用戶目標(biāo)。

  1. 對于新用戶:信息推薦、信息分類、場景化分類等可以提供較好的定位體驗(yàn),幫助用戶快速帶入產(chǎn)品場景,降低流失。
  2. 對于存量用戶:全局搜索、列表篩選、信息分類等可以提供更穩(wěn)定的定位體驗(yàn),有助于加強(qiáng)用戶粘性,提升轉(zhuǎn)化概率。

如下圖在千帆易銷小程序部分定位方式的效果,定位方式嵌套使用,比如在解決方案場景化的定位過程中,同時提供了推薦和篩選等來增強(qiáng)方案定位效果。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

不同的定位方式

3. 信息組合設(shè)計(jì)——理順關(guān)鍵信息組合,加深業(yè)務(wù)感召力

從信息組合視角塑造整體感

每一類信息都有其特點(diǎn),要盡可能選取最適合的信息組合來最大化提升業(yè)務(wù)感知,搭建適用的信息組合。通常信息組合有以下四類:

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

不同的信息類型

在千帆易銷小程序改版前,提供了商品的簡介、交付信息、咨詢聯(lián)系人、解決方案、客戶案例、售賣支持、物料等信息。

我們在新版本補(bǔ)充了商品的優(yōu)勢和價值、適用場景、銷售機(jī)會、銷售政策等售賣說明類信息,從整體上豐富和完善了商品信息組合,增強(qiáng)了對用戶的吸引力。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

改版前后的信息差異

提供差異化信息表達(dá),加深印象

信息表達(dá)的要點(diǎn)是直觀、清晰、高效,對于信息類型多樣化的頁面,可以通過差異化信息表達(dá),加深用戶印象,加強(qiáng)信息傳達(dá)效果。下圖是在易銷設(shè)計(jì)中使用的信息表達(dá)圖譜,有助于我們詮釋這種印象做法。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

差異化信息表達(dá)

4. 場景化內(nèi)容設(shè)計(jì)——貼近真實(shí)用戶場景,提供針對性內(nèi)容

情境化提供所需內(nèi)容

對于內(nèi)容數(shù)量較多的場景,諸如列表頁、產(chǎn)品頁、詳情頁等內(nèi)容頁面,如何提供內(nèi)容則非常重要。

在千帆易銷小程序中,我們對于解決方案和案例提供了行業(yè)情境的區(qū)分,此外還提供了按照角色提供,以及按照使用流程提供等情境化方式。從而加強(qiáng)文檔物料的快速感知,方便用戶按相應(yīng)情境使用,提升導(dǎo)航效率。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

情境化信息設(shè)計(jì)

大顆粒場景容器聚合內(nèi)容

對于場景,存在不同的顆粒,大顆粒的場景容器,信息層級更多,信息表達(dá)也更加豐富,所以更需要精心設(shè)計(jì)。比如解決方案以及專題,均融合了多種場景的容器形式,它們最大的特點(diǎn)是"匯聚"。

在這類大顆粒場景容器中,需要傳達(dá)其價值點(diǎn)、內(nèi)容包和聯(lián)絡(luò)線。

價值點(diǎn):提煉具有感召力的文案;

內(nèi)容包:提供強(qiáng)相關(guān)的內(nèi)容組合;

聯(lián)絡(luò)線:實(shí)現(xiàn)大顆粒的商務(wù)接觸和商機(jī)轉(zhuǎn)化。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

大顆粒場景容器

如下圖是易銷解決方案場景和專題場景的價值點(diǎn)/內(nèi)容包/聯(lián)絡(luò)線的設(shè)計(jì),沉浸式的內(nèi)容交互保證用戶快捷觸達(dá)核心價值,同時聯(lián)絡(luò)線的指引暗含其中,加強(qiáng)了用戶轉(zhuǎn)化。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

千帆易銷小程序大顆粒場景容器

5. 效率提升設(shè)計(jì)——連貫用戶操作觸點(diǎn),提升使用效率

在設(shè)計(jì)中,需要綜合場景流程觸點(diǎn)進(jìn)行有效銜接,從而貫通流程體驗(yàn),提升用戶總體使用效率。這個環(huán)節(jié)可以在前四步的過程中同步開展,并在設(shè)計(jì)進(jìn)入后期時再次集中開展,確保全流程、全場景、全周期覆蓋。

連通流程銜接點(diǎn),打造無縫體驗(yàn)

采用銜接流程節(jié)點(diǎn)、縮短流程路徑、邊界節(jié)點(diǎn)兜底等舉措來提升效率,提供沉浸式無縫體驗(yàn)。

銜接流程節(jié)點(diǎn):

  1. 對于使用過程,提供返回首屏/返回首頁/吸頂?shù)?,有效銜接用戶返回流程?
  2. 對于下鉆類操作,在返回初始頁面時提供錨點(diǎn)定位,方便用戶接續(xù)操作

縮短操作路徑:

  1. 通過浮窗提供關(guān)聯(lián)內(nèi)容快速觸達(dá),協(xié)助用戶快速完成關(guān)聯(lián)信息定位。
  2. 通過橫向滑動查看同類型內(nèi)容,便于比對和加深首尾效應(yīng)。

邊界節(jié)點(diǎn)兜底:

  1. 對于初始頁面/無資源頁面提供空狀態(tài)引導(dǎo)
  2. 對于搜索/篩選無結(jié)果場景提供快反饋途徑等。圖片

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

沉浸式無縫體驗(yàn)

拉通信息容器交互,提升信息獲取效果

對于信息,既要考慮其特性,也要兼顧共性。小程序中大量使用卡片、列表、對話框等容器,而這些信息容器可以通過標(biāo)簽化、統(tǒng)一樣式、突出重點(diǎn)、快捷聯(lián)動等交互方式,提升信息交互效率。

以千帆易銷卡片設(shè)計(jì)為例: 對商品、解決方案、文檔等多種核心信息卡片樣式,通過拉通標(biāo)簽、文本、圖標(biāo)、按鈕等多種組成元素,加強(qiáng)卡片信息掃描的統(tǒng)一性和交互的一致性。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

千帆易銷小程序信息容器設(shè)計(jì)

提供快捷分享,提升多端聯(lián)動效率

小程序一個重要的優(yōu)勢在于微信生態(tài),有必要充分利用微信生態(tài),借力發(fā)力,實(shí)現(xiàn)更好的產(chǎn)品觸達(dá)效果。小程序分享,關(guān)鍵在于要快捷,同時要協(xié)同多端聯(lián)動。

首先,提供統(tǒng)一的分享入口并引導(dǎo)用戶完成前置的相關(guān)操作,可以通過提供初次引導(dǎo)以及明顯的懸浮按鈕等方式來加強(qiáng)用戶對分享的感知和了解。

其次,給用戶明確的分享牽引,提升用戶分享意愿。

最后,要考慮多端分享使用聯(lián)動,小程序的分享不僅僅在于移動端,還有大量的 pc 端使用環(huán)節(jié),需要有效的聯(lián)動。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

小程序分享的三個關(guān)鍵

千帆易銷小程序的分享流程是這樣的:

在分享前置階段:提供統(tǒng)一的常駐入口并引導(dǎo)用戶完成預(yù)前的操作;

分享中給予引導(dǎo)和輔助:提供用戶明確的分享牽引,提升用戶分享意愿;

分享后可在 PC 端快捷下載使用:打通 PC 端物料的使用流程,完成物料下載使用。

通過貫通分享前、中、后環(huán)節(jié),提升用戶分享使用效率。

如何做好SaaS類產(chǎn)品的小程序設(shè)計(jì)?來看騰訊的實(shí)戰(zhàn)案例!

千帆易銷小程序分享流程設(shè)計(jì)

三、總結(jié)

小程序設(shè)計(jì)要貼合其輕量、聚焦、快捷的特點(diǎn),千帆小程序設(shè)計(jì)方法核心在于通過一個系統(tǒng)性的設(shè)計(jì)框架來貫通小程序設(shè)計(jì)流程,減少設(shè)計(jì)阻塞,提升小程序設(shè)計(jì)交付的質(zhì)量和效率。

小程序設(shè)計(jì)是一個不斷創(chuàng)新和發(fā)展的設(shè)計(jì)領(lǐng)域,我們也會不斷的拓展和完善小程序設(shè)計(jì)方法的內(nèi)涵,打造更先進(jìn)更具創(chuàng)造力的方法論。

作者:騰訊云設(shè)計(jì)中心

想了解更多網(wǎng)站技術(shù)的內(nèi)容,請?jiān)L問:網(wǎng)站技術(shù)

本文來源:http://www.sonygallery.com.cn/seodongtai/18094.html

免責(zé)聲明:部分文章信息來源于網(wǎng)絡(luò)以及網(wǎng)友投稿,本網(wǎng)站只負(fù)責(zé)對文章進(jìn)行整理、排版、編輯,是出于傳遞更多信息之目的,并不意味著贊同其觀點(diǎn)或證實(shí)其內(nèi)容的真實(shí)性,不承擔(dān)任何法律責(zé)任。