Speed up your prototyping process with these Justinmind features Part 2

Justinmind
Justinmind
Published in
5 min readApr 5, 2017

Design outside the lines with these 5 power-prototyping tips. The second of a two-part special

In last week’s post, we showed you how to optimize your prototyping process through leveraging the best of Justinmind’s user interface. In today’s post, we look at Justinmind’s data-driven prototyping, requirements management and teamwork features to help you prototype faster and better.

1 — Data-driven prototyping for the win

Data-driven prototyping is a powerful technique for simulating data in your work. Using data in your designs makes them appear more realistic and helps your users, clients and stakeholders to capture as much information about the final product as possible, prior to production.

You can either add your own, real data or use sample, default data. Using real data has its advantages when working on complex projects. Real, raw data helps you to capture data information related to task specifications, system functionality, interface interaction, prototype screen layouts and behavior, and user feedback. Put simply, the more realistic the data, the easier it is to reproduce prototypes that behave like the real thing.

Sample data is great for quick ’n’ dirty prototyping when the data is simply a placeholder for the real thing, which will be implemented at a later stage. Much like lorem ipsum in design, sample data gives the illusion of simulating real data without distracting the user with readable content, or having to ask for the permissions to use data.

With Justinmind, you can create interactive prototypes with real or sample data. Create a data master with a data grid if you want a grid with sample data. Alternatively, you can import data from a real database by populating your data master with data from a .csv file, or into a data list.

2 — Removing designer-developer friction with developer-friendly prototyping

Designers typically use prototypes to create mid to high fidelity models of their designs prior to development. They create the layout, the content areas, the headers and footers, and add interaction where necessary. Once the design process is up and the design has been approved, it’s down to the developer to code the real thing. This is where the misunderstandings tend to crop up. What’s the font family? What’s the font weight? Was the HEX color code #21coco or #21c0c0? It’s #21c0c0, by the way.

In our latest release, we added some nifty new features to ease the transition from design to development:

The CSS floating palette! Ahoy!

This is a handy tool for anyone looking for an easy way to transfer properties and styles between pages, prototypes and other design tools. Simply select a widget or UI element in Justinmind’s user interface. Then, go to the CSS palette (located by default next to the Properties and Navigator tabs on the right of the canvas), and copy the CSS properties to another design tool or document.

Exporting images

You can also export your images to maintain their color properties. If you have a particular HEX color that you want to remember or send a colleague, you can save and send it straight from Justinmind. Simply select the image, right click + save. Tip: save SVG vector files as PNGs to maintain their color as is.

Tool tip for color drop downs

Hover over the fill or text color drop down to view the selected HEX color.

3 — Prototype reviews to aid communication

Testing and listening to our audience is so important. Feedback and insights from users and clients are what make our designs whole. Hell, it’s what allows us to move forward with the entire production lifecycle.

Prototypes are essentially a communication tool, facilitating a step in the design process. They help the viewer to conceptualize an initial concept as the final output. By taking advantage of effective communication in the prototyping phase of the design process, we can avoid misunderstandings along the way and more effectively serve our users’ and clients’ needs.

With Justinmind, effective communication and collaboration are easy to achieve.

Comment and review

Commenting on a prototype is an easy way to communicate with your team and client, and avoid misunderstandings. In a single click, publish your prototype and invite stakeholders and clients to get involved in the creative process. Get genuine feedback and implement quickly and easily with a hard copy of the comments in your simulation window, and in your online account.

Teamwork

Apart from the review feature for clients and stakeholders, you can work collaboratively with your team. Everyone can edit and make changes to designs simultaneously in order to enhance collaboration and keep everyone on the same page.

4 — Visualize requirements in context

Capturing requirements accurately is the key to any successful project. They are the essence of your project, without which you will soon feel lost and unable to measure project progress. Add multiple project management, design and CRM tools to the mix and you’re looking at a right mess of a time.

Justinmind make requirements management painless. You can create requirements directly within your prototyping tool. All requirements can be organized in customized categories with labels and colors for solid and efficient management.

Additionally, with integrations with Atlassian JIRA and Microsoft TFS, it’s so easy to keep track of your requirements across different tools, and avoid rework by importing issues and tasks so you don’t have to create requirements from scratch repeatedly.

5–50 Justinmind keyboard shortcuts you’re probably not using

Keyboard accessibility and usability benefit everyone. Shortcut keys save time — there’s no way around it. Why? Because they require ‘less movement and effort than a mouse or other pointing’, according to David Sloan and Sarah Horton on User Testing. Imagine having to keep clicking the copy, paste and undo buttons for all the changes you want to make to your prototype. Sure, it’s a fraction of time, a micro-moment. But those micro-moments do add up and eat into time better spent on creating a prototype database or a fetching a cup of coffee.

Lucky for you, these handy shortcuts are available in Justinmind. That’s right folks! Justinmind is the full package, with over 50 keyboard shortcuts for Windows and Mac. Check out the full list here and speed up your prototyping in no time.

Read the original post on Justinmind’s blog.

--

--

Justinmind
Justinmind

The best tool to design and prototype web and mobile apps: www.justinmind.com