Today, I’ve made a prototype of Gogobot with Mockplus, an App for travel. To make it look as real as possible, I’ve customized the App color by using the function of color picker in Mockplus, which is totally hassle-free. In
Mockplus supports teamwork now! Work with your team members efficiently to make amazing prototype in Mockplus. Let’s learn how to create a team project; divide designing permissions; notify others to review the project and comment & mark up one’s design in Mockplus!
Mockplus v3.0 adds team collaboration functions, including multi-user editing and review. 1. Multi-user editing A. Create a team project. B. Sync the project to the cloud. C. Add a collaborative member. D. Now the member can open the project on his/her own
In Mockplus, there are two ways to copy formatting, which will help you work efficiently: 1. Format Painter. Select a component and click the “Format Painter” button on the main toolbar.Your cursor will turn into a cross. Now, move the
This tutorial shows you how to make floating buttons with Scroll box， and how to set interactions of scrolling to the top and bottom.
Main pages: Home, Cook, Details, Favorites, etc. Download mp file: Click here View this project online: http://run.mockplus.com/teKl7J4o73vE9CAx/index.html
We have received many email from our users, some of them were asking about how to activate a Mockplus Pro Account after the purchase. Actully, The account has been already upgraded at the moment of purchase. Let’s see how it’s
Main pages: Home, Sounds, Details, Sleeping Tips, Timer, etc. Download mp file: Click here View this project online: http://run.mockplus.com/C9UMo1iW4GtTF4fF/index.html
Main pages: Sign Up, Log In, FAQ, Blog, Contact, etc. Download mp file: Click here View this project online: http://run.mockplus.com/mRmjCrHCGpMQTcva/index.html
Main pages: Choose City, Search, Assistance, Become A Concierge, etc. Download mp file: Click here View this project online: http://run.mockplus.com/QIo6tvr1Mrqa4Sxk/index.html
Main pages: Sign Up/In, Mockplus, Details, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/vi4Pwi2FTO5x6E4m/index.html
Main pages: Sign Up/In, Book Flight, Settings & More, Latest Travel Information, etc. Download mp file: Click here View this project online: http://run.mockplus.com/KWi9Qd47mMecygHb/index.html
Main pages: Details, Login, Charity Auction, profile, etc. Download mp file: Click here View this project online: http://run.mockplus.com/0dd6K48ZiL6cvrXl/index.html
Every user who purchases the “Unlimited Perpetual License” can enjoy all Mockplus Pro features for lifetime, with no expiration. Meanwhile, you can get all new versions and updates, be minor or major, without extra cost for the future upgrade or
Main pages: Sign Up/In, Home, Shop, Latest, etc. Download mp file: Click here View this project online: http://run.mockplus.com/ISSmh9vZojm5a80M/index.html
In Mockplus 2.3, there are some new features, this is one of them. With this function, you can sync and share with your friends and colleagues. This will also help you to work more conveniently no matter where you are.
At the beginning of 2017, we are delighted to announce the official release of Mockplus 2.3 version where there are a set of improvements and enhancements. Please find what you like in the following: 1. Cloud project, share and
Main Pages: Start up, Set Passphrase, Sync With iCloud, Categories, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/i7MqJZCB3BG9avxj/index.html
Main Pages: Entrepreneurship, Courses, Programs, School & Partners, About, etc. Download mp file: Click here View this project online: http://run.mockplus.com/4B3vLWLJVIZNQFng/index.html
Main Pages: Sign In/Up, Profile, Details, Clients, Invoices, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/1rX9Bpq2IdKiafOp/index.html
Main Pages: Contact, Donate, About, Map, etc. Download mp file: Click here View this project online: http://run.mockplus.com/3SV0EaSIkHpdYvqx/index.html
Main Pages: Function Introduction, Home, Register & Log In, etc. Download mp file: Click here View this project online: http://run.mockplus.com/DPAK88UPFzBf9cAj/index.html
Main Pages: Start, Sign Up/In, Manage, Filters, Favorite, Alerts, etc. Download mp file: Click here View this project online: http://run.mockplus.com/EaepTRNJCgOjER9u/index.html
If you are new to Mockplus v2.3 or have never used any earlier version before, then you can skip this post and set it aside. But if you are a regular user, be sure to read the followings carefully. 1.
Main Pages: Selection, Home, Manage, Filters, Lists, etc. Download mp file: Click here View this project online: http://run.mockplus.com/twRkkEswfvpu3kks/index.html
Main Pages: Home, Login, Profiles, Collections, etc. Download mp file: Click here View this project online: http://run.mockplus.com/JPQG3DFM3F16aSgw/index.html
Main pages: Log In, Featured, Settings, Contact Us, etc. Download mp file: Click here View this project online: http://run.mockplus.com/MFj6h8LS8NIQdZ4U/index.html
Main pages: Home, Shop, Designers, Wishlist, Shopping Bag, Search, etc. Download mp file: Click here View this project online: http://run.mockplus.com/cSoh7cSWjxjCdHOp/index.html
Main pages: Start, Home, Welcome, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/emCUjie9AygiBigt/index.html
Main page: Home, World, Business, Sports, Download, Save, etc. Download mp file: Click here View this project online: http://run.mockplus.com/WTs8DR8RrMdyGXbm/index.html
Main pages: Home, Menu, Details, Contact, etc. Download mp file: Click here View this project online: http://run.mockplus.com/DBz2cHoW92GgtRzV/index.html
Mockplus is one of the easiest prototyping tool. What Mockplus can do? And how to prototype Faster, Smarter, and Easier with Mockplus? Let’s find out!
Main pages: Welcome, Home, Menu, Help, etc. Download mp file: Click here View this project online: http://run.mockplus.com/NKpn7HrxBbrE6Lnb/index.html
Main pages: Home, Categories, Login, Messages, etc. Download mp file: Click here View this project online: http://run.mockplus.com/b81yeGY8bnBzgFt6/index.html
Main pages: Register, Login, Forums, Download, Contact, etc. Download mp file: Click here View this project online: http://run.mockplus.com/Wrm9GuZcD0TCwsse/index.html
Main pages: Home, Welcome, Trash, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/VtKRn1nhSZKs12jf/index.html
Main pages: Start, Histogram, Line Chart, Area Chart, Pie Chart, Distribution Diagram, etc. Download mp file: Click here View this project online: http://run.mockplus.com/dKcM6f5FLnGxREtW/index.html
Recipes is an App of food recipes.This time I made some interactive effects like switch of pictures and scroll effects. Mockplus has good scroll effects, you can realize them by stretching the mobile page or using scroll box. If you
Asana is a work management App, which is available on both mobile and PC. This App has great color matching with some gradient ramp. Since it is a prototype of Asna, I still use black, grey and white color, because
Main pages: Dashboard, Calendar, My Tasks, List, etc. Download mp file: Click here View this project online: http://run.mockplus.com/5bQJnX2BIFcNOjyp/index.html
Mockplus is made for prototyping Faster, Smarter, and Easier. Today, let’s focus on the setting of interactions: Page Link, Components Interaction, and Interaction State.
Mockplus has over 200 components, but I still want some for my own. Let’s check out how to make your own components in Mockplus.
Pillow is a health App which helps to supervise your sleep. This kind of App concentrates on the visual comfort a lot. As for the functions, there is a Timepicker which is made by two scroll boxes on which there
Bon APP!is a food APP. This time I try to make a High-fidelity prototype and highly simulate the colors and interactions of the original App. As it’s a high-fidelity prototype,I must pay much attention to the details such as the
Main pages: Notification and Upload, Operation Succeed, Form error, etc. Download mp file: Click here View this project online: http://run.mockplus.com/QBKIhKPOujguMeZi/index.html
This time I want to share with you a traveling app. I’ve introduced something we should pay attetnion to when designing this kind of apps. Today, I mainly show you the starting page of this prototype, on which I used
Main pages: Home, About Us, Who We Work With, Contact, Details, etc. Download mp file: Click here View this project online: http://run.mockplus.com/FAc3b8ZB5eZ5RQll/index.html
Mockplus is a new and fast-growing rapid prototyping tool. Although Mockplus is not as comprehensive as Axure RP functionally, it has a lot of unique features. Testing could be a really painful thing in some prototyping tools, especially when it
1. Import image with “Image” Component. Drag and Drop an Image component to workspace, double click. In the popup panel, you could choose to import image from your computer, or download a image from website. 2. Copy and paste
Main pages: Home, Ways to Sell, Pricing, Blog, Guides, etc. Download mp file: Click here View this project online: http://run.mockplus.com/KpHQBcB4ncilUFKc/index.html
Zobmies Run is a sport app which helps you to supervise your fitness program.I tried to make some stereoscopic effects in this app.As Mockplus has no shadow effect(Of course,it is not neccessary in prototyping),I used some methods to make the
Guides is an App for travel. There is not that much color in the App itself, and the focus is to highlight various tourist attractions. Henceforth, this App pays attention to the quality of pictures, especially for those pages with
Main pages: Home, Spotlight, Top Wached Concerts, New Releases, Browse, etc. Download mp file: Click here View this project online: http://run.mockplus.com/Unnq98LzzQIo0IUd/index.html
As its name implies, FitStar Yoga is a yoga App that helps users easily learn yoga courses. It’s mainly video-based, but there is no need to insert the real videos into it as it’s just a prototype for presentation. In
BBC is a sports news App. With the rapid development and popularity of smartphones, the mobile has become an integral part of our life. In addition to the traditional way to read the news, people are more likely to browse
8 ways to test your prototype, this is amazing, right? Let see how to do that with Mockplus v2.2!
Feast is a food App where users can share their own photos and experiences of food. Meanwhile, it’s also a recipe with a wealth of food resources and you can easily learn a variety of fancy cooking. Of course, such
Coach.me is a fitness tool. Nowadays, many office workers lack exercise and their physical quality is gradually getting worse. This kind of tool can help and supervise you to do exercises in your spare time. It’s rich in features and
Balanced is a memo tool. The highest priority of this App is ease-of-use. Let’s say if the operation is too complicated to perform, then you won’t be able to make the records timely and effectively. While designing this App, I’ve
Download mp file: Click here View this project online at http://run.mockplus.com/dmAHaSNtE2TO9ttl/index.html
In Mockplus 2.2, you can export your prototype to HTML files for testing or getting feedback. So far, the exported HTML files are ‘.zip’. You can send the the exported zip file to client or co-worker so that they can
Main pages: Introduction, Morning Exercises, Settings, Add Stopwatch, etc. Download mp file: Click here View this project online: http://run.mockplus.com/NLthlhHHbcBGMiQh/index.html
Main pages: Sign In/Up, Home, Settings, etc. Download mp file: Click here View this project online: http://run.mockplus.com/gN3fCv7ZWlJvoboJ/index.html
Villoid App is a shopping App. I have followed the prototype design standards and use the color combination of black, white, and gray to give UI designers more freedom in the use of color. In specific, I have added some
Main pages: Home, Categories, Calendar, Add Category, Food, etc. Download mp file: Click here View this project online: http://run.mockplus.com/a7NfBVJNsOwZJ0cg/index.html
Mimo is an App for online-learning, and I have designedly added the guide page into the App this time. In my opinion, a good design can guide users and help them understand the product characteristics and approaches in the least
Following are simple steps on how to deploy your exported HTML to your server: 1. Export your prototype to HTML. 2. Upload all the files and folders under the exported folder to the server (as shown on the pic below).
To carry your project to a different place and view it on mobile device, please follow the steps below: Method 1: 1. Publish project. 2. Input the view code in Mockplus mobile client. 3. Return to the app main interface
Due to the data upgrade in Mockplus v126.96.36.199, you may be prompted “File is not compatible” on mobile screen. To address it, please follow the simple steps below: 1. Firstly, make sure both desktop and mobile versions of Mockplus have
Sometimes we need to design a prototype with our group. It’s really not convenient if you can’t work in collaboration. Now, this video will show you the way of how to collaborate offline with your group. Let’s check it out!
Here comes another new video of Mockplus Rapid Prototyping Tutorial series, namely “Prototyping Easier with Mockplus” We always want to work in an easier way, but it seems so difficult. Now, let Mockplus solve your problem.
As is mentioned in this tutorial, we can set scrolling for a mobile prototype by lengthening the page, with both header bar and footer fixed. Also, there is another effective way to achieve scrolling via a component called “Scroll Box“.
While using the Popup Panel, you may find that you are able to close a popup window while clicking external area. This is what we call Popup Panel auto-close policy. There are three options of the Close policy in the component properties
By default, Popup Panel could be closed automatically. If you want to close the Popup Panel manually, please follow the two steps in below: 1) Double click on the Popup Panel to activate the edit mode, then select a component (like Button).
Here comes another new video of Mockplus Rapid Prototyping Tutorial series, namely “4 Interactions with 1 Button“. It’s painful to control multiple components at the same time, but you can easily make it by using ONLY one button as is
Here is a new video of Mockplus Rapid Prototyping Tutorial, that is “30 Seconds Prototyping with Mockplus“. Go check it out and learn how to make a message box which could disappear automatically in 30 seconds. Hope you will “Like”
The subscription of Mockplus is auto-renewed by default, but you’re allowed to turn off the automatic renewal through MyCommerce (our 3rd-party payment service provider) by following the instructions below: 1. Open http://ccc.shareit.com/ccc/ and enter this page as follows: 2. Click
Notice：This video is match with Mockplus v188.8.131.52.
In the version of Mockplus 184.108.40.206, some of the components have a new option now – “Word Wrap”. You could use this function to arrange the words in “Button”, “Text Area”, “Shape”, “Sticky Note”, “V.Curly Brace” and “H.Curly Brace”.
To view in full-screen mode when your HTML page is already open in the mobile browser: With Safari: look for the Share icon (box & arrow) in Safari at the bottom of the screen > click “Add to Home Screen”
The way to edit “Data Grid” is very easy which is controlled by a set of text codes. Once you become familiar with the codes, you are able to edit “Data Grid” effortlessly. The picture below is a “Data Grid”
This tutorial shows you how to create your own button using “Shape” component, and save the custom button into favorites.
You can use Mockplus’ hotkeys to quickly add basic components, for example, create a button: B create a label: A create a text area: T create a shape: S create an icon: C create an image: E create a textbox:
With a few clicks, you are able to set links between pages, which enables you to create interactive pages effortlessly. Please follow the instructions below: How to set links through drag-and-drop option How to preview your design How to redirect
Master has been added to Mockplus 2.1. With the help of Master, you can apply global changes for the interactive prototype rather than repetitive operation. Let’s see the video tutorial and learn how to build one: Instructions for Master 1.
In a few cases, you may have troubles in previewing prototype on mobile device after scanning the QR code offline. Please follow the tutorial below to find a solution accordingly. 1. Please add Mockplus into firewall trust list. If you
When upgrading to Mockplus from V2.0 to V2.1, you may lose the items previously saved in ‘My Favorites’. To avoid this, you should migrate the related configuration files of Mockplus V2.0 to V2.1. Using the example of Windows 7, below
Mockplus v2.2 makes it very easy to publish your prototype to the cloud. Uploading a prototype to the cloud allows your clients & co-workers to test your prototype wherever they are. For app prototype, you can also preview it directly
Mockplus provides with three ways to view a prototype on your mobile device. Choose the comfortable one fit for your needs. Method 1: Publish prototype and view it via URL in mobile browser. Method 2: Publish prototype and then use
Q: Why dose Mockplus prompt me to download the Mockplus mobile client after scanning the offline QR code with a third-party app? A: A third-party app can be used to scan the offline QR code, but the prototype created by
Cloud Sync is a newly-released feature in Mockplus 2.0.8 and the later versions. You can seamlessly sync and share files from different places. (Please note that Cloud Sync here doesn’t mean to upload projects to the web for editing. Projects
Firstly, we are deeply sorry for the inconvenience caused to you. To fix this issue, please follow the tutorial below. 1. Close this project and reopen it from Mockplus main menu. Please note that the unsaved data will lost. 2.
When the size of a background image or a container is relatively bigger, operating the components in the front might not be easy. When that happens, we could “Lock” the image or the container so that it will not respond
For project with large pages, it might not be convenient if you use the scroll bar to move the canvas. You can press “Space” key with your left hand, and you will see a hand cursor. Drag the page with
Select “Keyboard shortcuts” from the Main Menu/Shortcut Menu or press Ctrl+F1, you will be able to browse a list of all the shortcuts.
What Does It Mean to “Group”? To “Group” is to put more than one component together into one group, such as “Grouping” a “Label” component and a “Button” component together. By “Grouping” and operating a whole group of components instead
If you want to exchange data between two projects, you could use “Export and Import page” or “Export and Import component”: 1. Open project A, select the page you needed (one or multiple) in the Project Tree. Right click the
Mockplus will automatically back up your projects. Please follow the tutorial below to learn how to recover any earlier projects. Go to the Mockplus shortcut menu on the upper left corner > choose “Backups” from the drop-down menu > select