9000字實(shí)操指南:換個(gè)姿勢深入微信小程序

7 評(píng)論 23304 瀏覽 152 收藏 43 分鐘

本文作者將從技術(shù)層面為你解析小程序到底是什么、小程序的入口和小程序應(yīng)用場景,以及探討了該不該做小程序的問題,甚至還分享了小程序的一些要點(diǎn)。小編看完后,一臉萌比……

前言

Q: Jinkey, 可以概括一下小程序嗎?

A:這也不行,那也不行

Q:丫的,你能不能正經(jīng)點(diǎn)……

A:用完就滾

Q:……

資本如嫖客,各個(gè)平臺(tái)和垂直類掠奪者已經(jīng)瓜分掉了線上流量,那么未來爭奪的流量戰(zhàn)場必然在實(shí)體場景,很多巨頭其實(shí)已經(jīng)證明了線下流量龐大的潛力。在快遞包裹上印上自己的二維碼關(guān)注公眾號(hào)形成二次寄出快遞的粘性,Pokemon Go 讓用戶在實(shí)體地圖上捕獲小精靈。

未來的入口不限于二維碼,而是一切的富媒體。二維碼之于2D識(shí)別,復(fù)雜圖案之于 AR,語音指令之于 Siri,會(huì)發(fā)射信號(hào)的一個(gè)芯片;使用這些入口的不限于人類,對(duì)這些入口的識(shí)別,除了人掃二維碼,還有無人駕駛汽車識(shí)別路標(biāo),尋找實(shí)體商店坐標(biāo);智能助手根據(jù)主人偏好自動(dòng)在電商平臺(tái)尋找合適的商品并且下單。

一句話來說,未來的流量來自線下,流量的入口來自多媒體,整個(gè)戰(zhàn)場會(huì)從移動(dòng)互聯(lián)網(wǎng)到“實(shí)體互聯(lián)網(wǎng)”轉(zhuǎn)變,作為后續(xù)的“物聯(lián)網(wǎng)”全民化的過渡。

那么小程序之于微信,就是利用二維碼這種富媒體(圖像),把線下商家的流量聚攏到微信。另外,從微信的服務(wù)類目看,這將是騰訊向成為互聯(lián)網(wǎng)水和電的目標(biāo)的又一大步,下文會(huì)進(jìn)一步分析。

目錄

1. 企業(yè)注冊(cè)流程

2. 小程序到底是什么

3. 小程序的入口

4. 小程序應(yīng)用場景

5. 該不該做小程序(<重后端,輕前端> 的思想、小程序和H5 的區(qū)別、紅利期、小程序類目)

6. 一些要點(diǎn)

7. 小程序的能力(自帶組件、事件、硬件能力、微信能力)

感興趣的可以加入微信群討論哦(滿人的話請(qǐng)搜索微信號(hào) stackflow 添加,我拉你進(jìn)群):

一、企業(yè)注冊(cè)流程

二、小程序是到底是什么

小程序?qū)懙臅r(shí)候用的是 javascript 這種網(wǎng)頁開發(fā)語言,首次運(yùn)行會(huì)把這個(gè)“網(wǎng)頁”緩存到本地,所以不是不用下載,而是下載的包比較小而已。然后通過 Android 或 iOS 各自的 JSBridge 方法轉(zhuǎn)換成對(duì)應(yīng)的 Java 或 Objective-C 方法運(yùn)行。

比如我在小程序?qū)懥艘粋€(gè)方法:

程序就會(huì)識(shí)別出wx.showToast及其參數(shù)(文字、圖標(biāo)、持續(xù)事件),然后執(zhí)行本地的一個(gè)方法:

彈出一個(gè)原聲的 Toast 組件,上說只是為了方便說明,實(shí)際運(yùn)行環(huán)境會(huì)復(fù)雜的多。

上圖左邊是大家在微信公開課 Pro 會(huì)場上看到的企微云平臺(tái)的快銷上報(bào)小程序,看上去真的很像一個(gè)獨(dú)立 App,雖然我看不到他的源代碼,但是我試著還原其中一個(gè)頁面來舉例子。

一個(gè)頁面都是一個(gè)獨(dú)立的文件夾(微信開發(fā)者工具會(huì)自動(dòng)為你創(chuàng)建),每新增一個(gè)頁面需要在 app.json 文件的 pages 列表新增一項(xiàng)。

一般來說,src 目錄建議用來放置固定的一些企業(yè)介紹視頻或者宣傳圖片等等(整體的包大小不能超過1M)。

如果你不放在這個(gè)目錄,也可以放在你自己的服務(wù)器,遠(yuǎn)程訪問。比如一些經(jīng)常變化的活動(dòng)宣傳 banner

app.json 是可以配置整個(gè)程序的底部導(dǎo)航 tab、導(dǎo)航欄的背景顏色(貌似不能弄成圖片,如果希望做成京東 app 超級(jí)品牌日那種全屏氛圍渲染,建議banner 圖片上半部分使用漸變色過渡到你配置的狀態(tài)欄背景顏色)、導(dǎo)航欄標(biāo)題、導(dǎo)航欄顏色、是否支持下拉刷新等。

app.js 是全局的一些方法,比如獲取用戶信息,全局?jǐn)?shù)據(jù)的配置地方。

js 會(huì)部分轉(zhuǎn)成原生的 java 和 oc 代碼執(zhí)行,那么頁面呢?用的是操作系統(tǒng)原生的組件嗎?帶著這個(gè)疑問用 UI 測試工具打開了微信:

你們看到有一個(gè) YYWKWebview 的東西了嗎?WKWebview是原生的一個(gè)瀏覽器控件,相當(dāng)于只是用小程序打開了一個(gè)下載好的本地網(wǎng)頁。而且用了類似 weex/vue 那樣子的技術(shù),所以頁面切換非常流程。(可以自行百度一下 阿里weex)

上面看到每個(gè)頁面都是一個(gè)文件夾,那么里面的四個(gè)文件都是干什么的呢?

.json 是配置文件。就好比是你的簡歷,上面寫了名字、畢業(yè)時(shí)間等,而小程序的 json會(huì)記錄一些信息:導(dǎo)航欄背景顏色、導(dǎo)航欄標(biāo)題顏色、導(dǎo)航欄標(biāo)題文字內(nèi)容、窗口的背景色、下拉背景字體、loading 圖的樣式、是否開啟下拉刷新、頁面整體能不能上下滾動(dòng)。

.wxml 是頁面的基本骨架。就像骨架規(guī)定了人的大概模樣一般,wxml 是一種類 xml 的結(jié)構(gòu)化文本,描述了小程序頁面有哪些元素。比如一個(gè)文章需要有標(biāo)題、作者、時(shí)間、正文,但是不關(guān)心這些元素怎么排列。

.js 也就是 javascript 這種前端腳本語言的文件。要人的四肢東西來,怎么動(dòng),就需要大腦和肌肉控制,小程序從“骨架”成為“血肉之軀”的正是 js 的作用。js 做一些動(dòng)態(tài)的東西,比如請(qǐng)求數(shù)據(jù),控制元素上下移動(dòng),判斷用戶輸入密碼是否安全等等

.wxss 就是決定整個(gè)頁面元素的顏色等表現(xiàn)形式。好比同一個(gè)人可以穿不同的衣服,化不同的妝,看上去也就不一樣了。在 wxml 文件中同樣寫了一個(gè)按鈕,但可以給他配置不同的背景顏色:

三、小程序的入口

線下實(shí)體(商鋪、停車場、政府服務(wù)窗口等)

比如這個(gè)微信公開課給出的場景例子,我來 YY一下。

在停車場的入口,有一個(gè)攝像頭對(duì)著你的車牌號(hào)碼,當(dāng)你掃碼打開小程序時(shí),點(diǎn)擊開始停車,如果有空余車位,系統(tǒng)會(huì)自動(dòng)打開閘門并記錄開始停車的時(shí)間。這時(shí)候小程序會(huì)展示室內(nèi)地圖,引導(dǎo)你先左轉(zhuǎn)再右轉(zhuǎn)到達(dá)目標(biāo)車位,停好車走人。等你來取車的時(shí)候,開車到閘門口,再次掃描二維碼或直接從歷史記錄打開小程序,選擇結(jié)束停車,調(diào)起微信支付,停車場攝像頭識(shí)別車牌號(hào)碼,打開閘門放行。

整個(gè)過程無需取停車卡和專職工作人員服務(wù),環(huán)保也節(jié)省人力成本。

線上PC導(dǎo)航站

移動(dòng)導(dǎo)航站

微信群分享

性冷淡風(fēng)格(從程序介紹頁分享出來)

欲罷不能的風(fēng)格(從程序內(nèi)頁分享出來)

關(guān)鍵詞精準(zhǔn)搜索

發(fā)現(xiàn)入口

聊天列表頂部

四、小程序應(yīng)用場景

應(yīng)用場景主要分為微信群協(xié)作實(shí)體服務(wù)。

微信群協(xié)作

微信群協(xié)作主要是一些企業(yè)內(nèi)部服務(wù)的或者工作上的溝通。

問卷投票:公司要開展年會(huì)了,做那個(gè)活動(dòng)好呢?通過小程序發(fā)布的投票并且分享到群里,可以實(shí)時(shí)看到前三名。

會(huì)議助手:臨時(shí)召開緊急會(huì)議,需要相關(guān)人盡快確定參會(huì)情況,往群里拋一個(gè)開會(huì)通知小程序,特定的人才能打開了解會(huì)議內(nèi)容并確認(rèn),誰參加誰請(qǐng)假,參與人數(shù)多少一目了然?;顒?dòng)時(shí)間點(diǎn)到了,還可通過小程序的消息服務(wù)能力給參會(huì)人發(fā)送參會(huì)提醒;到了參會(huì)現(xiàn)場打開小程序就能簽到,真正意義上的需要用時(shí)就用,用完就走。

雖然很多辦公場景用企微的微信企業(yè)號(hào)組件也可以做到,但是并不是每個(gè)企業(yè)都有一個(gè)企業(yè)號(hào),對(duì)于普通小公司小團(tuán)隊(duì)來說,這些能力還是做到小程序上快捷方便。

實(shí)體服務(wù)

睡覺前,掃描一下床頭的二維碼貼,打開“Jinkey 外賣”,下單叫了一個(gè)早餐外賣,然后掃描一下“JJ 智能家居”小程序二維碼,檢測到現(xiàn)在是晚上,自動(dòng)關(guān)燈。跟 siri (iOS 智能語音助手)說一句,“晚安,明天7點(diǎn)叫我起床哦”,然后美美地睡上一覺。

第二天,siri 把我叫了起床,等了一會(huì),早餐也送到了,吃完,打開微信聊天窗口的小程序服務(wù)通知,點(diǎn)開早餐外賣支付成功的模板消息,進(jìn)入“Jinkey 外賣”的小程序頁給了個(gè)差評(píng)(要收錢的還不給差評(píng)?!哈哈哈)。吃完早餐就出門。

昨天車放在公司了,那今天就騎車吧,在樓下找到肉色的自行車,打開 摸拜單車 的小程序,掃一掃完成了開鎖,騎上去,愉快地回到公司。

來到公司打開,簽到小程序,掃一下公司前臺(tái)動(dòng)態(tài)變化的二維碼,同時(shí)小程序識(shí)別出我的地理位置,打卡成功!回到座位上開始奮斗的一天。

中午吃飯,同事都說餓了吧外賣有優(yōu)惠。那趕緊打開餓了吧小程序,黃燜雞30元免運(yùn)費(fèi),于是我發(fā)起了一個(gè)組團(tuán)買,然后把這個(gè)頁面分享到公司群,小伙伴們點(diǎn)進(jìn)去頁面選擇自己要的套餐,各自支付完成后,分別都收到了一條“付款成功,正在配送”的模板消息。

然后小程序上還可以實(shí)時(shí)看到外賣小哥去到哪里了,超級(jí)貼心的。

中午睡覺,插上耳機(jī),打開小睡眠小程序聽著舒適的背景音樂。

下班的時(shí)候可以開車咯,到地下車庫取車,開車到閘門口,再次掃描二維碼或直接從歷史記錄打開小程序,選擇結(jié)束停車,調(diào)起微信支付,停車場攝像頭識(shí)別車牌號(hào)碼,打開閘門放行。到地面接了幾個(gè)同事一起到億達(dá)廣場找吃的,附近沒有停車場就隨便找了一個(gè)空地停車。下車之后看到一個(gè)碩大的廣告牌:

探鳥搞特價(jià)耶,趕緊掃碼打開探鳥的小程序二維碼,點(diǎn)擊排隊(duì)按鈕,提示前面還有5個(gè)人,不錯(cuò)很快到了,等到還有 2 個(gè)人的時(shí)候,小程序提示我可以點(diǎn)餐下單了,那我們 5 個(gè)人就點(diǎn)兩只雞吧,應(yīng)該夠飽了。

因?yàn)楹攘它c(diǎn)酒,喝酒不開車,吃飽之后,打開杜杜出行叫代駕。

去取車的時(shí)候發(fā)現(xiàn),握草!有一張違停罰單……醉了,掃一下上面的二維碼,打開了**交警的小程序二維碼,輸出車牌號(hào)碼,系統(tǒng)自動(dòng)拉出罰單列表,單擊剛剛的違停罰單,用微信支付完成了繳費(fèi)。所以各位老司機(jī)不要亂停車哦。

…………………………………以上故事純屬虛構(gòu)…………………………………………

五、該不該做小程序

去年年初我寫過一篇文章《應(yīng)用號(hào)可以干翻應(yīng)用商店?你想太多了吧》有說到過這個(gè)問題,那么如今小程序正式推出,我們?cè)賮硖接懸幌隆?/p>

<重后端,輕前端> 的思想在商業(yè)上的實(shí)踐

重后端,輕前端是技術(shù)架構(gòu)上一種策略,因?yàn)榍岸舜a更容易被反編譯和破解,所以很多核心邏輯和算法放在服務(wù)器后臺(tái)運(yùn)行。在商業(yè)環(huán)境中,其實(shí)這種想法也非常適用。

回顧一下人類發(fā)展過程各種“前端”的呈現(xiàn)形式:

龜甲、獸骨、竹簡、木牘、金石、縑帛——紙張——PC 電腦web網(wǎng)頁——黑白屏手機(jī)短信——智能手機(jī)時(shí)代的 iOS、安卓 APP——移動(dòng)端 H5——公眾號(hào)服務(wù)號(hào)、小程序——智能眼鏡——智能硬件上的顯示屏——直接把信息輸入大腦

這些東西都在飛速變化,而不變的是什么?信息本身的價(jià)值、對(duì)信息處理、以及核心服務(wù)的價(jià)值是不變的。一千年前你去餐館為了吃飯,今天你去餐館也是為了吃飯;10年前你去酒店為了 xxoo,今天你去還是為了xxoo;更多時(shí)候我們應(yīng)該注重自身服務(wù)和商業(yè)的閉環(huán),無論是 app 還是小程序,他只是一種呈現(xiàn)形式,如果你飯館的菜非常難吃,那么不管你把自己發(fā)布到餓了吧外賣平臺(tái)、小眾點(diǎn)評(píng)亦或是趕時(shí)髦做個(gè)小程序,依然沒什么人去關(guān)顧你的餐廳。

專心做你的核心服務(wù),其他的交給第三方去做,他們有規(guī)模優(yōu)勢自然能做得更好更便宜。

小程序、H5 的區(qū)別

正如上文“小程序真面目”那一章所說的,微信小程序就是一個(gè)緩存到本地的網(wǎng)頁。

為什么小程序比 H5 流暢和酷炫啊?

因?yàn)樾〕绦蚓彺娴搅吮镜?,在二次打開的時(shí)候無需要再加載,但果真如此嗎?如果小程序開發(fā)者把很多圖片、文字等頁面元素都做成動(dòng)態(tài)加載且不做緩存,那么你每次打開小程序相當(dāng)于……重新下載了一遍 app,跟原來的 H5是一樣的。

但是原來 H5的頁面切換不流暢總是要加載,小程序不會(huì)啊,你怎么能說小程序和 H5一樣呢?

原因在于之前大部分外包開發(fā)商更傾向于一個(gè)個(gè)單獨(dú)頁面寫,頁面邏輯混亂,當(dāng)要跳轉(zhuǎn)到新的頁面就得重新向服務(wù)器請(qǐng)求一個(gè)頁面,極其惡心。

隨著 vue 等前端框架的普及,越來越多的 SPA 架構(gòu)網(wǎng)頁應(yīng)用出現(xiàn),微信小程序應(yīng)該就是基于此種技術(shù),使用 SPA 架構(gòu)的應(yīng)用只需要在剛開始的時(shí)候 loading 加載,切換到應(yīng)用內(nèi)的其他頁面不需要再加載新的頁面,所以非常流暢。那是不是說明我們可以不做小程序而用 vue 來寫就可以了?

也不是的,小程序比 H5多了很多入口,對(duì)于傳統(tǒng)商戶來說,找個(gè)外包商重新用 vue 寫一個(gè)微官網(wǎng)的成本和找個(gè)外包商做一個(gè)小程序的成本是一樣的,甚至比做小程序成本還高。因?yàn)樾〕绦蛉绱嘶馃?,肯定有大量第三方開發(fā)商做成各個(gè)行業(yè)的小程序模板,你只要稍微配置就能一鍵生成,成本是非常低的。

但是小程序比 H5多了很多原生的能力不是嗎?

微信之前也有開放一個(gè) JSSDK, 也有分享接口、圖像接口、音頻接口、設(shè)備信息、搖一搖、掃一掃等能力可以在移動(dòng) H5端去使用,小程序的優(yōu)勢在于比 JSSDK 多了更多的數(shù)據(jù)儲(chǔ)存能力,比如視頻、圖片、音頻等可以等用戶在 wifi 環(huán)境下保存到本地,然后移動(dòng)網(wǎng)絡(luò)時(shí)候就可以離線觀看了。但 JSSDK 開放這些能力的話也可以做到,只不過微信無形之后幫你規(guī)范好了,讓你以 SPA 架構(gòu) 去搭建一個(gè)網(wǎng)頁,這正是小程序在技術(shù)層面上做的事情。

還有其他區(qū)別嗎?

  1. 小程序諸多微信審核的限制、H5 不受微信管控
  2. 小程序更容易打開,對(duì)于用戶來說是不利的,因?yàn)闁|西不管你用不用總是占著手機(jī)空間;對(duì)于商家來說,二次使用成本更低,利用用戶再次使用

各有各的優(yōu)勢,那我想兩種都做會(huì)成本很高嗎?

如果你原來的網(wǎng)頁應(yīng)用就是用 vue 那套框架構(gòu)建的,那么再做到微信小程序的成本非常低,需要做一些轉(zhuǎn)換和適配,比如 vue 的自定義標(biāo)簽功能定義成微信小程序的 view , 相信開源社區(qū)日后會(huì)有人貢獻(xiàn)這些轉(zhuǎn)化的代碼。如果你原來的網(wǎng)頁不是 SPA 架構(gòu)的,那么就建議找第三方開發(fā)商來做小程序,成本低,雖然會(huì)比較多限制。有精力或者想得到更多能力,可以再逐步向剛剛說的,做一些工具完成網(wǎng)頁應(yīng)用到小程序的橋接轉(zhuǎn)換。

紅利期在哪 ?

2017年微信公開課Pro版上,男神張小龍對(duì)小程序做了一番詳細(xì)的解析和解答。在此之前,很多人認(rèn)為微信小程序會(huì)帶來一波流量上的紅利,但張小龍告訴大家,小程序在微信上沒有入口、不能訂閱,想要通過小程序來獲取紅利的人,想必是要失望了。

但是果真如此嗎?

回想十九世紀(jì)四五十年代美國西進(jìn)運(yùn)動(dòng)過程中的淘金熱,我們也許更容易理解。淘金熱中最終獲利的其實(shí)不是淘金的人,而是船夫、賣水和賣鏟子等為淘金提供支持的人。如果小程序引發(fā)一場”淘金熱”,那它最大的紅利可能就不是小程序本身。它會(huì)是什么呢?

我覺得是以下幾個(gè)方面:

1、第三方外包開發(fā)商

目前市面上外包一個(gè)簡單商城的小程序價(jià)格大概在300到1000左右,對(duì)于個(gè)人開發(fā)者而言,這基本上是無利可圖的,很少個(gè)人會(huì)去專門定制。對(duì)于靈活度要求較高,需要一些基礎(chǔ)組件又需要定制開發(fā)的公司來說,更需要一個(gè)能規(guī)模化輸出基礎(chǔ)組件,并且在這基礎(chǔ)上為部分公司定制開發(fā)的第三方服務(wù)商。這適合企業(yè)號(hào)那一波紅利做得好的一些開發(fā)商,很可能成為同樣主打企業(yè)用戶的小程序,比如微信公開課 pro 上拿了“2016年度微信電子發(fā)票優(yōu)秀合作伙伴”獎(jiǎng)項(xiàng)的企微云平臺(tái)。

2、自動(dòng)生成小程序的

盡管微信小程序的開發(fā)門檻相比APP的開發(fā)門檻大幅降低,但帶來的問題是:開發(fā)者需要適應(yīng)和學(xué)習(xí)它的這套語言標(biāo)準(zhǔn),而且開發(fā)的應(yīng)用是不能移植到其他應(yīng)用里面的,只能在微信上運(yùn)行。如果技術(shù)小白能零門檻通過拖拽或根據(jù)模板的形式就自動(dòng)生成小程序,這將更大降低開發(fā)和使用門檻。但是此類平臺(tái)靈活度不夠。

目前這一類的企業(yè)有微塵、有贊等。

3、提供后端數(shù)據(jù)托管服務(wù)的云服務(wù)商

小程序只是一個(gè)前端而已,整個(gè)開發(fā)涉及到企業(yè)認(rèn)證、云端數(shù)據(jù)存儲(chǔ)、ICP 域名備案等,對(duì)于單個(gè)企業(yè)來說非常繁瑣。因此需要能提供一條龍后端托管服務(wù)的第三方平臺(tái)。

目前騰訊云就在做這個(gè)事情,阿里云應(yīng)該是不會(huì)推出微信小程序托管服務(wù)的。

4、小程序開發(fā)和運(yùn)營培訓(xùn)

盡管通過第三方外包或拖拽自動(dòng)都能開發(fā)出小程序,但前者可能面臨成本的問題,后者則可能不能定制出特別符合要求的小程序。那么最好的方案就是”自己動(dòng)手,豐衣足食”。而提供小程序開發(fā)培訓(xùn)的機(jī)構(gòu),則可以因此獲得收益。

5、小程序?qū)Ш骄W(wǎng)

張小龍?jiān)诠_課說了:”我們并不會(huì)存在一個(gè)小程序的商店,所以我們也并不會(huì)像外界所猜測的那樣,做一個(gè)APP的分發(fā)商店”。既然微信不做,巨大的入口價(jià)值,自然就會(huì)有別人去做這件事。讓別人記住那么多小程序的名字,每次想用的時(shí)候就去搜一下是很麻煩的,如果能把小程序匯總起來,想用的時(shí)候就去導(dǎo)航網(wǎng)站找,估計(jì)會(huì)方便很多。

哪些程序不適合

1、依靠向外部輸出流量以獲得盈利的 App

比如今日頭條、Zaker 等這類資訊 App,商業(yè)變現(xiàn)方式太單一,基本上都是廣告,小程序并沒有提供商業(yè)變現(xiàn)的方式,他們做小程序有些革自己命的感覺……但是可以提供一個(gè)輕量的小程序入口提高品牌曝光。

2、需要較多依賴系統(tǒng)原生能力的 App

舉個(gè)例子:

Workflow,一款通過剪切板等輸入,然后設(shè)定好動(dòng)作,既可以做分詞、發(fā)送到郵箱、查詢是否詐騙電話號(hào)碼等等非常多的自定義工作流。workflow 需要獲取用戶剪切板內(nèi)容,調(diào)起郵箱、印象筆記等第三方 app、打開網(wǎng)頁等多種系統(tǒng)能力,而小程序不會(huì)向開發(fā)者暴露所有的系統(tǒng) api,這跟小程序定位不符合。

還有一個(gè)例子,一款閱讀app,叫作優(yōu)讀。這款產(chǎn)品想要解決的問題是如何從大量信息中篩選出有價(jià)值的內(nèi)容,他們的思路是利用“牛人”推薦和機(jī)器算法來完成。他們?yōu)榱朔奖阌脩羧シ窒韮?nèi)容到優(yōu)讀上去,做了很多便捷操作,比如你在任意一個(gè)app內(nèi)閱讀內(nèi)容,當(dāng)你想要將這篇文章分享到優(yōu)讀時(shí),只需要復(fù)制鏈接,然后下拉通知中心,就可以選擇 收藏或分享文章了。這很便捷。但是完全不適合做小程序。

3、需要占用較大儲(chǔ)存空間的應(yīng)用

這一類通常是視頻和音頻類應(yīng)用,比如騰訊視頻、網(wǎng)易云音樂等。用戶使用這類應(yīng)用的場景很大一部分是在移動(dòng)環(huán)境下,他們會(huì)事先把歌曲或者電視劇緩存到本地。但是對(duì)于微信小程序10M 的存儲(chǔ)限制根本無法滿足。但網(wǎng)易云也可以把私人 FM 獨(dú)立出來做一個(gè)小程序占坑。

4、需要大型 3D 渲染的

這方面主要是游戲,一個(gè)游戲包一般都在10M 以上,小程序上做個(gè)頁游都不行,只能搞個(gè) flappy bird 了。

5、服務(wù)性弱、和線下場景關(guān)聯(lián)弱的應(yīng)用

比如印象筆記等工具型產(chǎn)品

6、自己 APP 都做不好的,你就別去湊小程序的熱鬧了

如果你做一個(gè) app 都沒人用做不起來,那么做了小程序也沒人用。因?yàn)楹诵牡氖欠?wù)和價(jià)值,小程序的定位就是你自由流量的情況下讓用戶更便捷的接觸到你的服務(wù),而不是為了給你的服務(wù)引流。比如你租用了一堆廣告牌,你有一家門店貼上小程序二維碼,用戶能更好的使用你提供的服務(wù)。如果你本身沒流量入口,那么小程序也沒有,和 app 一樣依然推不動(dòng)而且還沒有留存。

可以上架的小程序類目

以下是小程序允許上架的服務(wù)類目及其需要的材料,從下圖可以看出,微信對(duì)于政務(wù)服務(wù)、工具、出行、實(shí)體商戶四個(gè)大類的細(xì)分是極其詳細(xì)的,可以看出這是微信著力要發(fā)展的四個(gè)大類,一旦所有的政府機(jī)構(gòu)都用上了小程序,那么很多我們必須用到的政務(wù)服務(wù)都必將刺激更多中老年用戶去使用微信。另外出行是個(gè)高頻需求,從 n 年前微信支付和支付寶爭奪移動(dòng)出行的入口就可見一斑。另外微信雖說不做導(dǎo)航,那么弄那么詳細(xì)的分類干什么呢,即使所需的審核資料一致?令人深思。

六、一些要點(diǎn)

一些數(shù)字

  • 1 個(gè)營業(yè)執(zhí)照能注冊(cè) 50 個(gè)小程序
  • 1 個(gè)小程序必須綁定 1 個(gè)管理員(含個(gè)人微信、手機(jī)號(hào)碼、身份證)
  • 1 個(gè)身份證只能綁定 5 個(gè)小程序
  • 1 個(gè)公眾號(hào)能綁定 5 個(gè)小程序
  • 1 個(gè)小程序只能對(duì)應(yīng) 1 個(gè)公眾號(hào)

跳轉(zhuǎn)引流能力有限

小程序內(nèi)不能跳轉(zhuǎn)到對(duì)應(yīng)的公眾號(hào)也不能誘導(dǎo)關(guān)注公眾號(hào),但在小程序的介紹頁會(huì)露出且點(diǎn)擊可跳轉(zhuǎn)綁定的公眾號(hào)。可通過介紹頁實(shí)現(xiàn)公眾號(hào)和小程序之間的互相跳轉(zhuǎn),但網(wǎng)頁內(nèi)和聊天窗口內(nèi)長按識(shí)別二維碼不能打開小程序。

安卓的小程序能放到桌面,iOS目前不可以

但不排除之后會(huì)通過Safari書簽的形式放到桌面上,技術(shù)層面是可以實(shí)現(xiàn)的,只是用戶操作路徑比安卓一鍵放到桌面麻煩。

頁面內(nèi)不能出現(xiàn)引導(dǎo)下載你自己App的文字

微信官方文檔?5.1:

  • 微信小程序的頁面內(nèi)容中,不得存在誘導(dǎo)類行為,包括但不限于誘導(dǎo)分享、誘導(dǎo)添加、誘導(dǎo)關(guān)注、誘導(dǎo)下載等;如不得要求用戶分享、添加、關(guān)注或下載后才可操作;
  • 不得含有明示或暗示用戶分享的文案、圖片、按鈕、浮層、彈窗等;
  • 不得通過利益誘惑誘導(dǎo)用戶分享、傳播;不得用夸張言語來脅迫、引誘用戶分享;不得強(qiáng)制或誘導(dǎo)用戶添加小程序。

只有管理員能上傳代碼

開發(fā)者無法上傳

任意頁面可以帶參數(shù)生成二維碼,最多十萬個(gè)

這就很有想象力了,在床頭貼一個(gè) Jinkey 智能管家的小程序二維碼,帶一個(gè)參數(shù) action = closeLight ,掃碼后自動(dòng)關(guān)燈;

在門口放一個(gè) Jinkey 智能管家的小程序二維碼,帶一個(gè)參數(shù) action = out ,出門掃描一下自動(dòng)關(guān)閉家里的電源總開關(guān)(額,除了冰箱)。

在廁所放一個(gè)二維碼,action = focus,掃描自動(dòng)關(guān)注微信公眾號(hào) jinkey-love。

同樣的道理,帶參數(shù)的二維碼可用于線下商家、政府服務(wù)的小程序內(nèi)不同功能區(qū)直接進(jìn)入對(duì)應(yīng)的服務(wù)而不需要使用多個(gè)小程序。比如去銀行掃描一個(gè)取號(hào)機(jī)上的二維碼取號(hào),金銀柜臺(tái)掃碼了解各種理財(cái)產(chǎn)品。

小心手機(jī)空間和流量不足

小程序并非不用下載,而是在你首次使用的時(shí)候會(huì)下發(fā)一個(gè)包,相當(dāng)于把網(wǎng)頁緩存好,下次打開就快了,但是但是…你已經(jīng)下載了,而且是“不需要確認(rèn)的下載”,點(diǎn)開即下載,然后你的流量就嘩啦啦呼啦啦…下圖是微信小程序下載的頁面,不過在正式版中,微信已經(jīng)去掉了“數(shù)據(jù)下載中,請(qǐng)稍候…”的文字,但依然是下載哦。所以微信所說的“免下載”更多地只是一種“無感下載”。

小程序空間有限

整個(gè)小程序包的上傳時(shí)的體積不能超過1M,加載到用戶手機(jī)后,緩存大小不能超過10M(有可能被清除掉),永久存儲(chǔ)大小不能超過10M(下次進(jìn)來還能打開)

名字、頭像要慎重

小程序的名稱1年可以修改1次、頭像1個(gè)月可以修改5次、小程序介紹1個(gè)月可以修改5次。

七、小程序的能力

為什么要了解這部分內(nèi)容?

  1. 知道什么頁面元素是微信小程序自帶的,能快速開發(fā)上線
  2. 知道有哪些異常流和節(jié)點(diǎn)產(chǎn)品經(jīng)理提需求,老板決策的時(shí)候可以發(fā)揮的
  3. 知道有哪些硬件能力提供,知道產(chǎn)品的邊界所在?比如你想做一個(gè) NFC 刷卡坐地鐵的小程序,那么很遺憾告訴你,小程序做不了,甚至 iOS 都沒有開放到NFC 的能力給開發(fā)者,所以小程序現(xiàn)在不會(huì)有 NFC 能力。

默認(rèn)組件

有哪些組件?

組件長什么樣子的?

當(dāng)然,小程序本身只是一個(gè)網(wǎng)頁,你可以使用通過 css 自定義組件的樣式或者自己寫一些特殊的組件,比如電商購物車的步進(jìn)計(jì)數(shù)器。

事件鉤子(建議非產(chǎn)品經(jīng)理、運(yùn)營等需求提出方跳過鉤子和事件這部分)

1. 什么是鉤子?

一只小烏龜?shù)念^上頂著數(shù)字 7 和 8(額,好像沒什么不對(duì)的),他需要走過一個(gè)裝著加法運(yùn)算器的箱子,之后頭上就會(huì)變成一個(gè)數(shù)字 15。那么這個(gè)箱子就稱為一個(gè)鉤子函數(shù),如果放在里面的是一個(gè)乘法運(yùn)算器,那么小烏龜?shù)念^上的數(shù)字經(jīng)過正方體之后就會(huì)變成56。

小程序相當(dāng)于那只小烏龜,在運(yùn)行時(shí)(小烏龜走路)會(huì)觸發(fā)很多的事件(鉤子函數(shù),相當(dāng)于小烏龜經(jīng)過的正方體),往這些正方體里面放入什么邏輯,取決于坑比的產(chǎn)品經(jīng)理。

比如一個(gè)電商的步進(jìn)計(jì)數(shù)器改變值的時(shí)候:

2. 有哪些鉤子

App 生命周期的鉤子

小程序的生命周期分為程序頁面兩個(gè)部分:

程序有啟動(dòng)(未顯示)、顯示出來了和隱藏三個(gè)事件

頁面有加載、顯示出來了、準(zhǔn)備好了(首次)、卸載頁面、隱藏頁面五個(gè)事件

除此之外,還有 onPullDownRefresh 下拉刷新的時(shí)候、 onReachBottom 上拉無限加載的時(shí)候、 onShareAppMessage 點(diǎn)擊右上角分享按鈕的時(shí)候。

其中我覺得 onShareAppMessage 是挺有用的,比如當(dāng)用戶點(diǎn)擊右上角分享按鈕時(shí),往頁面頂層覆蓋一個(gè)分享圖(高度為頁面高度80%),這樣子會(huì)改變頁面分享到聊天窗口的樣子(這里還沒實(shí)踐過,只是猜想,你們可以自己試試)

3. 觸摸事件

分為點(diǎn)擊、長按、觸摸開始、觸摸移動(dòng)(比如可用于拖拽排列列表)、觸摸結(jié)束、觸摸取消(比如一個(gè)看視頻的小程序要求你兩只手都按著手機(jī)才能播放,在你看到快高潮的時(shí)候,女朋友打電話來,就會(huì)觸發(fā) touchcancel 事件)
4. 組件事件

組件事件主要有幾種:值改變的事件、開始輸入的事件、完成輸入的事件。

舉個(gè)例子,比如一個(gè)文本框要求輸入郵箱,因?yàn)楫?dāng)用戶輸入時(shí)會(huì)觸發(fā) input 事件,所以可以綁定一個(gè)鉤子函數(shù),獲取到用戶每次輸入的字符串判斷一下是否含有“@”和”.”,若有則判定為合法。

其他詳細(xì)的可以看下圖用于自查。

5. 富媒體事件
富媒體的事件主要有幾種:開始(加載)播放、暫停播放、結(jié)束播放、播放(加載)失敗、播放進(jìn)度更新這幾種。

6. 硬件能力

  1. 從本地相冊(cè)選取照片視頻
  2. 拍照或錄像
  3. 掃描二維碼
  4. 錄制語音
  5. 直接打開doc, xls, ppt, pdf, docx, xlsx, pptx
  6. 保存文件到微信 app 目錄
  7. 獲取地理位置
  8. 獲取用戶手機(jī)型號(hào)、設(shè)備像素比、窗口寬高、語言、微信版本號(hào)、操作系統(tǒng)版本、客戶端平臺(tái)
  9. 獲取網(wǎng)絡(luò)狀態(tài):2g,3g,4g,wifi
  10. 監(jiān)聽重力感應(yīng)器,5次/秒,可以做搖一搖等
  11. 監(jiān)聽羅盤數(shù)據(jù),5次/秒
  12. 直接撥打電話(企業(yè)宣傳留個(gè)咨詢電話)

7. 微信能力

(1)微信登錄

(2)獲取用戶的頭像、昵稱、性別、國家、城市、省份

(3)微信支付

(4)模板消息

只有以下兩種行為可以觸發(fā)模板消息

  • 支付當(dāng)用戶在小程序內(nèi)完成過支付行為,可允許開發(fā)者向用戶在7天內(nèi)推送有限條數(shù)的模板消息(1次支付可下發(fā)1條,多次支付下發(fā)條數(shù)獨(dú)立,互相不影響)
  • 提交表單當(dāng)用戶在小程序內(nèi)發(fā)生過提交表單行為且該表單聲明為要發(fā)模板消息的,開發(fā)者需要向用戶提供服務(wù)時(shí),可允許開發(fā)者向用戶在7天內(nèi)推送有限條數(shù)的模板消息(1次提交表單可下發(fā)1條,多次提交下發(fā)條數(shù)獨(dú)立,相互不影響)

(5)客服消息

用戶通過客服消息按鈕進(jìn)入會(huì)話,1分鐘內(nèi)可下發(fā)1條消息,超時(shí)不能發(fā)送;

用戶在客服窗口發(fā)送信息,可回復(fù) 3 條且需要 48 小時(shí)內(nèi)回復(fù)

(6)分享到聊天窗口

分享圖片不能自定義;會(huì)取當(dāng)前頁面,從頂部開始,高度為 80% 屏幕寬度的圖像作為分享圖片。

原文鏈接:https://jinkey.ai/post/product/wei-xin-xiao-cheng-xu-1mo-zi-shi-cao-zhi-nan

#專欄作家#

Jinkey,原騰訊手機(jī)管家產(chǎn)品運(yùn)營,原拍拍、微信購物產(chǎn)品經(jīng)理。P-1級(jí)產(chǎn)品菜鳥,分享產(chǎn)品心得,技術(shù)科普。專注于社交產(chǎn)品、企業(yè)級(jí)產(chǎn)品、機(jī)器學(xué)習(xí)和 iOS 開發(fā),公眾號(hào) jinkey-love,歡迎交流。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 可以更新內(nèi)容了,一個(gè)小程序可以關(guān)聯(lián)多個(gè)公眾號(hào);還有【哪些程序不適合做小程序】的第6條建議取締掉吧!不是因?yàn)锳PP都做不好就不適合做小程序,這之間沒有因果關(guān)系,有的消費(fèi)頻次本身就不高的,還是很適合做小程序的,反而不適合做APP。額,小程序包現(xiàn)在限制也是2M了,未來還可能繼續(xù)放大限制。 :mrgreen: 作者真心可以更新一下了,免得誤導(dǎo)部分用戶。

    來自四川 回復(fù)
  2. 訂閱后看完你全部的文章,有一種“作者你真的是90后么?”的感慨,厲害~

    來自福建 回復(fù)
  3. 怎么會(huì)有這么厲害的人 /哭

    來自上海 回復(fù)
  4. 作者好厲害,對(duì)比下感覺自己好差勁 請(qǐng)問原來學(xué)的專業(yè)是IT相關(guān)嗎?

    來自廣東 回復(fù)
    1. 不是

      來自廣東 回復(fù)
  5. ?? 作者一定是約炮達(dá)人+1

    來自廣東 回復(fù)
  6. ?? 作者一定是約炮達(dá)人

    來自廣東 回復(fù)