Flexible workflow
Allows designers, developers and product managers to customize their design workflow according to their individual needs and collaborate without any effort online.
Auto & manual specs
Export specs directly from Sketch, Adobe XD, Photoshop or Figma, and send them to developers in one doc. Bake specs creation right in a design workflow. Improve the handoff process with the 5 markup tools.
Page/version comparison
4 ways to compare two pages - “Split”, “Fade”, “Slide” and “Difference” . Quickly spot the differences and make your work more efficient. A historical page or project version will be automatically created and saved whenever you introduce a change.
Document references
Use “Comment” and “Review” modes to add document/link references to designs. Documents/links will be visible in the context of the design, so your teammates don’t need to search for them. They can access these documents while commenting on designs or viewing design specs.
Full-view storyboard
Use Storyboard to view, navigate and rearrange all screens of your project. Add logical lines and descriptions for the screens. Use drag-and-drop to clearly present UI flows.
Pin style
Use Pin tool to share your feedback and ideas on designs. Choose a preferable pin style (customize color, number, or avatar).
Team & project activity
Track your project and design team activities in real-time. Get automatic notifications whenever team members add, delete, or modify a page. You will also be notified when any team members added or removed.
Tailored to platforms
Download assets in one click. All assets are perfectly tailored to Android, iOS and web.
Compress the size of assets
Compress and download all required assets such as images in half of the original file size.
Comment tools
Mockplus Cloud allows leaving comments directly on design. Following comment tools are available for you - Rectangle, Circle, Line, Arrow and Pin.
Auto-generated style guides
Customize style guides by adding any auto-generated color or font style to your libraries. View and download the CSS code of individual elements in the “Style Guide” mode.
Support all product documents
Upload, preview, share and download all popular product file formats, including Axure/Mockplus/Justinmind, PDF, Office, Text documents and images.
Shortcut keys
Mockplus Cloud provides a full list of shortcut keys to streamline your design process.
Sketch / PS / XD / Figma / Axure integration
With the Mockplus Cloud plugin, you can import designs directly from Sketch / PS / XD / Figma / Axure. Collaborate, iterate and handoff designs easily online.
Mockplus/Axure prototype integration
Import Mockplus or Axure prototypes. Collaborate and iterate with other designers, developers and product managers.
Smart gestures and animations
Choose from 8 gesture options and 15 types of animation effects and create a more realistic and clickable web/app prototypes.
Preview & share online
Use one single link to preview prototypes online and share them with your team.
Download demo package
Download the demo package of your prototypes, preview and test it anytime and anywhere. All the data in the package is available offline, so you won't need to have an Internet connection.
Mockplus Cloud app
Download and install the Mockplus Cloud app on your mobile device to preview and share online projects, prototypes and documents directly on mobile.
Create projects
Create mobile or website projects and set them as “Private” or “Team” projects.
Group projects
Group your projects based on different project types/creators.
Project folder
Create project folders to categorize your projects. Manage your mobile and website projects, hi-fi and lo-fi prototypes separately.
Manage members
Invite all project members with one single link, and set their roles & permissions.
Archive/favorite project
Archive your finished projects, add essential projects to your favorites. Projects can be automatically moved to the “Archive” or “My favorites” groups. You can move projects away from the Archive to make the editable again.
Reorder projects
Reorder your projects using drag-and-drop, change sorting order to “Creation time” or “Update time.”
My projects
View all projects created by the team or view only projects created by you.
Import images
Import images in various formats, including PNG, JPEG and GIF format.
Bulk import for images
Drag & drop an image folder or zip archive to import all images. Your images will be automatically parsed according to the original directory structure.
Import designs from Sketch/PS/XD/Figma
Import designs and assets directly from Sketch/PS/XD/Figma and collaborate, iterate and handoff them easily online.
Import Mockplus and Axure prototypes
Import interactive Mockplus/Axure prototype and collaborate, share and iterate with other designers, developers and product managers online.
Logical line
Drag and drop logical lines to showcase the UI flows of your web/app. Double click on the logical lines and add descriptions to explain details.
Project tree
Project tree shows the hierarchical relations between design screens. Drag & drop to reorder, group, rename or delete design screen.
Page markup
Choose different icons, numbers and colors to mark up your page. Mockplus Cloud will show the page status visually.
Rearrange pages
Rearrange all design pages with one click and customize the page columns in a row. Select a specific page to see its details.
State page
Import different states of the same page, merge and separate them.
Group pages
Group related design pages in the left Project Tree panel.
Rich comment tools
Comment directly on designs and share your feedback with teammates. Communicate design ideas using the ”Rectangle,” “Circle,” “Straight line,” “Arrow” and “Pin” tools.
Comment status
Filter comments by status (the status can be “Unsolved”, “Resolved” and “Close”)
@members
Use the tag @members to ensure the related team members are fully aware of design ideas.
Filter comments
Filter comments based on different member names and comment statuses. The results will be shown at the right comment panel for better viewing.
Pin style
Use a preferable pin style (color, number and avatar) for your comments to provide design ideas more intuitively.
Multiple select and copy comment
You can select, copy, mark up or delete multiple comments at a time.
Automatic specs
All design specs are generated automatically. Click or hover on any design element to view its spec details.
Percentage specs
Press the “Alt” key to view the percentage specs of any design elements.
Set as Reference Layer for Percentage Specs
Right-click on a layer to set it as the reference layer for percentage specs. The layer can be used as a reference to calculate the percentage value of the specs.
Layer tree and layer panel
The layer tree provides a clear view of the hierarchical relationships between layers. The layer panel at the right side showcases all layer properties and CSS codes.
Set the measurement unit
Mockplus Cloud provides all measurement units for both Android and iOS devices. Choose your platform and the measurement units will be adapted to meet your needs.
Magnifier
View all design specs in detail. Zoom in/zoom out to see the design details.
Create design specs with special tools
Bake specs creation right in your design workflow. Improve the handoff process with the 5 markup tools.
Download assets
No need to waste designers' time by asking them to prepare specs. You can get all the required information yourself whenever you need it.
Tailored to platforms
All the assets are perfectly tailored to Android, iOS and web.
Compress the size of assets
Easily compress and download all required assets such as images in half of the original file size.
Create custom asset styles
Get assets with transparent background, padding or different scales.
Drag-and-drop interaction
Build fully-interactive prototypes with simple drag-and-drop.
Back Link/Home Page/External Link
Drag and drop the link point of a hotspot to different design pages. Set them as the home page or add a backlink/external link.
Gestures and animations
Choose from 8 gestures and 15 types of animation effects. Personalize execution and delay time to create more realistic and clickable web/app prototypes.
Delayed auto jump
Set a delay time for interactions between pages. You will then be automatically led to the targeted page with the specified delay while previewing.
Interaction markup
After an interaction between pages is executed, an interaction markup - a blue triangle - will be added to the related page on the left panel tree for better viewing and management.
Set scroll area
Set a fixed header and footer for your design page with simple drag-and-drop. The remaining body area will be scrollable while previewing.
Clone interactions
Interactions can be cloned in one click, with the same hot zone sizes, target pages, and animations.
Preview
Choose different modes to preview and test your prototypes (such as previewing from the homepage or the current page) on any PC or mobile device.
Share
Share your prototypes across your team with one link or an offline demo package which allows everyone to preview projects natively, even without a network connection.
Preview on mobile
With the Mockplus Cloud app, you can easily preview, demonstrate, and share your prototypes on mobiles anytime.
Support all product documents
All product documents, including Axure/Justinmind prototypes, PDF, Office files, and images are easy to upload, preview, and download.
Group documents
You can place product documents with the same category and purposes into one group for better management.
Share documents
Share any desired documents across your team with one link. Team members can preview and download these documents anytime, anywhere.
Upload and share prototype files
The demo packages of Axure, Mockplus, Justinmind, and Confluence files can also be uploaded, shared, and managed online in Mockplus Cloud.
Add style guides
Add any font or color style guides to your library with one click on the left property panel; no need to manually build style guide libraries from scratch.
Customize style guides
Customize color style guides to complement your style libraries and define the related color name, variable name, color value, and other information as needed.
Inspect and download CSS codes
Related CSS codes will be generated automatically. You can copy or download the codes for developers in one click.
Generate revision histories automatically
A historical version is automatically generated when the project gets modified, overwritten, or replaced. You can also switch between different historical versions freely with one click. No manual work required.
Version comparison
Compare historical versions using four modes - Split, Fade, Slide, and Difference - to find design differences quickly.
Page comparison
You can compare any two design pages in the project tree to find the differences with ease.
Comparison modes
Mockplus Cloud provides four comparison modes for you to compare design versions and pages: Split, Fade, Slide, and Difference modes.
Team activities
With Mockplus Cloud, you can easily track the activities of team members and projects to make sure everything is under control.
Project activities
You can also track project activities in real-time and get notified when a project/project folder gets added, deleted, modified, or updated. Every activity is automatically recorded and can be tracked to avoid any unexpected mistakes.
Team management
You can customize, transfer, dismiss, upgrade and manage your design teams in Mockplus Cloud for more effective collaboration.
Department management
With Mockplus Cloud, the roles, departments, and projects that a team member can participate in can be easily set in advance for more efficient team management.
Set roles and permissions
Mockplus Cloud provides four roles for team members: Super Admin, Admin, Member, and Collaborator. Different roles come with particular permissions for better management.
Sketch integration
With the Sketch plugin, you can directly export designs and assets from Sketch for further collaboration, iteration, and handoff online.
PS integration
With the PS plugin, you can directly export designs and assets from PS for further collaboration, iteration, and handoff online.
Adobe XD integration
With the Adobe XD plugin, you can directly export designs and assets from Adobe XD to make collaboration, iteration, and handoff easier.
Mockplus/Axure prototype integration
Directly import Mockplus or Axure prototypes to collaborate and iterate with other designers, developers, and product managers online.
Enterprise private cloud solution
All services and solutions will be deployed to your infrastructure, and you can access and take full control of your data. Everything is super secured.
Customize for your enterprise
The Mockplus team provides more advanced services for enterprises, such as a custom team size, private cloud deployment, and other personalized services.
Full list of shortcut keys
Every mode of Mockplus Cloud provides a full list of shortcut keys to simplify your design process. Simply click on your avatar to view the shortcut list.
Product documents
You can write product documents from scratch online, insert a wireframe or hi-fi prototype for further explanation, reference documents as well as pin a comment. Also upload PDF, Doc or Docx documents for online previewing and reviewing.
Online editor
Mockplus RP enables your entire product team to work on the same project at the same time online, regardless of their location, types of used devices and operating systems.
Share and review online
Easily share your project across the entire team with a single preview link that generates instantly once the project is complete. Team members can then review, comment and handoff it online anytime, anywhere.
Team review
Attach your comments to any design element to let your teammates know exactly what is happening with our comment tools: Rectangle, Circle, Line, Arrow and Pin.
View layers and annotations
In Development mode, all annotations are auto-generated. Click or hover on any element to view it's layer data and spec details. Hasten the design handoff process with 5 markup tools.
Copy CSS
CSS codes generate automatically. You can copy the codes for developers in one click.
Page interactions
It is super easy to create and customize various component states like "Mouse hover", "Pressed", "Selected", "Focused", "Disabled", etc. to bring your prototype closer to the actual app
Command interactions
Mockplus RP supports adding rich command interactions between different components.
Interaction triggers
Mockplus RP provides a wide range of triggers like Click, Double click, Right click, Mouse down, Mouse enter, Moved, Shown, etc.
Flexible animation
You can programm animation for different triggers live 'Move', 'Resize', 'Zoom', 'Rotate', 'Display/Hide',etc.
Animation effects
Vitalize your designs with our broad list of animation effects, including Easing animations, Delay, Duration, etc.
Pen tool
Use the Pen tool to draw curved or straight lines, create any desired vector logos, shapes and illustrations with any level of complexity. It empowers your product team with the powerful graphic editing tool that's meets the pickest.
Boolean operation
Create complex shapes, logos and icons with four Boolean combination options: Unite, Subtract, Exclude, and Intersect.
Cut segment
You can cut segments off shapes in one click for easier and faster shape editing.
Responsive layout
The smart way to deal with the layout design is The Responsive Layout - the ultimate tool to adapt your designs to different screen sizes automatically.
Pencil tool
Use Pencil tool to sketch lines and shapes and give your designs that relaxed hand-drawn feel.
Connect mode
With Mockplus RP, you can create rich UI/UX flowcharts with simple drag-and-drop. Prototypes combined with intuitive flowcharts can really help your team communicate and collaborate better.
Design assets
Save your custom colors, text styles, and components to your asset library in one click. Manage your libraries perfectly and tag your favorite one.
Shorcuts
Mockplus RP has a substantial set of shortcuts, making your design process quicker and much more efficient.
Auto save
All your designs and changes are auto-saved in real-time. No data will be lost again.
Layer tree
In the left Layer Tree panel, all design layers are displayed in order, making it easier and quicker to select or locate the desired layer.
Group components
Group components quickly by using the "Group" button or the shortcut "Ctrl-G" to expedite editing, moving or zooming multiple components at the same time.
Rich ways to preview and test
You have many ways to preview and test your projects on PC and mobile devices. Simply share a link across your team to preview and test it anytime and anywhere.
Real-Time collaboration
Your entire team can work on the same page in real-time and all changes will be synced instantly. View the page editing status and prototype designs together.
Run animations simultaneously
In Mockplus RP, you can execute interactive commands for multiple components sequentially and simultaneously.
Icon library
Mockplus RP supplements your prototypes with over 3000 high-quality, cross-field vector icons of various themes, such as Office, Social, Transportation, Multimedia, Logo, Device, etc.
Bold and light icons
Mockplus RP provides thousands of icons in both light and bold styles to match your design.
Highly customizable components
Mockplus RP provides many scalable compound components with pre-programmed interaction effects to help you archive the desired effect.
Advanced text editor
Use Text Editor to quickly edit, delete, reorder items, and set a default option for a multi-item component.
Advanced style editor
Enjoy the high-degree of freedom in adjusting the style of multi-item components and customize your components faster and easier.
Rich text
All text component support rich text. What you see is what you get.
Infinite workspace
A workpage in Mockplus RP extends beyond space so that you can design everything at the speed of thought.
Multiple pages
Mockplus RP enables you to create as many pages as you need. In combination with the main and sub-artboards, you can give you prototypes clearness and structure.
Main and Sub-artboards
Use the main artboard together with unlimited sub-artboards to create pop-ups and page links, or present other dynamic contents with ease. Only the Main artboard is visible in Preview mode.
Export projects
In Mockplus RP, you can easily convert an artboard into image by right clicking and choosing "Download" from the right-click menu.
Clone projects
You can easily clone projects to back up your data and explore all the crazy ideas while keeping the main version intact.
Copy and paste data across projects
Mockplus RP allows you to copy and paste data across different projects if they are open in the same browser, which saves a lot of navigation time.
Full list of properties
You can edit properties of your components like shadow, corner radius, line cap and join, image adjusting, etc. to customize your design.
Equal spacing
You can quickly adjust and evenly space multiple items.
Navigation map
The Navigation map displays all artboards, components, and other elements of a project/page, giving you an overview of the workspace and enabling you to quickly locate a particular artboard/item.
Project samples and templates
Directly import Mockplus Classic project samples and templates to create your own design layouts or prototypes quickly when creating a new project.
Publish and share online
Publish your projects to the cloud and easily share them across your team in one link.
8 ways to preview and share
There are 8 ways to preview, share, and test your prototypes on any device. These include previewing with QR codes, Wechat Mini Programs, and mobile apps.
Cloud project management
Open all your cloud projects and manage them as you wish. View project histories, set a password for projects, notify team members, download any projects, and carry out other operations.
Import Sketch designs
With the Sketch plugin, you only need one click to import Sketch artboards directly for further editing and collaborating in Mockplus Classic.
Repeater
Use Repeater to create grid layouts quickly with simple drag-and-drop, avoiding repetitive work. Also, edit styles of images and texts in all grids synchronously.
Auto Data Fill
Fill a single image or a batch of images and texts with one click. While using Repeater, you can build repetitive layouts or components (such as a list) quickly to save time and effort.
Mindmap design mode
Mindmap can quickly reflect your design ideas and project structures with simple drag-and-drop. You can also export your Mindmap to an image format to preview or make your PRD.
Master
Create and reuse masters, and apply any changes across your prototypes to hasten your design process.
Format painter & paste style
Use Format Painter and Paste Style features to copy and unify component styles quickly and efficiently.
New table component
The new Table component works the same as an Excel spreadsheet. You can also easily add, edit, merge, and split cells; set the style and text format of one or more cells, and quickly organize PRDs in your project.
Auto specs
Enable or disable auto specs with one click to optimize the page layout and build more accurate prototypes.
UI flow
Generate and export the UI flow with one click to view logical relationships between pages, page layouts, and markups anytime.
Team collaboration & management
Mockplus Classic allows multiple users to work on the same project at the same time and provides rich team collaboration features, such as inviting and notifying members, syncing and sharing component or component style libraries, and setting roles and permissions for team members.
Component style library
You can save and reuse any component styles with one click to keep your design consistent. Also, sync and share your libraries across your team with simple clicks.
Auto backup
Mockplus Classic backs up your designs automatically every 10 minutes by default. If your file is accidentally deleted or damaged, you can recover it easily from previous auto backups.
Page outline
All project pages are displayed in the form of component layers, which makes it faster and easier to view the hierarchical relationships between components.
Revision history
View and download any historical version and set passwords.
Shortcut keys
With over 70 shortcuts, Mockplus Classic makes prototyping a piece of cake.
Make prototypes for all platforms
Mockplus Classic is an all-in-one prototype tool that allows you to create prototypes for mobile (Android & iOS), desktop (PC & Mac), and web apps.
Powerful component library
Mockplus Classic provides over 200 ready-made components to prototype your ideas easier and faster, such as full sets of markup, pop-up, chart components, and other layout components.
Android/iOS libraries
Mockplus Classic provides rich pre-built components, templates, and icons tailored for Android/, iOS phones and tablets. You can also subscribe to and download UI component libraries.
Web UI libraries
Mockplus Classic provides a full set of ready-made web components - such as Window, Browser, Stack panel and Scroll box - for you to make web prototypes easier and faster.
Powerful style library
Save, reuse, and share your component styles with one click to keep everybody on the same page and increase efficiency.
Component style library
You can save and reuse any component styles with one click to keep your design consistent. Also, sync and share your libraries across your team with simple clicks.
Icon library
Use over 3,000 high-quality, cross-field vector icons to optimize your prototypes.
Project samples and templates
Use a large number of built-in samples and templates for optimal project creation.
Group elements
Select and group multiple elements on the page for further editing and reusing.
Rulers and guidelines
Show and hide rulers and guidelines with one click. Rulers can be displayed in percentage and pixel modes. You can drag and drop guidelines for more accurate prototypes.
Page tags and page numbers
Click to add page numbers to all pages, and mark up pages with different colors to show page completion states.
Recycling bin
Deleted pages can be recovered through the Recycle Bin.
Hide pages
You can hide pages that you don’t want to show to others, giving you full control over access to your prototypes.
Open new window
Open a new window within the current project to work on multiple projects at the same time.
Replace text globally
Search the text you want on the current page or within the project, and replace it all at once.
Batch modification
You can batch modify the page size, font, font size, and background color of a single page or the whole project, saving time and effort.
Various markup components
Use our mockup tools (Sticky Note, Arrow,etc.) to add explanations while previewing for ease and convenience
Visualized interaction design
It’s easy to add rich interactions with drag & drop.
Rich pre-built interactive components
Popup Panel, Alert Window, Stack Panel, and Scroll Box allow you to create life-like websites/apps. More interactive components coming soon.
Interactive events and commands
Mockplus Classic has a wide range of interaction commands, such as popup/hide, content switch, show/hide, move, resize, zoom, rotate, terminate, etc.
Execute interaction sequentially/simultaneously
Mockplus Classic supports execution of interactive commands for multiple components sequentially and simultaneously. It also supports execution of multiple interactive commands for a single component sequentially and simultaneously.
Interaction state
You can change colors, text content, and transparency by hovering the mouse.
Auto recovery
Supports auto-recovery of interactions; easy to set reverse interactions.
Transition animations
There are diverse transition animations, including fade-in, push in, slide, etc.
Timer component
With the timer component, you can easily set the delay time of go-to-page and other automatic interactions.
Fast preview
Press F5 to preview your prototypes instantly without wasting time on converting prototypes into HTML.
Cloud sync
Your project can be stored and password-protected in the cloud. This enables you to edit the project and collaborate with team members anywhere, without a USB stick required.
Export to images
Prototypes in Mockplus Classic can be exported to PNGs/JPGs. Multiple export options are available, such as exporting the current screen, including the child page, or the whole project.
Export to HTML
An HTML link is generated after the project is published to the cloud. You can copy and share projects with colleagues and customers for a quick preview.
Export project tree
You can export project trees in various file formats, such as Tree View, Mind Map, Text, CSV, XML, HTML, Markdown, etc. All of these can be fully used in PRD.
Export to offline HTML demo package
Mockplus Classic supports exporting of prototypes to offline HTML demo packages, and you can even deploy prototype projects to your own server for team/company presentation and sharing.
Export to demo package
You are able to export prototypes to .exe files for Windows or .app files for Mac OS X. Viewers can preview your design without installing Mockplus Classic.
Scan QR code to preview app projects
You can scan QR codes with the Mockplus Classic app to view app projects.
Inspect app projects on mobile with view code
You can inspect app projects on mobile with the generated view code.
View app projects with Mini Programs on Wechat
You can scan QR codes with Wechat’s Mini Programs to view app projects.
Print prototypes
With Mockplus Classic, you can print your prototype.
Team project
Mockplus Classic can generate a team project with one click, and you can switch to personal projects easily.
Multiple editors in one prototype
You can share your prototype with others, and they can edit your design instantly.
Review
Invite team members for online review by sending notification emails after publishing projects.
Markup & comment
Gather design requirements and feedback from clients, colleagues, and stockholders by sharing HTML links.
Manage component
Customize your UI library. Collect and reuse common components, images, and designs. Sync and share all resources effortlessly.
Team management
Invite/remove/group team members with one click.
Set roles and permissions for team members
Set various roles such as “Super admin”, “Admin”, “Member”, and “Guest” with different permissions to manage team members easily.
Group management
Group team members for different departments or projects.
View and manage cloud projects
View projects/historical versions, password protection, notification reviews, and download.
Share component & style library
Quickly share a team or personal component & style library.
Batch import images into Mockplus Classic
Batch import images into the canvas to enrich and optimize prototypes in a second.
Subscribe & download components & icon libraries
Share and reuse components and icon libraries for the prototype design.
Page import & export
Export one or multiple pages for sharing or merging with other projects.
Project import & export
Projects can be exported as .mp file and save to local. You can then import them to Mockplus Classic for easy editing and viewing.
Component import & export
Export one or multiple components for sharing or merging with other projects.
Multiple versions available
Multiple versions such as Individual, Team, and Enterprises are available to meet various design requirements for different team sizes.
Offline version
The offline version is available for personal/enterprise use without network limitations.
Enterprise customization
Private cloud deployment service is available for enterprises to build an exclusive design platform in a more secure, more efficient, and professional environment.
Sketch
Export your Sketch designs to Mockplus Classic directly, and transform them into functional prototypes faster and easier.
Mockplus Cloud
All the prototypes you create in Mockplus Classic are fully integrated with Mockplus Cloud, making design-to-dev handoff design smarter and better.
Mockplus Classic design system
Get access to Mockplus Classic UI libraries and build dynamic, sustainable, and cohesive design systems.