Pro­to­typ­ing and Build tools

Web Designer - - Design Faster Code Quicker -

Big hit­ter 1 invision in­vi­sion­app.com

Invision of­fers a way to string to­gether in­di­vid­ual static de­signs in order to cre­ate user flows. The tools are sim­ple and easy to use, and al­low sync­ing di­rectly from Pho­to­shop and Sketch be­fore link­ing de­signs to­gether. With pow­er­ful col­lab­o­ra­tion and comment fea­tures it’s clear to see why so many de­sign­ers use it. FREE with paid plans

Must try 2 Figma figma.com

Figma touts some im­pres­sive fea­tures, but the browser-based ed­i­tor and cloud sav­ing is the dif­fer­ence be­tween most other de­sign and pro­to­typ­ing tools. Figma 2.0 in­tro­duced new pro­to­typ­ing tools, bring­ing the abil­i­ties of mul­ti­ple Adobe apps into one desk­top and browser-based tool! FREE with paid plans

3 Mar­vel mar­ve­lapp.com

Mar­vel, much like Figma, pro­vides an all-in-one ex­pe­ri­ence for de­sign, pro­to­typ­ing and col­lab­o­ra­tion. The de­sign UI is sim­ple and beau­ti­ful, while of­fer­ing all the tools you need. Mar­vel’s pro­to­typ­ing tools en­able both high and low fidelity pro­to­types to be cre­ated eas­ily. FREE with paid plans

4 ax­ure ax­ure.com

Ax­ure is a wire­fram­ing and pro­to­typ­ing tool pri­mar­ily aimed at soft­ware de­vel­op­ment. Ax­ure isn’t try­ing to of­fer ev­ery­thing. In­stead, it of­fers re­ally pow­er­ful tools for rapid pro­to­typ­ing, di­a­gram­ming and doc­u­men­ta­tion and it does them well. paid with FREE trial

5 gulp https://gulpjs.com

Gulp is a fron­tend build tool used to per­form any num­ber of func­tions from com­pil­ing SASS to build­ing SVG sprites. Gulp will save you time and per­form a lot of the repet­i­tive tasks re­quired, en­abling you to con­cen­trate on writ­ing code and build­ing ap­pli­ca­tions. FREE

6 grunt grun­tjs.com

An­other fron­tend build tool that’s used in the same way as Gulp with the aim of sav­ing you time and ef­fort when build­ing the fron­tend of any web­site or app. These tools have be­come an im­por­tant part of fron­tend de­vel­op­ment due to their abil­ity to per­form repet­i­tive tasks. FREE

7 yarn yarnpkg.com

Yarn is a pack­age man­ager. It works much the same as Node Pack­age Man­ager (npm). Yarn caches ev­ery pack­age mak­ing it in­cred­i­bly fast to down­load and in­stall de­pen­den­cies, and with all of the same pack­ages as npm so you can eas­ily make the switch. FREE

8 web­pack web­pack.js.org

Web­pack is a Javascript mod­ule bundler that en­ables you to keep your Javascript files small and fo­cused. In its sim­plest form Web­pack will then bun­dle them all into one mini­fied JS file which can be in­cluded in your web­site or ap­pli­ca­tion. FREE

“Mar­vel, Much like Figma, Pro­vides an all in one ex­pe­ri­ence For de­sign, Pro­to­typ­ing and col­lab­o­ra­tion. the de­sign ui is sim­ple and Beau­ti­ful, while of­fer­ing all the tools you need”

Newspapers in English

Newspapers from UK

© PressReader. All rights reserved.