之前我们每周都会为大家推荐一个精选原型资源，不知不觉已经累积了很多，为了让新老盆友们都能更清晰快速并且有条理地获取平台内的所有优质原型资源，我们这一次按照分类整理了一个资源大礼包！~

足足有100+原型资源噢！！！其中包括 100+完整原型项目 ， 上千个可复用的组件与页面素材 ，涵盖了微信小程序、生活服务、餐饮外卖、在线学习、音视频、资讯平台等各种各样的主流类别，每一个分类下都精选了不同类型、不同样式的产品原型，满足了绝大多数用户场景和众多符合用户习惯的交互形式，不多说了，先mark住！以后一定用得上！

移动端

小程序

小程序的发展完全不用在这里多说了，相信你也一定能明白做小程序的重要性！如果有不明白的或者希望能深度了解的可以赶紧点这篇文章学习一下，阅读时长预计5分钟 —— 「第一次做小程序？看这一篇就够了！」

要做小程序的话，我们之前已经给大家推出过四季共计20款不同小程序案例的原型模板，以及最具有交互和形式上的参考意义的官方组件库WeUI，具体小程序目录看下面！

1. WeUI（微信）原型资源分享

2. 微信官方小程序原型分享 第一季

（腾讯小经费、腾讯投票、博物官、识花君、微信辟谣助手）

3. 微信官方小程序原型分享 第二季

（腾讯视频、微信使用小助手、腾讯公益、微信发票助手、食物健康测评）

4. 微信官方小程序原型分享 第三季

（腾讯文档、微信指数、QQ 阅读、微信读书书城、微信读书排行）

5. 腾讯官方小程序原型分享 第四季

（微信游戏圈、腾讯动漫、大家+、腾讯体育、腾讯新闻）

在线学习 (教育)

这里一共包含了5款定位不同的在线学习（教育）类原型，涵盖了免费学习、付费学习、在线教育等多个方面，最大化满足你多种使用场景的需求。有做这方面需求的小伙伴可以直接提取高低保真页面以及组件进行使用呦~

1. 得到
2. 英语流利说
3. 百词斩
4. 网易云课堂
5. 驾考宝典

电商购物

下面包含5款电商购物类产品原型，内容除了包含了详细的交互流程及完整的组件整理，还有像小红书这样独特的瀑布式布局排版。相信不管你是不是做这个类型的产品，这些基础组件控件和排版布局方式都能帮你节省不少的时间。

1. 菜鸟裹裹
2. 天猫商城
3. 小米商城
4. 小红书
5. 「礼物说」小程序

旅游出行

如果你要做一款旅行类app，我们提供「飞猪」和「爱彼迎Airbnb」作为原型参考！

「飞猪」中各种门票、行程票的完整预订流程，以及「爱彼迎Airbnb」中好看得让其他类型产品都想学习的样式布局，一定都可以为你想做的产品提供些许灵感！~

1. 飞猪旅行
2. 爱彼迎Airbnb

生活服务

超全面生活服务类原型，生活服务、医疗服务、健身运动服务行业应有尽有，每一个原型都包含了低保真和高保真两个版本，除此之外还有丰富的组件库提供给大家使用，做这些业务的小伙伴赶紧根据自己的业务需求选择使用吧~

1. 美团
2. 58 同城
3. 链家
4. 丁香医生 （医疗类服务应用）
5. Keep （运动健身类应用）

餐饮外卖

随着生活水平的不断提高，各种餐饮外卖类的产品也是如雨后春笋般，不断涌现。但是因为这类产品在产品定位上都是相同的，所以核心流程大致相同。

下面我们提供了4款餐饮外卖类产品原型给大家使用，相信当你做这类产品时，这些内容肯定能帮你解决不少麻烦。当然支付流程、下单流程、添加地址流程像电商购物这类产品也是可以直接拿来使用的呦~

1. luckin coffee （瑞幸咖啡）
2. 饿了么
3. 下厨房
4. 「食物健康评测」小程序

交通出行

当一提到交通出行类软件相信大家第一时间想到的就是滴滴出行，做为国内打车市场行业的龙头老大，它的核心功能设计逻辑肯定是很具有参考性的。

除此之外还有2款共享单车软件原型，希望在你做此类型软件时，能在功能设计上给你提供一些帮助。

1. 滴滴出行
2. ofo 小黄车
3. 「摩拜单车」小程序

在线阅读

在线阅读类产品，可以让用户利用碎片化时间完成阅读，增加用户阅读量，下面给大家介绍6款在线阅读类相关产品原型，每一款原型完整的产品页面和交互流程，有在线阅读类需求的小伙伴可以选择性参考使用。

1. 微信读书
2. 「微信读书书城」小程序
3. 「微信读书排行榜」小程序
4. 「QQ 阅读」小程序
5. 「大家+ 」小程序

音频 / 视频媒体平台

超全面的音频 / 视频类产品原型，音乐、视频、短视频、直播类应用应有尽有，并且每一款原型都包含了高低保真页面两个版本内容，并且抖音短视频中还有独特的宫格组件和布局排列，相信不管是做音频 / 视频类产品，还是做其他类型产品，在排版布局上都会给你带来一定的帮助。

1. 哔哩哔哩
2. 腾讯视频
3. 抖音短视频
4. 斗鱼直播
5. 喜马拉雅 FM
6. 网易云音乐
7. 全民 K 歌
8. 「腾讯视频」小程序
9. 「腾讯动漫」小程序
10. 「腾讯体育」小程序

新闻资讯

这里一共有7款不同风格和定位的新闻类产品原型，不论你想做哪类资讯产品，总有一份适合你，同时，这7款产品由于适用场景不同，在排版上也各有特色，你可以从中吸取一些灵感！

1. 好奇心日报
2. ZAKER
3. 澎湃新闻
4. Yahoo News Digest
5. Timeline
6. 「轻芒杂志」小程序
7. 「腾讯新闻」小程序

金融财务

下面6款原型，涵盖了金融财务类产品中的移动支付、记账理财等方面内容，每一款原型都拥有丰富的组件库，其中支付宝还有生物识别、银行卡绑定、实名认证等详细模块流程的详细说明，选择下面的链接进行查看使用吧！

1. 支付宝

支付宝

支付宝-生物识别

支付宝-银行卡绑定

支付宝-实名认证-身份证认证

2. 中国工商银行

3. 京东金融 （记账理财类）

4. 随手记 （记账理财类）

5. 「腾讯小经费」小程序 （记账理财类）

6. 「自选股」小程序

社交通讯

我们精选了6款主流社交通讯类原型，里面除了包含了常规的聊天页面、通讯录、个人详细资料等高保真页面内容外，还有像「微光」这样的卡片切换、视频聊天互动等特色交互动画。

除了社交通讯类产品可以复用，其他类型的产品也能复用例如通讯录、聊天页面等页面和组件，总之先mark住一定没问题~

1. 微信
2. QQ
3. 钉钉
4. 新浪微博
5. Instagram （图片分享社交类）
6. 微光 （视频社交类）

智能家居

随着近几年智能家电和物联网的蓬勃发展，智能家居类产品作为其核心入口，也是吸引了各大公司的注意。

如果你要做智能家居类产品，可以参考以下2款产品「米家」、「小爱音箱」，「米家」中完整的智能家居连接使用流程，以及「小爱音箱」中完整的连接音箱流程等内容，肯定在流程上给你提供不小帮助。

1. 米家
2. 小爱音箱

社区 (论坛)

下面给大家介绍2款社区（论坛）类产品「知乎」、「豆瓣」。

这两款产品原型中除了包含高低保真页面外，每一款都还有详细的流程说明，如果你有这方面需求的话，可以进行参考性使用~

1. 知乎
2. 豆瓣

工具（平台）

下面给大家介绍4款工具（平台）类产品原型，其中包含了「 xiaopiu 官方产品」和平台类软件“设计引领者“ 「App Store」 。

「xiaopiu 官方产品」中包含了所有的高低保真页面原型以及完整的流程设计，「App Store」中更有现在流行的卡片组件内容设计，相信这些资源肯定能帮你减少不少制作时间！

1. xiaopiu
2. App Store
3. 微信订阅号助手
4. 冲顶大会

官方组件库

在原型设计中，虽然大多数时候我们只需要使用静态组件表达自己的产品思路，但在一些交互效果上，如果有动态组件加持会让原型更加清晰易懂。下面给大家带来2套官方组件库「Ant Design Mobile」和「有赞移动组件库」， Ant Design Mobile 组件库更是直接内置至xiaopiu，使用时只需修改参数，就能直接使用交互动效这些内容~

1. Ant Design 原型资源分享
2. Vant (有赞）移动组件库

功能案例

下面给大家带来几套完整的功能案例和模板案例，包括「登录/注册」、「评价/评论」等功能详细的流程介绍和组件资源，除此之外还有H5版「简历模板」，赶紧根据自己的需求选择性使用吧~

1. 登录 / 注册流程

2. 评价 / 评论流程

3. 其他功能

8种引导方式，7个设计要点，让你全面了解新手引导！

App搜索功能探析

四大维度，全方位剖析APP「分享功能」

4. 那些创意十足的L oading动 效原型合 集（一 键复用！）

5. 12款简历模板，让你做简历不再犯难！

Web 端

平台

超全面的平台类产品原型介绍，涵盖了招聘类、在线教育类、电商类等等，每一项原型内容中都包含了丰富的组件内容和完整的流程设计内容，不论你是否做这些类型的产品，相信他们一定会给你提供不小的帮助！

1. 拉勾网 （招聘类）
2. 慕课网 （在线教育类）
3. 优酷视频 （视频类）
4. QQ音乐 （音乐类）
5. 网易严选 （电商类）

后台管理

做后台管理的童鞋有福啦，这一部分不仅包含了多个管理后台原型，还有史上最全最强大的 Ant Design 交互组件库，下拉框、导航菜单、轮播图等交互组件以及柱状图、折线图各类图表组件，轻松满足你的「花式需求」。

1. 自从用了阿里的这套框架，产品经理再也没有求过设计师了！
2. 图标画不完，代码敲不完，别担心！Ant Design Pro 都替你做了
3. 钉钉管理后台
4. Teambition 管理后台
5. 友好速搭后台管理系统 （ 电商后台管理系统类）
6. 有赞商城后台管理系统 （ 电商后台管理系统类）
7. 微信公众号后台管理系统

其他

给大家介绍几项 web 端常用内容案例，包含「网页布局」、「消息中心设计」、「简历模板」，其中囊括了多种图文列表、瀑布式排版、图文排版等等内容，并且每项内容都有完整的组件库和页面库内容供大家选择使用！

1. 常用网页布局原型
2. 消息中心设计分析
3. 12款简历模板，让你做简历不再犯难！

相信通过上面这些原型内容的查看，在原型制作上已经帮你积累了不少的素材和灵感。

我们一直都希望大家在制作原型时，能快速获取素材，从而进行组件、页面、流程等内容的快速复用。帮助小伙伴们在产品设计过程中减少”重复造轮子“的过程，统一产品设计的逻辑性，增强产品设计的美观度，减少不必要的时间浪费，这也是我们一直秉承的理念之一。

除了以上这些资源外 xiaopiu 精选广场 还有更多的精选内容，大家可以直接访问官网搜索资源名使用噢~