精美免费的原型例子 - 摹客

向团队推荐摹客

注册

社交类APP原型模板分享——微信

微信是一款社交类的APP应用——聊天软件，支持多人群聊。交互效果主要有滚动内容界面、选择组件触发按钮状态变化、点击下拉展开列表、点击弹出面板等交互操作。先简单看看动图：点击这里，可以立即在线预览：微信原型模板再送上UI Flow大图：原型中有消息列表页面、通讯录列表界面、发现列表界面、我的个人资料列表界面、朋友圈界面以及发朋友圈的文字图片编辑界面。以上设计的所有页面可以在这里下载分...

5 min read
电商类web原型制作分享——美丽说

美丽说是国内白领女性时尚消费品牌，精选上千家优质卖家供应商，为用户提供女装、女鞋、女包、配饰、美妆等品类的优质时尚商品。此原型模板所用到的组件有搜索框、下拉菜单、输入框、选项卡等。交互动作有切换选项卡实现内容的切换。这个原型的主要页面有：首页、上衣、裤子、裙子、登录页面。点击这里，可以立即在线预览：https://run.mockplus.cn/B4gMX3kbesUI4Ghx...

5 min read
效率类App原型制作分享-One List

One List是一款效率类工具，这款App最大的亮点是前面用了6页动画，来引导用户如何操作这款软件，引导页采用动画的形式，比较有趣，且演示清晰易懂。今天我也会给大家分享如何利用原型工具Mockplus来实现引导动画。先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/W2qfYImZXg5zEaH4/index.html 引导页动画制作步骤如下： 1....

5 min read
工具类App原型制作分享-Bear

Bear是一款记事工具，App画风简约可爱，这只萌熊也是这款App的最大亮点，为了真实还原这款工具，我也是将熊的图片放进了原型中，其次就是一些常见的交互动效，这次给大家讲解一下Mockplus中如何实现侧滑菜单效果。先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/niWz9rg0LCnuyKZk/index.html 三个步骤轻松搞定侧滑菜单： 1....

5 min read
美食类App原型制作分享-Recipes

Recipes是一款美食菜谱类App，这次用到的一些交互主要是图片的左右切换、滚动的微交互，Mockplus在滚动的支持上比较友好，可以拉长手机外壳，或者使用滚动区组件，选择后者可以做滚动页面上面的悬浮按钮、悬浮菜单等。下面一起来看看。先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/337s5n5TY2tvSrL7/index.html 再送上U...

5 min read
工具类App原型制作分享-Asana App

Asana是一款工作任务管理工具，它有手机端和网页端，这款App在配色上很棒，采用了一些渐变色，这里由于是制作原型，采用的色彩依然是黑白灰，主要体现功能和交互，这类App，功能上，注重任务创建方便快速、任务完成进度跟踪，任务分类归档清晰，对于团队任务，分工明确，管理便捷等，下面一起来看原型，之后会和大家分享这款软件的网页版，可以对比App端和网页端的一些设计规范和区别。先简单看看动图：点击这...

5 min read
美食类App原型制作分享-Bon App！

Bon App!是一款美食类App，这次也是尝试做出高保真的原型，最大可能的还原了App的配色和交互。因为是高保真，所以特别注意的就是细节的设计，图标、按钮形状、输入框样式等，在属性上都做了相应的设置，Mockplus的组件属性还是相当丰富，但如果涉及到一些个性化的组件，就需要使用一些基本组件的拼凑（比如二维码扫描）；另外，交互方面也高度还原，弹出、内容切换、滑动这些基本交互都能轻松实现，一起来看...

5 min read
健康类App原型制作分享-Pillow

Pillow,一款健康类App，主要是睡眠管理类型的，这类App比较讲究页面视觉上的舒适安心。功能上，有一个时间选择器，这个功能采用的是两个滚动区组件，分别在组件内设置小时和分钟数值，演示时，用户可以上下滑动来分别选择时和分的数值，直观的表达了交互效果。先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/YVS4lFUqznF8OLoC/index.ht...

5 min read
旅游类App原型制作分享-Triposo

今天带给大家的，还是一款旅游类App，这类App在设计时的一些注意问题前面已经给大家分享过了，这次重点给大家展示的是这一款原型中的启动页面，在设计的时候，只用了一个简单的交互效果：隐藏显示，触发方式是载入时。只需要几秒钟，这个启动页面的交互效果就轻松搞定。一起来看：先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/yRQ4R8odtbmEmcbA/in...

5 min read
运动类App原型制作分享-Zombies, Run

Zobies, Run，一款运动类App，帮助监督你实行自己的健身计划。这款App我试着做了板块的立体视觉效果，由于Mockplus中没有阴影效果（当然在原型阶段这是不必要的），但是为了尝试让这款App的特点更突出，我用矩形组件去除部分边框，只留下底部边框，再将底部边框颜色加深，从而实现一个立体效果的选项，其次，分隔条我也使用了两根不同颜色的线条组合，做出了立体分割的效果。下面，来一起看看效果吧。...

5 min read
微信原型组件分享-WeUI

随着微信的普及，小程序也开始进入了人们的生活，方便快捷的操作，无需安装的特点得到了人们的喜爱和认同，那么，开发小程序必不可少的当然是微信的组件规范，今天就给大家带来了微信常用的一些组件，使用Mockplus的朋友可以下载后直接使用哦，之后，我也会尝试小程序的原型，让大家对小程序更加了解。先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/Tnr9w9Ty...

5 min read
音乐类App原型制作分享-Qello Concerts

Hi~今天做了一套音乐类App Qello Concerts，这类App和美食、旅游类较类似，都是需要后期图片的填充，因此图片质量至关重要。在做原型的过程中，基本组件就能满足要求，但是这次尝试用Mocplus中的基本组件结合移动交互做了一个异性选项卡，外观和切换动画效果还不错，下面一起来看看吧！先简单看看动图：点击这里，可以立即在线预览：http://run.mockplus.cn/f9Lf...

5 min read
设计1+2，摹客就够了！

全能设计协作平台，
产品经理用RP，UI设计师用DT
免费使用

电话咨询

咨询热线

工作时间：9:00-22:00

191 3067 1449

在线客服

需要帮助？

我是小摹，你的7*12小时产品顾问

立即扫码加入官方微信群