小程序自 2017 年 1 月正式上線至今已三年半了，它改變了移動軟件的實現形式，開發變得更爲簡單快捷，依託於大平臺的流量，也減少了一部分的宣傳費用，產品變得靈活又多變。
今天，我們就要分享一些關於小程序原型設計方法以及一些素材原型，幫助刀友們快速上手小程序的產品設計。
本期目錄
1.小程序點擊彈窗設計的方法
2.小程序基礎組件
3.小程序「商城」
4.小程序「教育機構管理平臺」
5.小程序「認識自己」
6.如何複用小程序原型
小程序點擊彈窗設計的方法
在正式分享素材之前，我們先來學習一個小程序裏的常見交互手勢：點擊彈窗。
它應用場景廣泛，就像這樣：
雖然百搭又萬能，但它的製作方法卻很簡單，只需三步即可：
a.先製作一個彈窗的動態組件，再設定兩個狀態：狀態1「彈窗隱藏」，狀態2「彈窗顯示」；最後狀態2中點擊「取消按鈕」跳轉回狀態1。
b.把動態組件的狀態設置好之後，再將底部導航欄中按鈕「我」的事件設置爲「單擊-切換組件狀態-彈窗顯示」，這樣就可以通過點擊按鈕來觸發彈窗的顯示。
c.調整彈窗動態組件至頁面合適位置，這樣就完成了～
刀友們可以點擊這裏查看完整視頻學習，除了點擊彈窗外，還有其他的教程哦～
小程序基礎組件
想要嘗試的原型搭建，不妨先去素材廣場找找合適的素材組件吧。現在，我們有 11 種類型的小程序組件，共計 300 多個。
大到卡片、輪播、抽屜、窗口：
小到導航欄、步驟條、按鈕、開關、文本框：
都囊括在素材廣場中，刀友們可以利用這些豐富的組件充分享受搭建的樂趣，快速完成小程序產品設計，節省製作時間，點擊這裏進入使用。
下面，正式進入素材原型分享時間。
小程序「商城」
最常見的小程序產品就是商城啦，如果你恰好正在設計此類小程序，那一定要看看這個原型。
它帶有小程序商城所有基本特質，並且還結合了當下最熱門的健身屬性，它在操作方式上也選擇了用戶習慣性的電商APP操作方式，符合用戶習慣，便於用戶使用。
在我的頁面，還留有了其他入口，如會員中心、積分商城、商家入駐等等，可以根據實際需求擴充頁面。
小程序「教育機構管理平臺」
很多教育機構的管理平臺多半都是Web端，這次爲刀友們提供一種新的思路——小程序。
其實對於繁忙的教育機構來說，利用小程序進行管理，反而更加的簡便，極大的簡化運營流程,可以進一步提高工作效率，大幅度減少業務中斷。
這次分享的原型共有十幾個頁面，流程完整，頁面豐富，極具複用價值。
小程序「認識自己」
哲學三大問題：“我是誰”、“我從何而來”、“我將去何處”。
我們終其一生都在不斷的認識自己、發現自己，而如何更好的認識自己，不僅要從主觀思維出發，還可以藉助其他的工具，比如各種各樣的性格測試，以便知道自己到底適合做什麼？
這款原型便是這樣的產品，它設計結構完整，頁面類型比較豐富，包含測評題庫、內容搜索頁面、測評詳情頁、測評報告生成頁等。
結果生成的方式也令人眼前一亮。
並在最後一個環節上對頁面設置爲生成圖片海報進行傳播分享，基本上符合用戶追求自我認同感的心理需求。
在製作其他類具有社交屬性小程序的時候，也可以參考複用它，作爲一種拉新的手段。
如何複用小程序原型
第一步，在素材廣場中尋找到所需的目標頁面，點擊保存。
第二步，點擊素材找到剛保存的素材，置入當前頁，或是，在右邊組件中，直接拖拽到工作區。
如果你還有其他的素材需求，歡迎留言告訴我們哦～