Mockups To Go, Ready To Use: Captcha, Password Strength, Calendar

One of the most popular things about our little tool is how quickly you can create meaningful wireframes with it.

But there are ways to go even faster with Mockups. Symbols, for example. Symbols let you create reusable common elements across different mockups. Useful, right?

Another way to speed up the process of creating your wireframes is to browse mockups, symbols and UI controls from our community on Mockups To Go. They are free and ready for you! You can contribute, too. 🙂 Find more information here.

If you are looking for some UI Controls that aren't included in the standard set of Mockups controls, here are some symbols that could save you time.

Captcha

...who doesn't need a Captcha??

Form Captcha inspired by Google Keyword Tool. Contributed by Dima Semensky.
Captcha
Download Image and BMML here

Password Strength

No need to recreate these ever again!

Password strength indicator controls. Contributed by Alain.
Password Strength
Download Image and BMML here

Calendar

A calendar with a monthly view, ready to use in a sidebar or wherever you need it to be shown.

Contributed by Piet.

Download Image and BMML here

If you haven't used Mockups To Go before, read these instructions first. Then find the controls above and more on Mockups To Go!

Creating Project Templates and Examples for Polished UX and Bootstrap Projects

· Posted by mike in Products and tagged , · 3 Comments

We created a tutorial to give you some ideas for how to create project templates that contain elements you commonly use in your projects.

Along with this tutorial, we created two example templates.

The UX Template is designed for people working on UX Design projects who typically need to present a polished deck to clients. Here's a preview of what you'll find in this template.

The Bootstrap Template is designed for people who know they're going to be using Bootstrap, and want to use the text elements, and components common to the Bootstrap framework. Here's a preview of what you'll find in this template:

You'll find more information, including videos for how to get started in the tutorial.

div.gallery a.thumb {
display: block;
position: relative;
float: left;
height: 200px;
width: 200px;
margin: 0 12px 12px 0;
border: 3px solid #eee;
}
div.gallery img.thumb {
display: block;
position:absolute;
clip:rect(0px,200px,200px,0px);
width: 400px;
}